WordPressテーマ[SWELL]の「メインビジュアル」で画像をランダムに取得して表示することができます
![](https://ysuke.me/wp-content/uploads/2022/07/ysukeme38730845781.png)
toc
著作権フリーの画像をランダムに取得して表示
おすすめWordPressテーマ[SWELL]の「メインビジュアル」で画像をランダムに取得して表示することができます。「メインビジュアル」とは、トップページを開いた時に最初に表示される場所のことです。
このページ(ysuke.me)のトップページもこの方法でメインビジュアルの画像をランダムに取得して表示させています。
「Unsplash Source」というサービスを使います
今回使用するのは「Unsplash Source」というサービスです。フリーで写真をダウンロードできる「Unsplash」が提供するWEBサービスです。次のようなURL(例:https://source.unsplash.com/640×400“)にアクセスするたびにランダムで画像を表示してくれます。
あわせて読みたい
![](https://images.unsplash.com/opengraph/1x1.png?blend=https%3A%2F%2Fimages.unsplash.com%2Fphoto-1719297523639-b104d382c497%3Fblend%3D000000%26blend-alpha%3D10%26blend-mode%3Dnormal%26crop%3Dfaces%252Cedges%26h%3D630%26mark%3Dhttps%253A%252F%252Fimages.unsplash.com%252Fopengraph%252Fwordmark.png%26mark-align%3Dmiddle%252Ccenter%26mark-w%3D424%26w%3D1200%26auto%3Dformat%26fit%3Dcrop%26q%3D60%26ixid%3DM3wxMjA3fDB8MXxhbGx8fHx8fHx8fHwxNzIxNTMwODY1fA%26ixlib%3Drb-4.0.3&blend-w=1&h=630&mark=https%3A%2F%2Fimages.unsplash.com%2Fopengraph%2Flogo.png&mark-align=top%2Cleft&mark-pad=50&mark-w=64&w=1200&auto=format&fit=crop&q=60)
![](https://images.unsplash.com/opengraph/1x1.png?blend=https%3A%2F%2Fimages.unsplash.com%2Fphoto-1719297523639-b104d382c497%3Fblend%3D000000%26blend-alpha%3D10%26blend-mode%3Dnormal%26crop%3Dfaces%252Cedges%26h%3D630%26mark%3Dhttps%253A%252F%252Fimages.unsplash.com%252Fopengraph%252Fwordmark.png%26mark-align%3Dmiddle%252Ccenter%26mark-w%3D424%26w%3D1200%26auto%3Dformat%26fit%3Dcrop%26q%3D60%26ixid%3DM3wxMjA3fDB8MXxhbGx8fHx8fHx8fHwxNzIxNTMwODY1fA%26ixlib%3Drb-4.0.3&blend-w=1&h=630&mark=https%3A%2F%2Fimages.unsplash.com%2Fopengraph%2Flogo.png&mark-align=top%2Cleft&mark-pad=50&mark-w=64&w=1200&auto=format&fit=crop&q=60)
Beautiful Free Images & Pictures | Unsplash
Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos.
あわせて読みたい
Unsplash Image API | Free HD Photo API
Create with the largest collection of high-quality images that are free to use. Trusted by Trello, Medium, and thousands of other API applications to power the…
実際の表示
サンプル1
※更新すると毎回違う画像が表示されます。
画像サイズ:640×400
キーワード:mountain
サンプル2
※更新すると毎回違う画像が表示されます。
画像サイズ:400×400
キーワード:girl
サンプル3
※更新すると毎回違う画像が表示されます。
画像サイズ:1500×500
キーワード:blur