【Blogger】b:widget 由来の div の属性を削除する

Blogger のテーマ編集上で使える独自タグには様々な種類があり、ウィジェットを表すタグ b:widget もそのうちの一つです。

例えばウィジェットバージョン1のブログの投稿ウィジェットの場合、このようなコードで表すことができます。

<b:widget id='Blog1' locked='false' title='ブログの投稿' type='Blog' version='1'/>
  ...
</b:widget>

この b:widget は実際の HTML 上では以下の通り div として出力されます。

<div class='widget Blog' data-version='1' id='Blog1'>
  ...
</div>

b:widget が div に変換される前後の属性を比較してみると、id はそのままに、type は属性値に widget が加わり class に、version は data-version にそれぞれ置き換わっているのがわかると思います。

正直に言うと筆者の Blogger の使い方ならこれらの属性全てが不要なので、ソースコードを少しでもすっきりさせるためにも、この b:widget 由来の div の属性を削除する方法を考えてみました。

アイキャッチ

b:widget 由来の div の属性を削除する

属性を消したいウィジェット b:widget 内の <b:includable id='main'>（開始タグ）の直後に以下のコードを追加するだけです。

<b:attr name='id' value=''/>
<b:attr name='class' value=''/>
<b:attr name='data-version' value=''/>

b:attr の name に削除したい属性の名前を入れつつ value の中身を空にしておくと、その属性自体を削除できます。こうすることで b:widget 由来の div タグが以下のようにとてもシンプルになります。

<div>
  ...
</div>

ただし思わぬ表示崩れや機能の不具合を起こさないためにも、Blogger の標準 JavaScript を有効にしている場合は id を、標準 CSS を有効にしている場合は class を、削除せず残しておいたほうが無難です。

少なくとも、ブログアーカイブウィジェットの id を消してしまうと、階層アーカイブにおいて記事タイトルと URL が取得できなくなることが確認できました。ちなみにブログの投稿ウィジェットのライトボックスは id を消しても通常通り使えます。

筆者は高速化のために標準 JS と CSS を無効にしているため容赦なく全属性を削除しましたが、テスト用のブログで様子を見てからの実装をおすすめします。

b:defaultmarkups でテンプレート化する

様々なウィジェットの b:widget 由来の div の属性を削除したいとき、いちいち b:attr を3つずつ記述するとそこそこかさばりますし、一括で残したい属性が見つかったら修正するのもひと苦労。そんなときはテンプレート化するのが手っ取り早いです。

以下のコードをできれば </head> または </body> の前に追加します。

<b:defaultmarkups>
  <b:defaultmarkup type='Common'>
    <b:includable id='remove-attributes'>
      <b:attr name='id' value=''/>
      <b:attr name='class' value=''/>
      <b:attr name='data-version' value=''/>
    </b:includable>
  </b:defaultmarkup>
</b:defaultmarkups>

remove-attributes の文字列は任意のものに変更していただいて構いませんが、必ず他の b:includable の id や b:include の name と被らないものにしてください。

上記のコードが設置できたら、前項と同様に ウィジェット内の <b:includable id='main'>（開始タグ）の直後に以下のコードを追加します。

<b:include name='remove-attributes'/>

一度テンプレ化してしまえば、b:widget に b:attr を複数個並べるより追加するコードも少なくて済みますし、 b:defaultmarkups 内の b:includable の中身を書き換えるだけでウィジェットの属性を一括で変更できます。

このウィジェットにはやっぱり個別にこの属性が必要！という場合には、属性削除用の b:include の直後に新たに b:attr を追加すればオッケーです。

こうして b:widget 由来の div をすっきりさせたことですし、同じように b:section 由来の div の属性も一括削除できないかなと思いましたが、これはどうやら無理みたいでした。残念！

編集
ホーム