chat-blog

僕の独り言が誰か一人の役に立つことを祈って

*

【wordpress】stinger5でアドセンスの広告を横並びで表示させる方法

   


なんか最近wordpressの記事が多すぎるので別のネタを考え中なチャットです。

PR

僕のブログでは元々記事の下の部分の表示されてたgoogleアドセンスの広告が縦に並んでたんですけど、
ぱっと見右側に隙間ができてしまっているのが嫌で横並びしてみました。

やることサマリ

  • stingerでもともと設定しているブログの横幅を広げます。(980px→1080px)
  • 横並びになるようsingel.phpを修正します。
  • 位置を調整します。
  • 横幅広げたことでヘッダー画像の大きさがそのままなので合わせて広げてあげる

では行きます。

※この記事の下に参考にしたURLを貼っておきますので詳しくじっくり理解したいという方はそっち見たほうがいいです。

あと編集する前にしっかり、

こんな具合にバックアップはしっかり取ってくださいね。絶対だぞ!

wordpressの画面から編集する場合も、ctrl + a で全選択してコピーしてメモ帳かなんかにバックアップ取るように。

 

横幅を広げる(style.css)

style.cssの一番下に下記のコードを追記

この後にもう一度 style.cssを編集することになるのですが便宜上分けたほうがわかりやすいので。
※#wrapperはstyle.cssの上の行にも記載されていますが、cssは下に書かれているものが優先されるので大丈夫です。

この状態でページを更新すると横幅が広がっているはずです。

アドセンス広告が横並びにする(single.php)

single.phpのコードをごそっと消してベロっと追記するので注意してください。

を探して消して、

上記コードを貼り付けてください。
※対応するdivの個数とかしっかり確認するように。

 

位置を調整します(style.css)

先ほど編集したstyle.cssをまた編集します。
さっき追記しましたがまた最下行に下記を追加します。

これで保存してページを開くといい感じに横並びになってるはずです。

 ヘッダー画像を広げる(function.php)

※こいつの編集ミスると画面が真っ白になるなど、重大な障害を発生させますのでくれぐれも慎重に。そしてバックアップ取ってください。

こいつの中に、

という記述があるので★の行を、

1080に変えてあげましょう。

これで以上です。

ここ最近の記事に比べるとかなりハードですが、(僕はこの記事残すはとても疲れました笑) こうやって地道にカスタマイズしていくのはなかなか楽しいです。

参考にしたサイト様
http://affiliate150.com/stinger5-side-by-side

※アフィリエイトの為の記事を専門にかかれてますがwordpressのカスタマイズについてすごく参考になる情報ばかりで神サイトとして崇めてます。

今日の一言

なんか前に食べログ的な記事書いたけど1回で終わってしまった1回坊主チャットより。

前書いた食べログ


スポンサーリンク

スポンサードリンク

スポンサードリンク

 - wordpress

\皆によく読まれてる人気記事/

スポンサーリンクと関連コンテンツ

  関連記事

ブログの更新を自動でツイッターで呟かせる際の改行方法

できるはずなので、色々と試してみた結果、 %0a のアスキーコードを埋め込むこと …

【wordpress】SNSシェアボタンをいわゆるバイラルメディア風にカスタマイズしてみた

今我が家の洗面所では洗面器の交換のために業者さんが来てくれていますが、僕はブログ …

stinger5でサイドバーのnew post(最新の投稿)で特定のカテゴリーを非表示にする方法

topページから消すのはプラグインを入れて楽にできたのですが、 サイドバーのne …

【wordpress】stinger5の固定ページでもsnsのシェアボタンを表示させる方法

よくみたら固定ページにはデフォルトでsnsのシェアボタンが表示されていなかったた …

no image
wordpressで502 Bad gatewayがでてダッシュボードにログインできなくなった時の備忘録

久しぶりにブログを更新しようと思ったら管理者画面に入れなくなって完全に詰んでたへ …

STINGERで、トップページの記事一覧から特定のカテゴリを非表示にする方法【wordpress】

皆からするとどうでもいい僕のゲームの日記の記事をトップページから消す方法について …

wordpressのコメント欄を移動、もしくは削除する方法

最近は朝に更新するように心がけているのですが起きたら起きたで、 艦隊これくしょん …

wordpressのトップページで最近の投稿(new post)を表示させない方法

まいど。月曜から二日酔いに苛まれつつも頑張って仕事行った自分をちょこっとだけ褒め …

ブログをgoogleとbingにインデックスさせた(申請した)

ブログを立ち合げたわけだしせっかくなので、 検索エンジンに引っかかるようにしたい …

【wordpress】サイドバーの「最近の投稿」を記事タイトルだけ出力させる

仕事の帰りにスタジオ寄って帰ると嫁に伝えていたのですが、 スタジオは満室状態だっ …

※コメントですが僕が確認してからとなるのでだいたい3日後の反映となります。

Message

メールアドレスが公開されることはありません。