素人がブログの改造をする記録(A8.netの導入と検索窓の移動)

スポンサーリンク
  

 

また、素人がブログをいじったので、記録しておきます。

これをしておかないと、後で何を変えたのか分からなくなってしまいます。

今回は、サイドバー右上のアドセンス(AdSense)を外し、A8.net(楽天広告)を入れました。

今までは、サイドバー上に検索窓もあったのですが、これもヘッダー枠の右下に置きます。

 

AdSenseインフィード広告を入れると、サイドバーに同じ AdSense広告は入れてはならないと知りました。

配置に関するヒント
広告はフィード内に配置します。フィードのコンテンツ間や、フィードの先頭または末尾には配置できますが、サイドバー内には広告を配置しないでください。掲載結果に悪影響を与える可能性があります。
スポンサーリンク

検索窓の移動

いつものように、「ロリポップ!FTP」にて、header-logo.php ファイルを simplicity2の親から Simplicity2 childにコピーします。

PC編

header-logo.php の最終行に以下の文面を書き加えます。

 

<!– ヘッダー内へ検索窓 –>

<form method=”get” id=”searchform” action=”<?php echo home_url(‘/’); ?>”>
<input type=”text” placeholder=”<?php echo get_theme_text_search_placeholder();//検索ボックスのプレースホルダテキストを取得 ?>” name=”s” id=”s”>
<input type=”submit” id=”searchsubmit” value=””>
</form>

 

まだ、何が書いてあるのかよく分からないのが現実です。

(WEBを検索して見つけてきました。)

 

 

次に、Simplicity2 child の スタイルシート (style.css)を書き加えます。

/* ——————————-
* ヘッダー内に検索窓
*——————————- */
#h-top #searchform {
position: absolute;
right: 05px;
bottom: 0;
width: 300px;
}
#h-top #s {
margin-bottom: 10px;
border-radius:07px;
border : 2px solid #ff69b4 ;
}

右下に300pxの幅で、角を丸くして、ピンク色で枠を囲ってみました。

 

 

モバイル編

スマホ用にも書き加えますが、これは苦労しました。

自分は xperia ですが、家内が Iphone を持っているので、確認すると端が切れていました。

 

枠を縮めるか、センターに置くか悩んだあげく、結局センタリングすることにしました。

Simplicity2 child の mobile.css に書き加えます。

/* ——————————-
* ヘッダー内に検索窓
*——————————- */
#h-top #searchform {
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 300px;
}
#h-top #s {
margin-bottom: 01px;
border-radius: 07px;
margin: 0 auto;
border : 2px solid #ff69b4 ;
}

 

これで何とか出来ましたが、センターリングに苦労しました。

 

スポンサーリンク

A8.netの導入

これは簡単です。

 

サイドバー上

A8.netにログインして、楽天の広告から、楽天モーションウィジェット(A8.net版)を使います。

バナーサイズは300*160にして、サイドバーにウィジェットのテキストを使って置きました。

 

 

 

投稿SNSボタン上

投稿SNSボタン上には、同じく楽天モーションウィジェット(A8.net版)にバナーサイズ600*200を置きました。

同じく、テキストのウィジェットを使用しました。

 

これもセンターリングしたいのですが、出来ていません。

 

スポンサーリンク

最後に

今回は、割と簡単でしたが、見た目はかなり変わりました。

 

ヘッダー内に検索窓を置くと、雰囲気がかなり変わってきて、自分では気に入っています。

 

最初は、このヘッダー内に広告を入れようかと思いましたが、やはり広告は本文を読み終えた後がいいとのことで止めました。

 

これが楽しいのですが、一向にPVは増えません。従って、目標とする、関連コンテンツ広告はまだ現れません。

 

悲しいです。

 

 

スポンサーリンク
スポンサーリンク
5-1:ブログ
フォローする
転勤から見える景色

コメント