本記事執筆時点での F-light の最新バージョンは11月13日にリリースした 1.27 ですが、まだ旧バージョンを使われている方が散見されます。(中にはアップデートされてることを知らないユーザーもいるのかもしれませんが)
1.26 と 1.27 は不具合修正の更新なので最新版へのアップデートが推奨なのですが、既にがっつりカスタマイズされた状態だと、テーマ(テンプレート)の上書きでリセットされてしまい、また一からやり直さなきゃならないので躊躇してしまいますよね。
というわけで、バージョン 1.26 と 1.27 で修正された不具合内容の詳細と、手動で修正対応する手順を説明したいと思います。
v1.26 で修正した不具合
トップページ記事一覧のスニペットに含まれる一部のタグ(<b>, <i>, <em>, <div> など)の影響で意図せぬ箇所の文字が太字や斜体になってしまったり、サイドバーのレイアウトが崩れてしまったり、記事リストのリンクが効かなくなってしまう等の不具合。
参考: Bloggerブログでフッターやサイドバーなどの文章が太字や斜体に変わる原因を突き止めた (些細な日常)1ページ目では問題なくても2ページ目以降でおかしくなってる場合が多々あるので一度ご確認を。特に記事リストのリンクが効かなくなっている状態は見た目では分からないのでクリックして確認してみて下さい。
原因はスニペットが開始タグと閉じタグの間で切れてしまっているためで、記事編集で適切な位置に 追記タグ <!--more--> を挿入することでも回避は可能ですが、テンプレートのスニペット処理コードを変更することで、わざわざ当該記事を探して編集する必要がなくなります。
余談ですが追記タグをきちんと挿入することでこういう不具合も回避することができます → 注意！あなたのBloggerのメインページは投稿数が勝手に減っているかも！ - after work lab
変更手順
HTMLを編集しますので必ず予めバックアップを取ってから行って下さい。もしくはテスト用の環境(別ブログ)を用意してそちらで試されることをおすすめします。
テーマの HTML 編集にて以下のコードを検索で探します。編集画面をクリックしてアクティブにした状態で Ctrl + F を押すと左上に検索窓が出現するので、そこにコピペして Enter を押します。
<b:eval expr='snippet(data:post.body,{length: 120, links: false, linebreaks: false, ellipsis: true})'/>2箇所(ブログの投稿と注目の投稿)ありますので、2箇所とも以下のコードと置き換えて下さい。
<data:post.snippets.short/>v1.27 で修正した不具合
ガジェットのタイトルを空白にすると、装飾のラインだけが残ってしまう、という地味なバグです(^^;
ちなみに当ブログの省略されているガジェットタイトルは、これまで CSS で display:none で消していました。なので今までこのバグに気づかなったというわけなのです(^^;
タイトルを空白にしないという方は修正は不要ですが、当ブログのようにガジェットによってタイトルなしにしたい方は変更をお願いします。
変更手順
1.26 の手順と同じく当該コードを全て置き換えるだけです。ただしガジェットの分だけ変更する必要があるので数が多いです(デフォルトで8か所)。なのでメモ帳等のテキストエディタの置換機能で一括変換するのがおすすめです。
以下のコードを探し、全て変更します。
<div class='title'><data:title/></div><b:if cond='data:title != ""'><div class='title'><data:title/></div></b:if>Diff Checker を活用する
ちなみにこちらの差分チェックサイト (Diff Checker) で変更前後を見比べながら作業するというやり方もあります。(更新履歴ページのバージョン番号が差分チェックページへのリンクになっています)
DiffChecker の基本的な使い方を簡単に説明しますと、スクロールバーをクリックするとハイライト表示された変更箇所にジャンプし、そこをクリックすると下部にツールバーが出ます。↓や↑をクリックすると変更箇所を順に辿れます。
最後に
もう大きなバグはないだろうとは思いますが、万が一発覚した際にはテンプレートのアップデートと同時に、今回のように手動での対応手順を説明します。
コメントを投稿
別ページに移動します