昨日まで大丈夫だったのになんで…。
はてなブログの記事本文が消えてしまった時に
行うべき確認と対処法をご紹介します。
- ブログ記事の本文が消えた!
- Googleアドセンスの広告コードが原因
- 問題箇所の切り分け作業
- 一度全てのコードを削除
- Googleアドセンス以外のコードを元に戻す
- Googleアドセンス広告コードの貼り方
- スポンサーリンクの貼り方
- まとめ
ブログ記事の本文が消えた!
Googleアドセンスコードをいじっていたら
ブログ記事の本文が消えた話。
数ヶ月前に投稿した記事の情報を
アップデートしようとしてスマホ版の記事をチェックしたら
ん?
記事のページはあって、広告も表示されているのに
本文が消えてしまいました。
その時の画像がこちらです。
本文がない…
このブログでは1ページに3箇所
広告を表示するようにしています。
広告の設置場所
-
タイトル下
-
記事上
-
記事下
今回の現象
-
タイトル下…×
-
記事上…×
-
記事下…○
-
記事本文…×
何だこれ?バグかな?
ページを更新してみましたが変化なし。
「何だよーはてなブログさん不具合じゃないですか。」
そう思ってGoogleやツイッターなどで
不具合に関する情報を検索してみましたが
それらしい記事はなし。
・・・これ多分僕が悪いな。
諦めずに色々調べてみたら
Googleアドセンスの広告コードに
何か問題が起きている可能性が高い。
という記事を発見しました。
Googleアドセンスの広告コードが原因
本文が消えてしまう現象が起きる数日前に
広告のサイズを変えたり、表示方法を変えたり
広告の設定をいじっていたので
それが原因な気がしてきました。
原因は判明しましたが
コードを全てコピー&ペーストしてきた僕は
コードを見ただけでは何も分かりません。
(自分が全面的に悪いわけですが、、、)
ということで、時間はかかりますが
一度全てのコードを見直してチェックしていきたいと思います。
問題箇所の切り分け作業
まず、どこがダメなのかを把握するために
作成したコードをいくつかに分解しながら
どの部分が悪いのかを把握していきます。
もしもの時のために、
必ずコードのバックアップは取ってください。
僕は、Evernote(エバーノート)に
全てのコードを入力して保存してあるので
コードを全てコピーして貼り付けました。
なお、コードの編集は
設定→デザイン→スマートフォン→記事下で編集できます。
一度全てのコードを削除
入力してあるコードを一度全て消してみました。
これで記事本文が出てこなかったら
はてなブログさんが悪いっすよ。と思いつつ
変更を保存して確認したところ
本文が無事表示されました。
その時の画像です。
はてなブログさんごめんなさい…。
コードをきちんと修正すれば元通りになることが分かり
ひと安心です。
Googleアドセンス以外のコードを元に戻す
ここの編集画面には
フォントの大きさやプラグインに関するコードも一緒に入力していたので
アドセンス広告に関係しない部分を入力して再検証。
記事が出ました。やっぱり
Googleアドセンスの広告コードに
問題があるようです。
Googleアドセンスにログインをして
広告コードを再取得して貼り付けてみましょう。
Googleアドセンス広告コードの貼り方
Googleアドセンスにログインをして
広告コードを取得します。
広告ユニット→新しい広告の作成
※細かい設定の説明
取得したコードをはてなブログに貼り付けてみましょう。
貼り付ける場所は
先程と同じ場所で大丈夫です。
貼り付けて再度検証
おお!広告が出てきた!
ですが、この状態ではまだダメです。
前にもご紹介した通り
広告の上に「スポンサーリンク」の文言を追加して完了です。
これがないと、Googleから規約違反で高校が貼れなくなる可能性があるので
絶対に入れておきましょう。
スポンサーリンクの貼り方
<div style="text-align: center;">
<p style="font-size: <!--0.6em;">スポンサーリンク
<!--ここに自分のアドセンスコードを貼る—>
</p>
</div>
アドセンスコードをコピーして
ここに貼り付ける。のところにペーストするだけでOKです。
貼り付けが完了したら、再度検証!
・・・どうだ?
できた!!!
記事上の広告も無事に表示されていました。
まとめ
はてなブログで
広告は出てるのに本文が表示されない
という事が起きたら
まずアドセンスコードを見てください。
そしてコードを見てもよくわからない人は
問題箇所を切り分けて把握するために
一度コードをどこかに保存しておいて
全て削除するのもありだと思います。
それでは!!