初心者がWordPress(simplicity2)をおすすめ改造_AMP対応

スポンサーリンク

 

まだまだ初心者の域を脱していないが、simplicity2の改造(改造ってほどでもないが)しましたので、忘れないうちに書き留めておきたいと思っています。

 

改造した日:2018/01/25

初心者ですがWordPress(simplicity2)を少しずつ改造しています。
ブログを始めて、約半年が経ちますが思ったようにPVは増えません。 内容の問題なのか、記事数の問題か、とにかく検索流入がまだ少ないのです。 思い当たる節は、8月から9月にかけて、Google神にAdSenseの停止を受けたくらいです。 他の人のBLOGでは、3ヶ月100記事で、飛躍的にあるいはだんだんとPVが増えていくよ...

 

スポンサーリンク

 

AMP対応

ampに対応させるため、最初はプラグインの「Accelerated Mobile Pages」を使用していましたが、英語対応でよく分かりません。

 

 

しかし、simplicity2には 外観 → カスタマイズ → AMP(β機能)があり、それを使うことにしました。

 

 

まあ、チェック1つ入れるだけで済むので、簡単極まりないです。

そのついでに、AMP用のAdSenseコード も設定することにしました。

 

 

 

AMP用広告ユニット

GoogleAdSenseの広告の設定から、APM専用の新しい広告ユニットを新規に設定します。

 

この時注意するのは、広告のサイズ 300×250 レクタングル で設定すること。

そして、コードを取得します。

 

<amp-ad width=”300″ height=”250″ type=”adsense”
data-ad-client=”ca-pub-XXXXXXXXXXXXXXX”
data-ad-slot=”XXXXXXXXXX”></amp-ad>

 

取得したコードの中から、
data-ad-client=[ ***    ] data-ad-slot=[ ***    ]

***の部分を抜き出して、ampのほうのXXXXXXXに書き加えます。
(2行とも、写しましょう)

 

できあがったコードを、外観 → カスタマイズ → AMP(β機能)の
AMP用のAdSenseコードの枠の中に貼り付けて終わり。

簡単でしたね。

 

 

AMP広告の位置

amp広告は設定できましたが、広告の位置が下段の2カ所になっており、上部の方が少しさみしいので、上段にも広告を載せたいと思い、いじくってみました。

投稿本文記事下 と 関連記事下の2カ所 が規定値でした。

 

最初に

親テーマから「amp-content.php」を子テーマ(child)にコピーします。

ロリポップにおいては、「ロリポップ!FTP」で簡単にコピーできます。
(子テーマを改造しないと、バージョンアップした時に消えて無くなります)

 

 

外観 → テーマの編集 →  amp-content.php

<?php //AMP用のアドセンスコード
get_template_part(‘ad-amp’); ?>

 

広告を載せたいところに、この2行を挿入します。

 

今回は、投稿本文上にセットしました。簡単でした。

 

 

AMP用プロフィールを削除

ついでに、通常BLOGではプロフィールが、終わりの方へ(関連記事の上)にでているのを消していたので、統一するためにもAMP表示も消すことにしました。

 

(ソーシャルサービスと関連記事の間にプロフィールがでます。)

 

 

外観 → テーマの編集 → テーマファイル(右端の枠から) amp.css に

/* 作成者を消す */
.footer-post-meta {display: none !important;}

を書き加えて、登録。

すると、ちゃんと消えていました。めでたしめでたし。!

 

 

スポンサーリンク

 

PC画面の改造

まだ、関連コンテンツ広告の域に達していないこのブログは、AdSense収入はわずかなものです。

 

したがって、他の広告に頼っているのが現状で、改造を試みました。

 

 

インフィード広告

BLOGのインデックスリストのボトムには、ダブル「PC広告用ダブルレクタングル」を貼っていますが、インデックスミドルにはPC開示用として、インフィード広告を貼っていました。

 

これは、記事リスト3行の下に、広告が出てくるシステムです。

