wordpressスポンサーリンク8年間使っていたテーマ「vicuna」にサヨナラを告げた後、色々と見てまわってようやく出会えたこのテーマ。レスポンシブ対応のフリーテーマ「Pinboard」です。Sponsored“Pinboard”を選んだ理由まずは、ぱっと見てデザインがシンプルで、可愛らし過ぎもなく、派手すぎることもなく、クール過ぎることもなく、記事の邪魔をしなさそうだったこと。それから、レスポンシブ対応デザインだったこと。touchというプラグインを使ってスマホ対応していましたがカテゴリが表示されなかったり、サイトの雰囲気がまったく別だったりで、あまり満足していませんでした。テーマを変えるのであれば絶対レスポンシブ対応テーマにしようと思っていたので、その点もこの「Pinboard」はクリア。レイアウトデザインやフォントも管理画面からカスタマイズでき、ウイジェットも豊富。つけたかったフッターも楽々。トップページのグリッド表示も綺麗で見やすい。SEO対策もされているコード。記事の写真サイズも今までよりずっと大きく見せられます。実は、一時期話題になった日本語テーマ「Stinger」というのも前にちょっとだけ気になっていたんですが、製作者の方のブログが苦手なのでやめました(笑)実際「Pinboard」を入れてみたら色々修正しないといけないとこがあったので、自分の備忘録としてここからはただのメモです。Pinboardを入れてからやったことまずは役だった記事。2daimemo管理画面は英語なのですが、上記の記事に詳しく説明されていたので助かりました。iFrameでコードを取得し、幅のところを100%に変更。protocol」を使うことにしました。設置後、デバッガを使って確認してみると、下記と同様のエラーが出ました。kira-ism上記に従って修正したら、ちゃんと動くようになりました。IDを入れただけではなくサイトのURLもきちんと入れることを忘れずに。Postですが、バージョンアップに伴いエラーが出るようになったのでこちらに変更。設定に関しては上記を参考に。デフォルト表示だと、タイトル文字がはみだしたりと見苦しかったのとレスポンシブ対応ではなかったので修正が必要。あきらWeb(スマホ&タブレット対応)yarpp-template-linkwithin.phpというファイルを作ってテンプレートフォルダの中に入れます。?>まぁ、悪くはない感じに。?>をsingle.phpなどに直接記入します。タイトルなどが太字になってしまうのを修正する場合は、プラグインフォルダの中のYARPP>style>related.cssをいじります。boldの部分を削り、line-heightを追加して調整。Catchという日本語プラグインを導入。ウイジェットが追加されます。投稿件数や日付表示、画像サイズなどは調整可能。W160px,H80pxに設定しました。サイドバー上部にプロフィール掲載Aboutページがあるからいいや、と思っていたのですが、最近はどのブログを見てもサイドバートップにプロフィールを一部掲載している人が多いですよね。私自身、どういう人がその記事を書いているのかやっぱり気になるのです。googleも著者情報を重要視していますし、「誰が書いているのか」は大事。画像と自己紹介をほんのすこしのせて、twitterのフォローボタンもつけてみました。feedはgoogleのfeedburnerを使用しています。日本語版はサービス終了してしまったので、いつ英語版が終わってもおかしくはないのですが、とりあえずまだ継続使用中。feedを表示されるようにしました。href="http://feeds.sky-s.net/sorarium">を追加。Thumbnail」を入れるべし私はブログ更新にMarsEditというアプリを使用しています。これが無いとブログ更新が出来ないというぐらい便利なアプリ。Thumbnail」を入れました。これは過去記事の画像も生成してくれるので助かります。これを入れてアイキャッチ画像を作ったら、無事にトップページにも表示されるようになりました。Adsenseをレスポンシブ対応にいつの間にか出来ていた「レスポンシブ広告ユニット」を試してみることにしました。これだと一つのコードの中で、PC用の大きなサイズ、モバイル用の小さなサイズに自動的に切り替えてくれます。}画面が500pxサイズ以上なら336px/280pxの広告ユニット、それ以下なら250px/250pxの広告ユニットを表示させるようにしました。これをテーマのsingle.phpに書き込みます。サイドバーはウイジェットのテキストを使って同様に入力。class=”ad-box”></div>で囲って、上記参考記事と同様にCSSで調整しています。基本的にadsenseコードは修正不可ですが、レスポンシブ広告ユニットに関しては上記参考記事にも書かれているように認められています。特定記事のアドセンスを表示させないようにするついでに前からやっておかなくてはと思っていたことを。Fieldというプラグインを使う)で、アドセンスの表示の切替を行う方法。アドセンスには禁止コンテンツがいくつかあります。処方箋医薬品、そしてビール、ハードリカー、リキュールを販売または宣伝するページでの広告掲載もアウトです。※ちなみにワインやシャンパン、ビールの蒸留や醸造の方法に関する情報はOK。Amazonでのお酒直販がスタートしているので、ここは注意しないと危険ですよね。私自身はビールは飲まないし、アルコール類の紹介もワインぐらいでほとんどしてないので大丈夫だとは思うのですが、念のため設定はしておくことにしました。widgetを入れてみたのですが、どうしてもエラーが出てサイドバーの広告だけ消えない。single.phpに直接書き込んだのと同じコードなのになぜ〜。これだけどうしても解決できなくて、結局ビール記事は1つだけだったので今は非表示にしてあります。誰か解決策をご存知でしたら教えてください〜。(追記)→結局色々問題が出てくるので、このコードは外しました。(追記)アドセンスを「more」タグ直下に表示する当初、アドセンスはタイトル下、記事下、サイドバーに表示させていました。このPinboardはレスポンシブ対応のテーマ。モバイルで見た時も同じ場所に表示されます。アドセンスの規約には、PCでもモバイルでも以下のようなポリシーが記載されています。広告を区別しにくい例です。ヘルプまたページ上部に多くの広告を配置することでgoogleの検索順位が下がるページレイアウトアルゴリズムもありますし、できればモバイルでもPCでもあまりファーストビューに広告を入れすぎたくはないな、という思いがありました。Advert」というプラグインを使ってmoreタグ以降にアドセンスを表示させようとしたところ、何やらエラーが。いうわけで仕方がないので、function.phpに直接記載する方法をとりました。上記記事に書かれているコードがそのまま使えます。記事中にアドセンスを表示させる場合、記事なのか広告なのか紛らわしいため規約違反となる可能性があります。$contentData;}とfunctions.phpに新しく追記。hrタグとsponsoredという文字を大きく入れて、広告であることをきちんと明示するようにしています。{color:#e0e0e0;font-size:18px;}CSSの方の記述はこちら。実際はこんな風に表示されます。パンくずリストを設置single.phpに以下のように記述してパンくずリストを表示。?></div>ソーシャルブックマークをカスタマイズするそのままだと目立たないですし、Pinterestボタンとかはいらないのでちょっとカスタマイズ。いじるのは、function.phpです。し、widthの指定を外す。?>">Tweet</a>とあるので、data-count=”vertical”という部分を追加する。{width:80px;}追加。?>"></div>mediumをtallに変更。?>をfunction.phpに追加。