コトダマウェブホームHTMLCSSBootsrtapWordPressプラグインphotoshopIllustratorJavaScriptjQueryその他サーチコンソールGoogleアナリティクスツールWordPressとデザインが学べるWebメディアmenuホームWordPressWordPress|出力されるサムネイルのサイズを追加する方法WordPress2018.02.18WordPress|出力されるサムネイルのサイズを追加する方法テーマをカスタマイズして、記事のアイキャッチ画像など任意のサイズで出力させたいときってあると思います。ここでは、新しいサイズのサムネイル画像の設定方法についてお話します。最初にお話しておきますが、テーマを変えたり新しいサムネイルサイズの追加をした場合、それまでにアップロードされた写真については、新しいサイズの画像は生成されませんのでお気をつけください。過去にアップした画像の新しいサムネイルを生成するにはこのプラグインを使ってください。2018.02.20アップロード済みの画像サムネイルをリサイズできるプラグインWordPressでアイキャッチ設定済みの記事を複数入れた後でテーマを変えたとき、functions.phpを編集して新しいサムネイルサイズを登録したときなどは、過去にアップした画像については新しいサイズのサムネイルが生成されません。新しいサムネイル画像サイズを追加する方法ここでは、「外観」>「テーマの編集」から「テーマのための関数」というファイルを編集する方法についてご紹介します。「外観」>「テーマの編集」から編集できるテンプレートのほとんどは、ページのテンプレートかページをデザインするスタイルシートのファイルになっています。「function.php」というファイルだけは、テーマの機能的な情報が記載してあるファイルなの...function.phpに画像サイズを追加するコードを追加する新しいサムネイルサイズの設定は下記のコードを追加するだけです。切り取り);サイズ名は半角英数字で入力してください。分かりやすくするために「img180x180」のような名前にすると良いと思います。true);※サイズに単位(px)は入れません。ここで設定した名前がサムネイルを出力させるときに必要になります。横幅、高さ(ピクセル)は数字で入力します。「切り取り」の部分は画像を設定したサイズにトリミングするかどうかの設定です。true);このように入力します。反対に、切り取りをしない場合は最後の項目を省力して、次のように書きます。高さ);サムネイルのトリミング設定について切り取りをするしないの意味がいまいち分からない方がいるかもしれないので、具体例で見てみたいと思います。次の元画像を180×180ピクセルのサムネイルサイズにしたい場合true:切り取りをする場合このように設定したサイズ(180×180)で画像が切り取られます。画像の縦横の比率が保たれたまま画像が縮小されます。この画像の場合、横長なので横幅は180ピクセルになりますが、高さは元画像の比率が保たれ101ピクセルで生成されます。どちらの設定が良いかはみなさんのやりたい方向で決めてくださいね。最後に作成したサムネイルのサイズで画像を出力する方法について見ていきたいと思います。アイキャッチが表示されているテーマのソースコードを見ると、下記のようなコードが見つかるはずです。the_post_thumbnail();このカッコの中に先ほど、作成したサイズ名を「’」でくくって入力します。the_post_thumbnail('サイズ名');以上で作成したサイズでサムネイルが表示されます。