インデックストップには、メニューがぶら下がって、広告を隠してしまう恐れがあるので、インフィード広告は貼っていませんでした。

 

記事リストを20行に設定しているので、少しさみしいと思い、3行毎に広告をだせないものかと、考えていました。

そこで、改造することにしました。

 

親テーマから「list.php」を子テーマ(child)にコピーします。

 

ロリポップにおいては、「ロリポップ!FTP」で簡単にコピーできます。
(子テーマを改造しないと、バージョンアップした時に消えて無くなります)

 

 

外観 → テーマの編集 →  list.php

//6つ目のアイテムの下にインデックスリストミドルウィジェットを表示するか
if ( $count == 6 && //6番目
is_list_style_entry_type() && //表示タイプがエントリーカードタイプの時のみ
is_active_sidebar( ‘widget-index-middle’ ) && //インデックスミドルに値が入っているとき
!is_pagination_last_page() && //インデックスリストの最後のページでないとき
is_posts_per_page_6_and_over() //1ページに表示する最大投稿数が6以上の時
) {
echo ‘<div id=”widget-index-middle” class=”widgets”>’;
dynamic_sidebar( ‘widget-index-middle’ );
echo ‘</div>’;}
赤い文字の「」を変えると、その数字の下段にインフィード広告が出てきます。
(ただし、ポリシー違反になる可能性もあり、今は様子見です。)

これをコピーして行き、数値を変えればいくらでもインフィード広告を出すことが出来ます。

 

 

スポンサーリンク

 

カテゴリー表示の移動

通常、カテゴリー表示は、登録日付の右側にあるのですが、アイキャッチ画像の左上に色をつけて置くことにしました。

 

外観 → テーマの編集 →  style.css

/* ——————————-
* アイキャッチ左上にカテゴリー
——————————- */
/*アイコン消す*/
#list .category .fa {
display: none;
}
#list .entry {
position: relative;
}
#list .category {
position: absolute;
left: 0px;
top: 3px;
background: #FF4500;
padding:0;
opacity: 0.9;
}
#list .post-meta .category a {
color:#ffffff;
font-size:10px;
font-weight:bold;
text-decoration:none;
padding:0 4px;
}
#list .post-meta .category {
padding-right: 0;
}

色をつけて、文字を少し小さめにしてみました。

かなり、雰囲気が変わったような気がします。

 

 

ページ送りナビ

ページ送りナビの表示スタイルの設定は、サムネイル付きに設定しています。
( [前ページ] [次ページ] ナビタイプ )

 

少しさみしいので、矢印に色をつけました。

 

 

外観 → テーマの編集 →  style.css

/* ——————————-
* ページネーションタイプ
*——————————- */
.navigation a span {
color : #f4049c ;
}
#prev-next #prev-title, #prev-next #next-title{
border :1px #f4049c solid;
}

少し明るくなりました。

 

 

カテゴリー見出し

カテゴリーを見出しから変えると、記事リストの上に

「○○○」一覧 と出ていたのが邪魔な気がして、消すことにしました。

 

外観 → テーマの編集 →  style.css

/* ——————————-
* カテゴリー見出しを消す
*——————————- */
#archive-title{
display:none;
}

これで消えました。

 

 

スポンサーリンク

 

最後に

素人が、画面を色々といじくっていますが、これがまた楽しいんです。

 

あれこれと、試行錯誤し、WEBで調べたり、思うようにならない時は、半日でも一歩も前に進まない時があります。

 

しかし、思うとおりになった時の爽快感はたまりません。

 

よく考えてみますと、そんな時間がるのなら、記事を書いた方がPVが伸びて、収益も上がるには分かっているのですが、『出来なかった時の悔しさ』、『出来た時のうれしさ』、これが自分にとっては、ブログを作る楽しみのような気がしてきました。

 

当初は、お金目的でありましたが、少しずつ変わってきました。
(今でも、PVと収益は欲しいです)

 

この楽しみで、これからも続けていこうと考えた1日でした。

 

 

スポンサーリンク
スポンサーリンク
5-1:ブログ

コメント