>--> スマートフォン | クリボウの Blogger Tips

クリボウの Blogger Tips

Google Blogger の使い方、カスタマイズ方法、各種ツールなど、
Blogger 関連の役立つ情報を紹介しています。

Home > スマートフォン

スマートフォン

Blogger のモバイルテンプレートで動的ビューが使えるようになりました

「クリボウのプログラミングひとりごと」動的ビューをモバイルテンプレートに


Blogger のモバイルテンプレート(スマートフォン用のテンプレート)で、動的ビュー(ダイナミックビュー)のテンプレートを選択できるようになりました。

Blogger 管理画面「テンプレート > モバイルテンプレート」

これを有効にするには、Blogger 管理画面「テンプレート」ページの「モバイル」欄の「歯車マーク」をクリック、「携帯端末では現在のテンプレートのモバイルバージョンを表示する」項目を「はい。携帯端末でモバイルテンプレートを表示する。」にして、「モバイルテンプレートを選択」項目で、「動的ビュー」を選択し「保存」ボタンを押すだけ。

もとからブログの PC 版テンプレートに動的ビューテンプレートを指定していて、なおかつモバイルテンプレートを「デフォルト」にしている場合には、上の設定なしで自動的にモバイル版も動的ビューになるとのこと。また、試してみたところ PC 版は通常のレイアウトテンプレートで、モバイル版だけ動的ビューという設定もできるようです。

現在モバイルテンプレートとして使用できる動的ビューのスタイルは「クラシック」だけみたいなんですが、それでもブログの見せ方のバリエーションが広がってきたというのはやっぱりうれしいですね。

モバイルテンプレートもカスタマイズ可能に

前回、ダイナミックビューがカスタマイズ可能になったというニュースをお伝えしました。

そして、今回は、モバイルテンプレートです。ご存知のとおり、iPhone や Android 端末からブログにアクセスしたときに表示されるテンプレートのことですが、今回新たにこちらもカスタマイズ可能になりました。

設定は Blogger の新しいダッシュボードの「テンプレート」ページから行えます。ページを開いてみると、このような表示が出てきます。

Blogger モバイルテンプレート設定

「モバイル」の歯車ボタンを押して、ポップアップしてくる画面がこちら。

Blogger モバイルテンプレート設定

これまでにモバイルテンプレートを有効にしたことがない場合でも、ここから有効にすることができます。

「モバイルテンプレートを選択」の欄で選べるのは、今のところ「デフォルト」、「シンプル」、「画像ウィンドウ」、「Awesome Inc.」、「ウォーターマーク」、「エスィリアル」、「旅行」、「カスタム」の 8 種類のテンプレート。最後の「カスタム」を選ぶと、現在の PC 用テンプレートのデータをできるだけ引き継いだモバイルテンプレートが自動的に作成されます。


モバイルテンプレートにウィジェットを表示する

Blogger Developers Network ブログには、モバイルテンプレートにブログのウィジェット(ガジェット)を表示させる方法が載っています。

ブログ上のウィジェットで、デフォルトでモバイルテンプレートに表示されるのは、次の 6 種類。

  • Header … 「ページヘッダー」ウィジェット
  • Blog … 「投稿」ウィジェット
  • Profile … 「基本情報」ウィジェット
  • PageList … 「ページリスト」ウィジェット
  • AdSense … 「AdSense」ウィジェット
  • Attribution … 「帰属」ウィジェット
それ以外のウィジェットをモバイルテンプレートに表示させたい場合は、ブログのテンプレートを HTML で編集する必要があります。

(上級者向けの内容です。必ずテンプレートのバックアップをとってから試してください。)

新ダッシュボード「テンプレート > HTML の編集」(旧ダッシュボード「デザイン > HTML の編集」)ページで、「ウィジェットのテンプレートを展開」にチェックを入れて、ウィジェット要素を見つけます。その開始タグに mobile='yes' 属性を追加すると、ウィジェットがモバイルテンプレートでも表示されるようになります。

「ブログアーカイブ」ウィジェットをモバイルテンプレートに表示する例:
<b:widget id='BlogArchive1' mobile='yes' title='Blog Archive' type='BlogArchive'>

mobile 属性で指定できる属性値は、yes、no、default、only です。no でデフォルトで表示することになっているウィジェットも非表示にすることができます。

  • yes … PC テンプレート、モバイルテンプレートともに表示
  • no … PC テンプレートのみに表示
  • default … デフォルト設定に従う
  • only … モバイルテンプレートのみに表示

モバイルテンプレート関連の新しいデータタグ

さらにマニアックな話題ですが、モバイルテンプレート関連の新しいデータタグも追加されています。

  • blog.mobileClass … モバイルで閲覧時に  mobile を表示
  • blog.isMobile … モバイルで閲覧時に true を、それ以外は false を表示
