Bloggerに入門するにあたり、知っておきたい公式の使い方情報

イントロダクション

Google のブログサービス「Blogger」の基本的な使い方を知りたいときには、公式の Bloger ヘルプが役立ちます。

• Blogger ってどんなことができるのか知りたい人
• これから Blogger を始めようとしようとしている人
• Blogger を始めたけれど、どうやって操作したらよいかわからない人

は是非、ざっとでもヘルプを見てみることをお勧めします。
結構、しっかりと基本的なことが書かれていて、参考になります。

BloggerのURL構成：ドメイン部

イントロダクション

Google のブログサービス「Blogger」でブログを公開している人が知っておきたいBloggerブログのURLの構成をまとめました。

また、Bloggerブログを閲覧している人も、この構成を知っておくと、よりBloggerブログを快適に、楽しく読むことが出来ると思います。

今回は、Blogger のドメイン部について記載します。

Blogger:フィード情報をjson-in-script形式で取得して、JavaScriptでデータ処理する

イントロダクション

Google のブログサービス「Blogger」では、ブログのフィード情報を取得するときに様々なパラメータを指定することができます。


ブログのフィード情報を取得して、JavaScript でデータ処理を行いたいと考えているなら、データの応答フォーマットの種類(クエリパラメータ：alt)として、atom-in-script、rss-in-script、json-in-script を指定すると、スクリプトでそのまま利用可能な形式でフィード情報を取得できるので非常に便利です。

Bloggerで検索すると、Google Blogger以外の情報が出てきてしまう！その対処法

イントロダクション

Google などの検索エンジンで、Google のブログサービス「Blogger」について情報を集めようとした場合に、Google「Blogger」の情報以外に、一般的な意味でのブログや一般的な意味でのブロガー（ブログを書く人）の情報も一緒になってできてしまいます。

そこで、Google「Blogger」のみの情報を検索エンジンで調べる方法について考えてみました。

BloggerのフィードURL(RSS/Atom)についての貴重な情報が書かれているページまとめ

イントロダクション

Google のブログサービス「Blogger」のブログのフィードURL(RSS/Atom)についての情報が記載されているページをまとめました。

Blogger:BloggerのテンプレートのHTMLを編集するときに気を付けること

イントロダクション

Google のブログサービス「Blogger」では、ブログを形作るテンプレートの HTML に手を加えることで、他のブログサービスでは実現できないような自由な表現が可能になります。

さて、そのような Blogger のテンプレートの HTML ですが、一歩編集を間違えると、Blogger からエラーメッセージを通知されたり、ブログそのものが表示不能に陥ったりします。

そのため、Blogger のテンプレートの HTML を変更する際には、十分に注意して変更を行う必要があります。


しかし、人は必ずミスを犯すものです。
100% 間違えないなどというおとはあり得ません。


そこで、Blogger のテンプレートの HTML の変更前・変更後に行っておきたい作業をまとめました。

Blogger:PC表示/モバイル表示を、JavaScriptにて取得する方法 - BloggerのテンプレートのHTML方式

イントロダクション

Google のブログサービス「Blogger」では、PCで表示した場合と、モバイル端末で表示した場合とで、表示を変えることができます。

Blogger:モバイル版のテンプレートをカスタマイズするときに、私がよく使っているもの
http://upa-pc.blogspot.com/2015/05/blogger-mobile-template-customize.html
Dr.ウーパのコンピュータ備忘録

さて、今現在 Blogger ブログが、PC表示をされているのか、モバイル表示をされているのか、JavaScript として取得したい場合があります。

その時には、次の方法が考えられます。

(1) URL のクエリパラメータを見て、PC表示/モバイル表示を判別
現在表示している Blogger ブログの URL のクエリパラメータに、m パラメータが付与されているかどうかでPC表示/モバイル表示をチェックします。

m=1：モバイル表示
m=0：モバイル表示から、PC表示へ切り替えて表示
mパラメータなし：PC表示

BloggerのPC/モバイル表示の切り替え管理方法が興味深い！
http://upa-pc.blogspot.com/2015/01/blogger-mobile-page-to-pc-page.html
Dr.ウーパのコンピュータ備忘録

Bloggerユーザなら知っておきたい、BloggerブログのURL構成まとめ
http://upa-pc.blogspot.com/2015/02/blogger-url-summary.html
Dr.ウーパのコンピュータ備忘録

