2016/10/27ご訪問いただき有難うございます。今回は、WordPress無料テーマ「Simplicity2」のご紹介と公式サイトに掲載されていないカスタマイズ例を掲載いたします。目次WordPressテーマ「Simplicity2」ってどんなテーマ?仕様に関して制約は無いのか?この記事で提供しているカスタマイズ例Simplicity2.3.0bのカスタマイズ例マウスオーバー(a:hover)時のメニュー背景色をCSSでオリジナルカラーにする記事一覧の画像をサムネイルじゃなくて予めカスタムフィールドやアップロードしておいた画像を表示する投稿記事内の関連記事を画像付きで表示した際の画像をサムネイルじゃなくて予めカスタムフィールドやアップロードしておいた画像を表示する投稿記事本文にテンプレート側で定型記事を挿入する方法WordPressテーマ「Simplicity2」ってどんなテーマ?@MrYhiraさん製作のWordPressテーマとなっていて、公式アナウンスによると以下の特徴を持つシンプルなWordPressテーマとなっています。シンプル内部SEO施策済み拡散のための仕掛けが施されている端末に合わせた4つのレスポンシブスタイル手軽に収益化ブログの主役はあくまで本文カスタマイズがしやすい仕様に関して制約は無いのか?無料&商用利用可のWordPressテーマなのでどんな方でも利用いただけるようです。この記事で提供しているカスタマイズ例この記事では、Simplicity2公式サイトに掲載されていない、テンプレートのカスタマイズ方法を記載しています。カスタマイズ実装時にデザインが崩れてしまう可能性も有りますので、十分に注意して実装する事をおすすめします。スポンサードサーチSimplicity2.3.0bのカスタマイズ例マウスオーバー(a:hover)時のメニュー背景色をCSSでオリジナルカラーにするSimplicity2.3.0bでは、パソコンなどでマウスを使用する場合に、通常テキストやリンクにマウスを置いた(マウスオン)場合、デフォルトの設定カラーが適用されるのですが、マウスオン時のカラーを変更する方法です。記載日:2017/8/31対象設定名:WordPressの外観>カスタマイズ>追加CSSWordPressのデフォルトの機能の外観テーマカスタマイズから行います。Simplicity2がテーマに設定されていればカスタマイズ画面の左下に「追加CSS」というメニューが表示されていると思います。background-color:#004786;}「background-color:#004786」で色指定をするので、#004786を好みのカラーコードに変更して自由にカスタマイズしてください。設定を適用させて、マウスオン時のカラーが任意のカラーになっているのを確認できれば、完了です。IMAGE」の代替え画像の前にもう一つ共通の画像や各投稿記事にカスタムフィールドで個別に画像URLなどが存在しておいて、その画像を表示させる方法となります。画像表示の順序としては以下となります。?>「onerror」で仮に掲載画像が無い場合は代替画像が表示されるようにコードが埋め込まれていますので、代替画像も任意の画像に変更したい場合は、アップロードして{代替画像}の個所にアップロードした画像URLを指定してあげれば表示されます。代替画像についてはそのまま問題無い場合は{代替画像}は変更せずにそのままにしておけば大丈夫です。※一覧の表示方法によって「デフォルトのエントリーカード表示の場合」以下や「大きなサムネイルカードの場合」以下の該当箇所を変更しないと表示されないので注意が必要です。ファイルを更新して、正常に表示されているのが確認できれば完了です。IMAGE」の代替え画像の前にもう一つ共通の画像や各投稿記事にカスタムフィールドで個別に画像URLなどが存在しておいて、その画像を表示させる方法となります。画像表示の順序としては以下となります。?>「onerror」で仮に掲載画像が無い場合は代替画像が表示されるようにコードが埋め込まれていますので、代替画像も任意の画像に変更したい場合は、アップロードして{代替画像}の個所にアップロードした画像URLを指定してあげれば表示されます。代替画像についてはそのまま問題無い場合は{代替画像}は変更せずにそのままにしておけば大丈夫です。※一覧の表示方法によって「デフォルトのエントリーカード表示の場合」以下や「大きなサムネイルカードの場合」以下の該当箇所を変更しないと表示されないので注意が必要です。ファイルを更新して、正常に表示されているのが確認できれば完了です。投稿記事本文にテンプレート側で定型記事を挿入する方法Simplicity2.3.0bでは、予め各記事に登録しているカスタムフィールド値などを活用して投稿記事本文に個別の画像や情報を掲載する事ができます。投稿記事のテンプレートに直接追記しておけばWordPressのCMSとしての機能を一層活かすことができます。「Simplicity2」で投稿記事本文にテンプレート側で記事を挿入する方法を紹介します。記載日:2016/10/27対象テンプレート名:entry-body.php外観>テーマの編集>entry-body.phpを開いて以下のコードを確認する(子テーマをインストールしている場合は、子テーマのentry-body.phpを開く)。//デフォルト:続きを読む?>上記コードで投稿記事本文が出力されているので前後に挿入したい記事内容を追記していけば完了です。カスタムフィールドをテキストで出力する方法は以下です。?>{カスタムフィールド名}を各投稿記事に登録されているカスタムフィールド名に変更すれば完了です。簡単なので是非試してみてください。最後までお読みいただきありがとうございます。これからも、新しい公式テーマサイトに掲載されていなさそうな、新しいカスタマイズ方法があった際は、更新していきますので宜しくお願いいたします。コピーrealinemeをフォローするrealinemeREALINE関連記事PHPWordPressでプラグイン無しでパンくずリストを表示させるコードHTMLのSEO対策で人気のあるパンくずリストをコピペだけで簡単に設置したいと思われる方がGoogle検索で色々調べていると思います。実は僕も何度も検索した事があるのですが、とても参考になるサイトがありましたので参考にさせていただきました。無料なのにSEO対策も施され、アフィリエイトやブログやビジネスホームページなどオールマイティなテーマとして多くの人に愛されています。PLUS」を...2016/09/18wordpress【WordPress】会員制サイトのプラグイン紹介WordPressを使って会員制サイトを作成する際の最新のおすすめプラグインを紹介しています。オリジナルコンテンツを会員限定公開したいサイトオーナーにおすすめです。最新の会員制サイトプラグインを紹介していますので、これから会員制サイトを作成したい人にもおすすめです。FanZoneというものが有ります。デフォルトでは、一覧リストに画像が表示されていないのですが、画像を表示する方法を記載します。メディア)は、AMP対応・SEO最適化・レスポンシブ・高機能。WordPressテーマです。viewsタイトルとURLをコピーしました。