Blogger:Bloggerをカスタマイズするときにどうせ見ることになるリンク集

なかなかオレンジのロゴからリニューアルしないから勝手に色を変えてみました。

今回は記事タイトル通り、Bloggerのカスタマイズする際に参考にしているサイト様達をまとめてみました。
カスタマイズするときには必ずバックアップを取りましょうね。

【目次】

■Blogger総合カスタマイズ（約15種）
　　Ping送信関連

■日本産テーマ別
　　ZELO
　　QooQ
　　Tokyo
　　Vaster2
　　Viral Pro

■html cssとかブログサービス総合

相変わらずゲンナリするほど長い記事ですがどうぞどうぞ。

Blogger総合カスタマイズ

ほんの一部ですけど、忘れがちだったり、閲覧頻度が高そうな記事をまとめてみました。

Bloggerの本文見出しをカスタマイズする（デジタル小噺様）》
超初心者向けの見出しのカスタマイズ方法。はじめてCSSが見出しの変更という人も多いでしょうね。

bloggerの”標準見出し” ｈ２・ｈ３・ｈ４を変更した（hibizip様）》
見出し変更の応用編。Bloggerをお使いの人で、h2をCSSで指定しても変わらなくて困っている人は沢山いるはず。（自分）

Bloggerでヘッダタイトル画像にh1タグをつけてSEO対策をしてみた（日々のメモ帖様）》
SEO（Search Engine Optimization）対策をしたことはありませんが、試してみてもいいかもしれません。

Bloggerで関連記事ならMilliard！カスタマイズ方法まとめ（サウンドテック・ラボ様）》
関連記事を表示する外部プラグイン「Milliard」の設置方法とカスタマイズ方法の紹介ですね。

Bloggerの記事中にアドセンス広告を自動表示する[忙しい人向け]（スケ郎のお話様）》
コメントを見るとテーマによってはうまく表示されないのかもしれませんね。注意です。

[Blogger]モバイルテンプレートでタイトル下と記事下にAdSense広告を表示する方法（初心者からのBloggerカスタマイズ様）》
※古い記事（2013年）ですが、参考になる方もいるかもしれないと思ったので載せておきます。
管理人はこの記事を参考にして、忍者おまとめボタンをページ上部に設置することができました。

Bloggerのガジェットの余白を詰める方法（メモ取り！様）》
確かに初期状態のガジェットの余白はしっくりきません。
管理人はこの記事を参考にしつつ、いろいろいじっていたら、もう元に戻す方法がわからなくなってしまいました。

Blogger:テキストリンクにアイコンをつける（p--q様）》
外部リンクに

みたいな画像を自動的につける方法ですね。
管理人の場合、どうやってもjpgから外すことができなくて見送っていますが、できればつけたいです。

bloggerカスタマイズ：注目の投稿の画像サイズを小さくする方法（BloggerMaster！様）》
注目の投稿ガジェットが主張しすぎるのを抑えたい人はこちら。
こちらのブログはQooQのカスタマイズでもお世話になります。

Bloggerにてページ先頭にスクロールして戻るボタンを設置してみた（日々のメモ帖様）》
管理人はこちらの記事を参考にTOPへ戻るボタンを設置しました。
ボタン画像を探している方は手前味噌ですが当ブログからダウンロードをしてもいいかもしれません。

Blogger：トップへ戻るボタン＆スムーススクロールの設置の仕方+おまけの108ping

