WordPress

WordPress★オリジナルテーマにサムネイル画像を設定する

投稿日:

Wordpress

 

オリジナルテーマを作ったときに、
「外観」>「テーマ」の一覧表示でサムネイル画像が出るようにする方法。

今回のWordPressのバージョンは4.7.3です。

何も設定してなければ、

スクリーンショット 2017 03 19 14 22 52

サムネイルが入る部分が白と薄いグレーの市松模様になっています。

 サムネイルを設定するには?

  1. サムネイル画像を用意します。
    サイズはヨコ1200×タテ900px(デフォルトのテーマにはいっている同じ名前の画像ファイルのサイズを調べてる見るとこのサイズになっていました。)
    ヨコ880px タテ660pxでも大丈夫みたいです。(^_^)
    ファイル形式はjpgでもpngでもOK。

     

     

  2. 用意した画像ファイルの名前を「screenshot.png」に変更します。

     

  3. オリジナルテーマフォルダの中に入れます。

    スクリーンショット 2017 03 19 14 23 17 

     

     

  4. 「外観」>「テーマ」からサムネイルが設定されているのを確認します。

スクリーンショット 2017 03 19 14 23 46 

サムネイルがあると、
どんなレイアウトだったかが一目でわかって
使い勝手が向上しますね。

インストール時にはいっている「twenty seventeen」というテーマをもとにしてカスタマイズしてみようと思います。
今回は、このテーマの「子テーマ」をつくったので、そこにサムネイルを設定しました。

 

 





-WordPress

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

WordPress★「リンクを新しいタブで開く」をデフォルト設定にするプラグイン

ワードプレスで記事をいているときによく使うリンク設定。 大抵は外部リンクなので新しいウインドウで開いて欲しい。 そんなときは、いちいち歯車ボタンをおして、 設定ウインドウを出して、チェックをいれる。 …

WordPress★Gutenbergにカスタムブロックをつくる 1

Gutenbergになったら、「TinyMCE テンプレート」というテンプレートプラグインが使えなくなってしまいました。 あらかじめ設定したひな形を呼び出して使えるのでとても便利だったのに。。。 この …

WordPress★コメント入力フォームをカスタマイズする

  WordPressのバージョンは4.7.3 コメント入力フォームをカスタマイズする方法です。変更内容は 1)コメントの入力フォームで不要な部分を非表示にする 2)入力フォームの文言を自由に変更する …

WPテーマカスタマイズ★「Emanon Free」編 vol. 1

このページのもくじ テーマの入手方法head内にfunctions.phpを使ってjsやcssを追加する方法パーマリンクとURLスラッグコピーライトを編集する テーマの入手方法 このテーマは、テーマの …

WordPress★アイキャッチ画像を自動で設定してくれるプラグイン

  WordPressで記事の投稿時に、自動でアイキャッチ画像の設定をしてくれるプラグインといえば「Auto Post Thumbnail」が有名ですが、最近はなぜかうまく動作してくれず使用 …

サイト制作・グラフィック制作をしているデザイナーです。制作で躓いたことの備忘録としてこのブログを始めました。
たくさんの検索結果から、実際に何度も何度も自分で試してみて、自分に合うなと思った方法やうまくいった方法をこのブログに書き留めています。
プログラム関係のことはもっぱらコピペ派。
自分でゴリゴリ書くことはできません。。。プログラムが分かる人がうらやましいです。
そんな私でもなんとかサイト制作ができるのはグーグル先生と貴重な情報をおしげもなく公開してくださっているたくさんの方々のおかげ。
有志のみなさまに日々感謝しつつ制作させていただいています。