WordPressのテーマはSimplicity2.1.0にしました

WordPressのテーマはシンプルなものを探しいたところ、「内部SEO施策済みのシンプルな無料Wordpressテーマ」のSimplicityをみつけました。

Simplicity1.9.3が安定版で、2 は現時点でBeta版です。子テーマ、スキンについも今後、触っていこうと思います。

simplicity2

Simplicity2のダウンロード

無料WordpressテーマSimplicity2のダウンロードは以下になります。

無料WordpressテーマSimplicity2のダウンロードはこちらです。インストール方法はこちら。テーマのアップデート方法は、以下を参照してください。Simplicity2のダウンロードWordPress4.1以上、PHP5.4以上で

ダウンロードしてzipファイルをアップロードし、テーマをインストールして有効化します。
導入時はバージョン:2.1.0 20160227mでした。

Simplicity2の画像アップロード設定

コントロールパネルの「設定」→「メディア」でアップロードする画像サイズを指定することができます。

Simplicityでお勧めなメディアのサムネイルサイズ設定

上記の記事を参考に同じように設定しました。「Simplicity」の最大横幅は680ですので、「大サイズ」の横幅は680にします。「サムネイル」と「中サイズ」は初期設定より大きくしました。

media-setting

Auto Post Thumbnailは不要

記事のサムネイル(アイキャッチ)画像は、なんとなくあったほうがよさそうなので、すべての記事で設置します。自動で挿入できるプラグインを探していたところ、「Auto Post Thumbnail」がありました。これは、記事の最初の画像をアイキャッチ画像に自動で設定してくれるプラグインです。

そのあとに、Simplicityのサイトをよくみると、テーマの機能でアイキャッチの自動設定がありました。
「ダッシュボード」ー「外観」ー「カスタマイズ」ー「画像」から設定できます。デフォルトではオフになっています。こちらをチェックをつけて「保存して公開」にしました。「Auto Post Thumbnail」プラグインは削除しました。

simplicity-thumbnail

しばらく記事を投稿してみましたが、アイキャッチは自動でやるよりも、手動で登録したほうがおすすめです。

子テーマのインストール

ファビコンの設定はWordPressの4.3から標準機能になりました。そのまえは、プラグインや直接headerに記述する方法もありました。また、ファビコンの設置機能を持つテーマもあります。Simplicityはどうなっているか調べたところ、Simplicity提供の子テーマをインストールし、そこに含まれている画像を変更する方法があることがわかりました。

現在、Wordpressデフォルトの機能として「サイトアイコン」設定項目が実装されています。ファビコンやアップルタッチアイコンを設定したい場合は、「サイトアイコン」機能を利用することをおすすめします。「サイトアイコン」機能は、Wordpre

テーマをカスタマイズする場合も子テーマを編集する方法が推奨ですので、子テーマをインストールしました。Simplicity2の子テーマのダウンロードは以下になります。

テーマをカスタマイズするなら親テーマの直接編集はお勧めできません。というのも、ダウンロードページで配布しているテーマファイルを直接編集すると、アップデート時に編集下部分がが上書きされ、せっかくのカスタマイズが全て消えてしまいます。それを防ぐ

ダウンロードしてzipファイルをアップロードし、テーマをインストールして有効化します。導入時はバージョン:20160110でした。子テーマを有効にしたとき、親テーマでカスタマイズした設定は引き継がれませんので注意しましょう。

simplicity-child

子テーマ内に含まれる4つの画像ファイルを変更する

screenshot.png(400×324)

OGP、Twitter Cardsで表示されるサイトイメージとして使用される(テーマの管理画面でも)
screenshop.pngを調べてみたら、サイズは880x660pxでファイル形式はpngがベストみたいです。実際には 387×290 のサイズで表示されますが、画像サイズを2倍にすることで画面解像度の高いディスプレイにも対応できるとのこと。ここでは解像度の高いディスプレイは忘れて、simplicityのサイズである400×324に合わせておきます。

screenshot

↓変更

screenshot

images/og-image.jpg(640×480)

OGP、Twitter Cardsで記事などに画像がない場合に使用されるイメージ。

og-image

↓変更

og-image

images/favicon.ico(32×32)

サイトのファビコンとして使用されるアイコン。

favicon

↓変更

favicon2

images/apple-touch-icon.png(75×75)

アップルタッチ画像。

apple-touch-icon

↓変更

apple-touch-icon.png

変更する画像をアップロードする

FTPのソフトウェアを利用して、4つの画像を置き換えればよいのですが、今回はあえて、ファイアバードが提供しているWebインタフェースのFTP機能を利用しました。

ネットオウルにログインします。https://secure.netowl.jp/netowl/

netowl-login

ファイアーバードの「管理画面」をクリックします。

ftp1

「サーバー管理ツール」をクリックします。

ftp2

「FTPアカウント設定」をクリックし、ドメインを選択し、「ログイン」をクリックします。

ftp3

themes/simplicity2-childフォルダの「screenshot.png」を別名にして「確定」をクリックします。確認ダイアログで「OK」をクリックします。

ftp4

「アップロード」をクリックして、ローカルのscreenshot.pngを選択してアップロードします。

ftp6

ダッシュボードでテーマの管理画面を確認すると写真が変更されていることがわかりました。screenshot.pngやog-image.jpgはOGP、Twitter Cardsで表示されるサイトイメージとして使用されるため、実際のサイトのスクリーンショットやサイトイメージの画面が良さそうです。あとで変更します。

同様にimagesフォルダの3ファイルもアップロードします。

ファビコンを有効にする

ダッシュボードの「外観」ー「カスタマイズ」ー「その他」で「ファビコンを有効」と「アップルタッチアイコンを有効」にチェックを入れて保存します。

simplicity2icon

これでファビコンとアップルタッチアイコンが有効になりましたので、画面を更新して確認してください。

favicon3

フリーのファビコンを設置してみましたが、背景が透過の場合は、ブラウザの設定にもよりますが見難いですね。ファビコンは小さいのではっきりとした色でシンプルな形がおすすめです。あとで変更する予定です。

スポンサーリンク
memordmレクタングル(大)
memordmレクタングル(大)

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
memordmレクタングル(大)