(2) Blogger のテンプレートの HTML のタグを使用して、PC表示/モバイル表示を判別

Blogger のテンプレートの HTML 内でのみ効果を発揮するタグを使って、PC表示/モバイル表示をチェックします。

今回は、(2) の「Blogger のテンプレートの HTML のタグを使用して、PC表示/モバイル表示を判別」の方法について記載します。

Blogger:検索ページにのみ検索ボックスを表示(display:none方式)

イントロダクション

Google のブログサービス「Blogger」では、 ブログの上部にある Navbar の検索ボックスを使うことで、ブログ内を検索することができます。

Blogger の Navbar
左側に検索ボックスが配置されている

検索を実行すると、検索結果が別のページ（検索ページ）に表示されます。
このとき、検索キーワードに関連するページが一覧表示されます。

Blogger : 検索ページ
検索したキーワードに関連する、投稿の一覧が表示される

さて、この検索ページを表示した後に、再度別のキーワードで検索をし直そうと思った場合には、再び Navbar の検索ボックスに検索キーワードを入力して、検索を行う必要があります。

しかし、通常 Navbar はページの最上部に位置するため、そこまで移動するのが面倒です。


検索ページの検索結果一覧の最後の部分に、検索ボックスがあったら便利だと思いませんか？

そこで、検索ページにのみ、検索ボックスを表示するHTML/JavaScriptガジェットを作成してみました。

Blogger:Navbarをオフにする上で検討したいこと-その機能は必要か？代替可能か？

イントロダクション

Navbar を表示していると、Blogger ブログの表示時に負荷がかかることを、以下の投稿で確認しました。

Blogger:Navbarの負荷を考える-ページの読み込み時にどの程度影響を与えているか
http://upa-pc.blogspot.com/2015/02/blogger-navbar-on-off-diff.html


そのため、Blogger ブログのページの表示を少しでも軽くしたい場合には、Navbar はオフにした方がよいでしょう。

でも、本当に何も考えずに Navbar をオフにしてしまっていいのでしょうか？
今回は、その点について検討してみます。

Blogger:テンプレートとして動的ビューを使用している場合には、投稿フィードのフッターに注意 - ブログの側にも反映されます

イントロダクション

Google のブログサービス「Blogger」では、ブログの見栄えを、テンプレートの中から選択することができます。
（なお、それ以上に頑張れば、極限までカスタマイズ可能です。）

Blogger のテンプレートとして、
動的ビューを適用した Blogger ブログ

さて、前回、Blogger のテンプレートとして動的ビューを適用した場合には、そのコンテンツは動的に Feed から取得されているということを調査しました。

Blogger:動的ビューはどのようにコンテンツを取得して、表示しているのか？
http://upa-pc.blogspot.com/2015/04/blogger-view-content.html
Dr.ウーパのコンピュータ備忘録

そのため、Blogger のテンプレートとして動的ビューを適用している場合には、注意が必要なことがあります。

それは、投稿フィードのフッターに記載されている内容が、Feed を読むための RSS リーダだけではなく、ブログの記事一覧にも表示されるという点です。

Blogger:投稿のサムネイルのURLを取得する - レイアウト データ編

イントロダクション

Google のブログサービス「Blogger」では、Blogger のテンプレートの HTML を編集することで、自由にブログのデザインを変更できます。

Bloggerユーザ必見！テンプレートのHTMLを編集するときに参考になる公式ページリスト
http://upa-pc.blogspot.com/2014/06/blogger-html-edit-ref.html
Dr.ウーパのコンピュータ備忘録

今回は、Blogger のテンプレートの HTMLでのみ使用できるレイアウトデータを使用して、投稿のサムネイルのURLを取得してみます。

Blogger:新着情報を表示する選択肢

イントロダクション

今回、Google のブログサービス「Blogger」にて、新着情報をサムネイル付きで任意の件数表示できるガジェットを自作することにしました。

Blogger:JavaScript:新着情報を表示するガジェットを作成(1)-準備編
http://upa-pc.blogspot.com/2015/03/blogger-new-post-list-gadget-javascript-1.html


なお、私は自作する道へと進みましたが、既に世の中には Blogger の新着情報をカスタマイズして表示するいろいろな手段があるようです。