Bloggerに「TOPに戻る」ボタンを設定する方法(BonDay様）》
こちらもTOPへ戻るボタンの設置方法。

ページトップへ戻るボタン。ブログに設置する方法（簡単編）（へたよこ＠様）》
ガジェットにコピペをするだけで作れるTOPに戻るボタン。htmlをいじりたくない人用。普段は透明で、下にスクロールをしたときに表示される機能が必要ない人はこちらがおすすめ。

内部リンクを効果的に！Bloggerで使えるブログカード4選(ウラの裏様）》
ブログカードを使うとこんな感じにリンクをかっこよく見せることができます。

このカードは「ShareHtmlを、もっと綺麗にしたメーカー」さんを使わせていただいています。解説先のCSSの入れ忘れに気を付けましょうね。

Bloggerのクイック編集ボタンが海外テンプレートで表示されない（備忘録介様）》
一行ソースコードを記入するだけでできるんですね。
管理人はちょくちょく記事を修正する派なので、クイック編集ボタンはあってほしいのです。

[Blogger] 目次を見出しから自動生成するプラグイン（忙しい人向け）（スケ郎のお話様）》
すごいですね。これでいちいちアンカーリンクを自分で記入する必要がなくなりますね。
管理人は見出しのつけ方が滅茶苦茶なので導入を見送っていますが、いつか使ってみたいプラグインです。

【Blogger】特定のページのみにCSSを適応する方法（Blogger Labo様）》
スゴ技ですね。使い方によってはとっても便利なはず。

独自ドメインの設定（ぼくらのハウツーノート様）》
ビジネスで使う場合にはやっぱり独自ドメインがかっこいいですね。

Blogger:外部ファイル置き場をGoogleドライブからGoogleサイトへ変更（p--q様）》
カスタマイズとは関係ないかもしれませんが、ダウンロードできるファイルの置き場はGoogleサイトが便利だと思うので載せておきます。管理人もダウンロードファイル置き場として利用しています。

Google Blogger に音楽をアップロードする方法（鍵盤中心の音楽ブログ様）》
音楽のアップロード先は上で紹介したGoogleサイトを利用するのもいいですね。

Bloggerにソースコードを埋め込む方法（qiita.com内、中司浩史様記事）》

一番最初に紹介されている、Google-code-prettifyを利用した方法です。ソースコードの埋め込みできてるかな？できてますね。

Ping送信関連

pingを送信すると検索されやすいブログになるって解釈でいいんですかね？
管理人はやってはいないですが、ブログ運営関連の記事でよく見かけるので載せておこう。

PING送信サービスFeedPing
1クリックで100サイト以上にPingを送信することができるサービスですね。
BloggerのRSSのURLは
［サイトURL］/feeds/posts/default?alt=rss
ですね

【Blogger】Pingを送信できるフリーソフト「anewex」の使い方（Blogger Labo様）》
こちらはフリーソフトを使ってPingを送信する方法です。

Ping一括送信サイトのPingoo!の手動送信に不具合が生じたため、別の送信方法を検討した（日々のメモ帖様）》
こちらはフリーソフト「PING Transmitter（vector）」を使ってPingを送信する方法ですね。

日本産テーマ別

ここでは有名日本語四大テーマの個別のカスタマイズ用リンク集です。
管理人が勝手に四大テーマと言っているだけです。

ZELO　　　　

シンプルで美しいテーマです。
とにかく導入をした方は構造化エラーについての対処に苦心をしている方が多い印象です。逆に言えばそれさえ修正できれば、非の打ちどころがないテーマということでしょうか。

BloggerのテーマをZELOに変更する（まきばの里プロジェクト様）》
ZELOの導入方法から説明されているので、これからZELOのテーマを使ってみようと思う人におすすめの記事。
惜しむべきは、管理人の脳では構造化エラーの修正方法の部分がちょっとよくわからないです。

【ZELO】見出しの装飾をカスタマイズしてみよう【blogger】（【Blogger】日本人向けテーマ・実践と紹介ブログ様）》
ZELOの場合「上級者向け」→「CSSを追加」の流れで見出しを装飾しないほうがいいのですね。

Bloggerでブログサイトのデザインをカスタマイズする方法｜Bloggerテーマ「ZELO」カスタマイズ（生活ドットコム様）》
こちらも主に見出し周辺のカスタマイズに関しての記事。
一行一行説明をしてくれているので、とても分かりやすいです。

BloggerテーマZELO構造化データテストツールでエラーが出るので修正（オコタdeミカン様）》
構造化データエラーの修正方法です。
もうわけがわからないので、件の場所を<div>書き換えるだけでいいのかなと思ってしまいます。

QooQ　　　　

シンプルなボックスタイプのどことなく柔らかい感じがある素敵なテーマです。
次に紹介するTokyoと同じ製作者様です。
ページ読み込みもとても速くてストレスフリー。

【公式】QooQリリースノートと初期設定方法！【ゼッタイ読んでね】（ラムネグ様）》
QooQの製作者様のサイトです。QooQのダウンロードもこちらのページからできます。
大事な設定についての説明がされていますので、ゼッタイに読みましょう。

QooQカスタマイズ：人気の投稿ガジェットの記事ごとに区切り線をつける方法（BloggerMaster！様）》
こちらのブログはQooQのカスタマイズ記事がたくさんあるので、ブックマークしておきましょうね。

Tokyo　　　　

スクロールしても付いてくるガジェットが特徴的なシンプルですっきりしたデザインのテンプレートですね。

【公式】blogger無料テンプレート「Tokyo」シンプル&綺麗で超おすすめ!!（ラムネグ様）》
Tokyoのダウンロードや基本情報などはこちら。
サンプルページを見て、気に入ったら即ダウンロードだ。

Tokyoカスタマイズ（Blogger Labo様）》
「ブログ全体の基本設定」「ヘッダー」「メニューバー」「ブログレイアウト」
「トップページの記事リスト」「記事ページ」「サイドバー」「フッター」
のCSSを説明してくれています。参考にhtmlをがんばっていじろう。

Blogger テンプレートの「Tokyo 」のヘッダーのタイトルと説明を中央にする方法（こまブロ様）》
こちらのページではVaster2のカスタマイズ方法も紹介されています。

Vaster2　　　

有名な人気日本語テーマですね。
ただ、残念ながらこれ以上はバージョンアップをする気は無さそうですね。

【公式】Vaster2|レスポンシブ対応済みのblogger日本語テンプレート
今は更新もされていなくて、テーマもダウンロードできない状態です。
ダウンロードは次のリンク先からどうぞ。

Vaster2がダウンロードできなくなっている模様（KUSTOMizm様）》
公式「トーマスイッチ」さんでは、もうダウンロードができなくて、製作者様もそのまま放置をされているテーマですが、こちらに入手できる方法が書かれていたので紹介します。超優秀なテーマなので保存をしておきましょう。

Vaster2の導入方法とおすすめの設定（Bloggerのメモブログ様）》
導入時の基本設定の参考にしましょう。
こちらのページでは他にもBlogger・Vaster2のカスタマイズ方法がいくつか紹介されています。

[Blogger][Vaster2] SNS ボタンを横1列のデザインに変更しました（すたすた式様）》
Vaster2で管理人も気になっていたSNSボタンの大きさと並びを格好よく修正する方法です。google＋も取り除けます。

[Blogger]ほぼコピペでOK サーチコンソール構造化データのエラーを消す！JSON-LDでマークアップに挑戦[Search Console] [Vaster 1.9 & 2 ]（すたすた式様）》
Vaster2でも構造化エラーは避けては通れない課題ですね。

ブログのタイトルとページタイトルの表示を逆に表示するには（こまブロ様）》
ブログを検索したときに記事タイトルが先に来てくれないと結構困りますよね。

Viral Pro　　　

おまけで海外のシンプル系のテーマを一つだけ紹介。
管理人がいつか導入したいと思っているテーマ。
もう少し日本語のカスタマイズ方法が見つけられたらがんばって導入しようと思います。

Viral Proダウンロードページ

【Blogger】ページャーの不具合＆改善策について【Viral Pro】（やごブログ。様）》
数少ないViral Proのカスタマイズ方法を紹介されているブログです。

父ちゃんの日々ログ
テーマにViralProを使用しているブログ。
カスタマイズがうまくいけばこういうブログに出来るんだよというお手本。

html cssとかブログサービス総合

最後に、ブログ運営上のお役立ちサイトを紹介させてください。

MDN Web Docs
超重要サイト。ウェブ開発の総合サイトです。　
初心者管理人は「テクノロジー」→「CSS」→「CSSリファレンス」と進んで、こういう構文だとこういう結果だよと視覚的に知ることができるのが本当に重宝します。

WEB便利ツール | WEB道
超重要サイト　各種CSSジェネレーター
タイトル通り、いくつかの項目を選択して、ジェネレートをクリックすると、その通りCSSを生成してくれます。あとはそれをコピペするだけ。すごい。

キーワードプランナー - Google Ads
真面目にブログ運営をビジネス化する場合には、ちゃんと流行とかも考えた記事を書かなければいけませんね。管理人には関係ないですけど。

関連：【2019年最新版】Googleキーワードプランナーの使い方！初心者でも丸わかり（松原潤一のブログ様）》

Google AdSense マネタイズの教科書[完全版]

posted with amazlet at 19.08.30

のんくら(早川修) a-ki 石田健介染谷昌利
日本実業出版社
売り上げランキング: 3,346

Amazon.co.jpで詳細を見る

2019年8月30日金曜日