blog.mobileClass

モバイルで閲覧時に  mobile (最初に空白あり) を表示します。すでにテンプレートには

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

と記述されており、PC での閲覧時には

<body class='loading'>

と、モバイルでの閲覧時には

<body class='loading mobile'>

と書き出されるようになっています。なので、

.mobile .post-footer {
  color: red;
}

といった風に、モバイル閲覧時にだけ適用される CSS が簡単に書けます。

blog.isMobile

モバイルで閲覧時に true を、それ以外は false を表示します。テンプレートのウィジェット内に

<b:if cond='data:blog.isMobile'>
  (モバイル閲覧時に表示したい内容)
<b:else/>
  (PC 閲覧時に表示したい内容)
</b:if>

と書くことで、実際の表示内容を書き分けることができます。


…ということで、随分長くなってしまいましたが、Blogger 歴の短い人も長い人も、モバイルテンプレートを選択したり、モバイルテンプレートのカスタマイズに挑戦してみたりするといいんじゃないでしょうか。

Blogger 公式 iOS 用アプリが登場

モバ造さんと so-ta さんに、メールやコメントで教えてもいらいました。ありがとうございます。

Blogger App for iOS  Blogger App for iOS

Blogger に待望の iOS 用のアプリが登場しています。

Blogger Buzz によると、このアプリで、新しい投稿を書いてすぐさま公開したり、iOS デバイス上に下書きとして残したりすることができるそうです。また、投稿データをデバイス間で同期して、いつでも手持ちの端末で最新版の投稿にアクセスできるとか。

アプリから、iOS デバイスで撮った写真をつけて投稿を公開することも可能だそうです。ラベルや位置情報もつけられるというのもいいですね。

ということで、iPhone や iPad、iPod touch ユーザーの人は、ぜひ一度お試しください。アプリのダウンロードは以下からどうぞ。ちなみに、iOS のバージョンは 3.1.3 以降が必要です。

関連:

Blogger のスマートフォン用「モバイルテンプレート」がスワイプに対応

@kurikuribo iPhoneでbloggerのモバイルテンプレートを左右にフリックすると、ページを移動できるのって既出ですか? 今日はじめて知りました ^^;Fri Jul 22 07:27:00 via web


と、NO MAC , NO LIFE ? の realpandaya さんに教えてもらっていたんですが(ありがとうございます!)、ようやく Blogger のアナウンスの方も出ました。

これによると、Blogger のスマートフォン用テンプレート、いわゆる「モバイルテンプレート」が、スマートフォン上のスワイプ操作に正式に対応したとのことです。iPhone や Android 端末をお持ちの方は、今すぐお試しを。

最近の Blogger、徐々にですが、確実に便利になっていく印象ですね。今後のアップデートにも期待です。

関連:

Blogger にスマートフォン向け「モバイルテンプレート」が正式採用

Blogger のモバイルテンプレート

昨年末に紹介したのが、こちらの記事。

このスマートフォン向けのブログテンプレートが、ようやく Blogger に正式採用になりました。

Blogger モバイルテンプレートの設定

設定は、Blogger 管理画面「設定 > メールとモバイル」ページの「モバイルテンプレート」の項目から「モバイルテンプレートを表示する」を「はい」にするだけ。

自分のブログが、スマートフォンで実際にどのように表示されるかは、ブログ URL 末尾に ?m=1 を付け加えてアクセスすることで確認することができます。

正式採用となったモバイルテンプレートで、スマートフォンの読者が増えるといいですね。

Blogger 公式 Android アプリが登場

1 年以上前に、Blogger 投稿用の iPhone アプリについて紹介したことがありましたが、今回ようやく Android にも、Blogger 公式のアプリが登場した模様です。

Blogger Buzz によると、このアプリを使うと、

  • Google アカウントや Blogger ブログを切り替えて利用。
  • ブログへの記事投稿だけでなく、ローカルに下書きを保存する。
  • カメラをアプリから起動して、写真を投稿。
  • ギャラリーやブラウザから、共有メニューを出して、写真を投稿。
  • Android による位置情報を、投稿に含める。
  • このアプリ経由で書いた投稿や下書きを確認。
  • 公開済み投稿の長押しで、ブラウザで実際にブログ記事を表示。
といったことが可能だとのこと。なかなか魅力的なアプリのようですね。出先で思いついたことや、気になったものをすぐさまブログできるというのは、けっこういいかもしれませんね。

ということで、この Android App のインストールはこちらから。

Android ユーザーの方は、ぜひぜひ試してみてください。

© 2005-2014 Kuribo. Powered by Blogger.