ただし、そのようなものがあるということは調べてみましたが、実際に使ってみたことがないものも含んでいるため、それらを使われる場合には、各自で調査を行ってから使ってください。

Blogger:投稿の投稿日時を、JavaScriptで取得 (data:post.timestampISO8601 タグ編)

イントロダクション

Google のブログサービス「Blogger」にて、記事を公開した日付をもとに、何らかの処理を行いたいときってありますよね。


投稿を公開した日付を取得するにはいろいろな方法があります。

Blogger:投稿の公開日を取得する方法
http://upa-pc.blogspot.com/2015/03/blogger-get-published-date.html


今回は、Blogger のテンプレート用のタグ <data:post.timestampISO8601/> の値を取得する方法について考えました。

記事のページにのみ目次を付与する - 準備編(3) - Bloggerの記事に目次をJavaScriptで自動的に付与する

この記事は「そうだ！Bloggerの記事に目次を付けよう！」から始まる一連の「Bloggerの記事に目次をJavaScriptで自動的に付与する」シリーズの構成記事です。
記事一覧はページ下部の「Bloggerの記事に目次をJavaScriptで自動的に付与するシリーズ」よりどうぞ。

さて、記事に自動的に目次を付与する場合、記事の全文が表示されているページだけに表示したいと考えています。Blogger のトップページでいくつか記事が並んでいる場合には、目次は表示させたくないと考えています。

Bloggerユーザなら知っておきたい、BloggerブログのURL構成まとめ

イントロダクション

Google のブログサービス「Blogger」でブログを公開している人が知っておきたいBloggerブログのURLの構成をまとめました。

また、Bloggerブログを閲覧している人も、この構成を知っておくと、よりBloggerブログを快適に、楽しく読むことが出来ると思います。

検索技術:Bloggerにて、各月に投稿された、全ユーザの記事数を調べる

イントロダクション

以前、検索エンジンを使用して、Googleのブログサービス「Blogger」にてブログを運用しているブログを発見する方法について記載しました。

検索技術:Bloggerでブログを運営しているブログを発見する方法
http://upa-pc.blogspot.com/2015/03/find-blogger-blog-by-search.html
Dr.ウーパのコンピュータ備忘録

今回は、その方法を応用して、Blogger にて、任意の年・月に投稿された、全ユーザの記事数を調べる方法について考えてみます。

Blogger:モバイル版の表示にて、ブログアーカイブが正常に動作しない(2) - 原因を探る

イントロダクション

Google のブログサービス「Blogger」にて、モバイル版の表示にて、ブログアーカイブが正常に動作しないという現象に遭遇しました。

Blogger:モバイル版の表示にて、ブログアーカイブが正常に動作しない
http://upa-pc.blogspot.com/2015/05/blogger-mobile-blog-archive-trouble.html


その原因について、少し調べてみました。

Blogger:アップロードした画像の、取得時の画像サイズを動的に変更するための、JavaScriptコード

イントロダクション

Google のブログサービス「Blogger」にて、アップロードした画像の、取得時のURLのパターンと、動的に取得サイズを変更する方法について調べてみました。

Bloggerでアップロードした画像ファイルの、URLのパターン
http://upa-pc.blogspot.com/2015/04/blogger-image-url.html
Dr.ウーパのコンピュータ備忘録

Bloggerでアップロードした画像を、サーバから配信される画像のサイズを指定して表示する方法
http://upa-pc.blogspot.com/2015/04/blogger-image-url-change-size.html
Dr.ウーパのコンピュータ備忘録

今回は、それらの知見を活かして、アップロードした画像の、取得時の画像サイズを動的に変更するための、JavaScriptコードを作成してみました。

Blogger:新規投稿を作成するためのショートカットを作成して、素早く新しい投稿を書き始める (Windows編)

イントロダクション

今回は、Google のブログサービス「Blogger」にて、ワンクリックで新しい投稿の作成を開始できるようにしてみましょう。

環境は、Windows です。

この準備を終えると、Windows を起動してすぐに、ワンクリックで新しい Blogger の投稿を作成できるようになります。

Blogger:記事概要「もっと読む」のリンクから#moreを消す

イントロダクション

Google のブログサービス「Blogger」では、1 ページ内に複数の投稿が表示されるページがあります。(*1)