ブログカスタマイズ

【ブログカスタマイズ】太字を蛍光ペン仕様に|アドセンス広告を自動挿入|写真にALT属性を追加

blog-customize3

こんにちは。シーアです。(@seer1118b

ブログを書いていると、参考に他の方のブログを見ることも増えました。かっこいいデザインに出会って、「こんなふうにしたいなあ」と思うことが多々あります。

中身も大事ですが、見た目がキレイだと読みやすいですからね。

いくつかのカスタマイズを施したので、参考にさせて頂いたブログとともにご紹介します。

当ブログは、今はワードプレスに移転しましたが、この記事を書いた当時ははてなブログでした。はてなブログ内で行ったカスタマイズですので、ご承知おきください。

蛍光ペンでマーカーしたようなデザイン

こういうやつです。

人気のブログでよく見るやつです。CSSで対応可能です。

私は知識がないのですが、いろんな方がブログで公開してくださっています。検索すればすぐ見つかるのでありがたい。

このやり方では、はてなブログの設定画面から「デザイン」→工具のマーク→「デザインCSS」にCSSを挿入しています。

私はレスポンシブデザインのテーマではなかったので、このやり方だと、スマホには反映されません。

工具のマークの隣の、スマホ版にも別途同じCSSをコピペする必要があります。

PC・スマホどちらにも表示させられるやり方として、「設定」→「詳細設定」→「headに要素を追加」で挿入するやり方もありました。

ですが、私はそれでやってみても、うまく表示されなかったんです。PC・スマホどちらにも…。

太文字を蛍光ペンにするのではなく、下線を蛍光ペンにするやり方もあります。

色も、コードを変えれば、黄色だけでなくピンクやグリーンなど自由自在。

私は、文字の色を赤や水色にすることが多いので、蛍光ペンは黄色にしました。

かぶると見えにくいし、過去の記事を全部修正して回るのも大変なので。

アドセンス広告を記事中に自動挿入

Googleアドセンスの広告スペースを、下記の設定にしています。

  • トップページのタイトル下
  • 一番下のフッター
  • 右側のサイドバー(PCのみ)

記事の中にアドセンス広告を入れるには、書いている途中に、コードを入れることになりますが、毎回新しい記事を書くたびに、手動で入れるのはとても面倒です。

そこで、自動的にコードを挿入するスクリプトを入れました。

こちらも開発者の方のブログからコピペさせてもらっただけです。

この場を借りてご紹介させて頂きます。ありがとうございます!

特定のカテゴリの記事には広告を入れない、という設定もできます。

写真にALT属性を追加

category-blog-customize

ブログに入れている写真は、自分が日常や旅先で撮影した写真を使っています。

記事の内容とは全く関係がないことが多々あります。それでも、アイキャッチ画像はあったほうがいいよなぁと思っています。

ただし、検索エンジン的には、画像がいくらキレイでかわいくても、そんなことはわかりません。

この画像が何の画像なのかを認識してもらうために、ALT属性というものを設定したほうが、SEO対策には良いのだそうです。

はてなブログでは、普通に写真をアップロードしただけでは、ALT属性を変更・修正できません。デフォルトでは、無意味な英数字の羅列になっています。

そこで、画像のALT属性・Title属性を変更できるGoogle Chromeの拡張機能を入れてみました。

ブラウザは普段Internet Explorerなのですが、Google Chromeも入れているので、今後はそちらでブログを書こうかな。特にこだわりもなかったので。

ただし、新たに写真を入れるときにしか変えられません。

過去記事に遡って、画像を一度削除して、もう一度選択して入れ直す…という作業をするのは面倒くさいな。

時間のあるときに気が向いたらやるかもしれない。

これから先の記事に写真を入れるときには、こちらを使っていきたいな。

でも、スマホから写真をUPすることも多いので、そういう場合には使えません。どうしたもんかな。

そこまで気にする必要もないのかもしれないけど。

まとめ ~カスタマイズで自分色に~

ブログを自分仕様に変えていくのは楽しいですね。これも、知識のある方が、素人にも分かりやすく公開してくれているおかげです。

真似してみたいカスタマイズがあれば、リンク先の記事からご確認下さい。

私のブログより詳しく説明していらっしゃるので、見てみて下さいね。

関連記事 

Google AdSenseの導入までの流れです。

厳しいと言われている審査ですが、特に引っかかることなく通過できました。コツなどまとめています。 

アドセンス承認
Google AdSenseの導入に成功!スピード承認までの流れを公開こんにちは。シーアです。(@seer1118b) ブログをはじめて、1ヶ月と少しが経過した頃。開設当初から目標にしていた、Google...

ブログを始めてから、パソコンを開くことが増えました。なるべく移動中に、iPhoneのはてなブログのアプリで下書きを進めています。

はてなブログスマホ×PC
ブログをiPhoneで更新するコツ!メリット・デメリット、パソコンとの使い分けこんにちは。シーアです。(@seer1118b) 私はiPhoneでブログを更新しています。 厳密にいうと、アイディアを書き留めたり...
崖っぷちブロガー|シーアのサバイバルチャレンジ
シーア
シーア
借金があっても、自分の力で幸せと豊かさを手に入れます!

夫の借金発覚をきっかけに、債務整理や家計の見直しを実行しました。投資や節約、陸マイラー活動について発信しています。

TwitterPROFILE

ライト
ライト
お好きなカテゴリーにどうぞ!

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です