日々のコンピュータ情報の集積と整理

Dr.ウーパのコンピュータ備忘録

2015年6月3日水曜日

Blogger:HTML/JavaScriptガジェットを、投稿ページのみに表示する方法

イントロダクション

Google のブログサービス「Blogger」にて、HTML/JavaScript ガジェットをブログの全ページではなく、投稿ページでのみ表示したいことってありますよね。

今回は、特定のガジェットをトップページでのみ表示する方法について記載します。

Blogger:HTML/JavaScriptガジェットを、投稿ページのみに表示する方法

Bloggerにて、HTML/JavaScriptガジェットを、投稿ページのみに表示するには、Blogger のテンプレートの HTML を編集して、以下のタグを追加する必要があります。

<b:if cond='data:blog.pageType == &quot;item&quot;'>

~この部分が、投稿ページでのみ表示されます。~

</b:if>


なお、Blogger のテンプレートの HTML の編集には危険性が伴います。
必ず、以下のページをご確認ください。

Blogger:BloggerのテンプレートのHTMLを編集するときに気を付けること
Dr.ウーパのコンピュータ備忘録


例:HTML12 という id 属性を持つ、HTML/JavaScript ガジェットを投稿ページのみに表示する場合

元々の Blogger のテンプレートの HTML に対して、赤字・太字の部分のコードを追加します。

<b:widget id='HTML12' locked='false' title='' type='HTML'>
 <b:includable id='main'>
  <b:if cond='data:blog.pageType == &quot;item&quot;'>

    ~元々のHTMLコード:省略~

  </b:if>
  </b:includable>
</b:widget>


これで、HTML12 という id 属性を持つ、HTML/JavaScript ガジェットは投稿ページのみに表示されるようになりました。


注意点

なお、b:if タグを、b:includable タグの外側や、b:widgetタグの外側に書こうとすると、エラーとなるため記載することが出来ないので注意が必要です。


b:if タグを、b:includable タグの外側に書いた場合のエラー
テンプレート プレビューを読み込めませんでした: The widget with id "HTML12" cannot contain element: "b:if". A widget can only contain b:includable elements.

b:if タグを、b:b:widget タグの外側に書いた場合のエラー
テンプレート プレビューを読み込めませんでした: The widget with id HTML12 is not within a section (actual parent element is: b:if.) Every widget should be in a section.



まとめ

このように、Blogger では、テンプレートの HTML を編集することで、HTML/JavaScriptガジェットを、投稿ページのみに表示することができるようになります。


関連記事

Blogger:特定のガジェットをトップページにのみ表示する方法
http://upa-pc.blogspot.com/2015/04/blogger-gadget-show-toppage-only.html
Dr.ウーパのコンピュータ備忘録





関連記事

関連記事を読み込み中...

同じラベルの記事を読み込み中...
Related Posts Plugin for WordPress, Blogger...