全テンプレート対象 修正のお知らせ

全テンプレート対象 修正のお知らせ

テンプレート テンプレ不具合・修正など
2022/01/08
16
vanillaice (Akira)
vanillaice (Akira)

個別記事のサムネイル画像つきページナビを中心に、修正・メンテナンスを行いました。対象は 現在リリース中の全テンプレート です。

テンプレートによっては 無理に再ダウンロードする必要なし というものもあります。ご利用中のテンプレートに関する情報をチェックし、再DLを行うかどうか決定をお願いします。

また、「ordinary_days」「wash_ashore」については立て続けの修正となりご迷惑をおかけします。

主要の修正・変更

  • 個別記事のサムネイルつきページナビのJS修正
  • FC2ブログ新機能「SEOアドバイザー」に対応するためのhead要素記述方式変更
  • その他不備・不具合修正及びjQueryのバージョン変更など

iOS14以降でページナビのサムネイルが時折表示されない現象

iOSなので iPhone ですね。OSのグレードは14、バージョンははっきりしませんが後半のものが対象です。また、デバイスによって生じないものもあるようです。パソコンでは発生しません。複雑な箇所ですが、カスタマイズ済みなど再DLが困難と思われる場合は修正の仕方を各テンプレート専用記事に記載しますので、お手数ですが手順に従ってご自身で編集を行ってください。

ページナビの仕様に関する技術的なことは以下の「詳細を見る」をクリックして内容をご覧ください。

このページナビのサムネイルは、非同期処理によって前後ページのOGPを取得しています。なので ブログ管理人がOGP設定をopt in(有効)にしていること が大前提です。OGP設定opt out(無効)の場合は何も取得されません。これまでのページナビの仕様では 取得エラー つまりJS実行エラーとなります。

OGP設定ページへ

非同期処理には xmlhttprequest というメソッドを利用していましたが、今回 fetch に変更を行いました。比較的新しい技術なので、古いデバイス(OS)は対象外となります。いずれにしろテンプレートのOSサポート自体「現行及び1つ前まで」ではあります。

サムネイルが出たり出なかったり、という症状の原因ですが、promise 処理が甘かったな、と思っています。前後ページのOGP取得に失敗するのではなく、スクロールイベントとのかみ合わせが悪かった。

ページナビはページの下の方にありますので、ページをローディングした直後にサムネイルを取得する必要は無いですよね。ここを仮にページローディングと同時に処理してしまうとLighthouseなどから「below the fold(ファーストビュー外)の画像はlazy(遅延読み込み)を行いなさい」みたいな減点を受けるかと思います。そのため、ユーザーによる任意スクロールが発生してから処理を実行、という方法を取っています。

ところがスクロールイベントというのは通常、スクロールが発生する度に発火しますので、何度も何度も処理を実行してしまうことになります。そのため「スクロール発生で発火 + 終了」という方式にしてあります。つまりスクロール時に一度だけ実行ですね。そして恐らくサムネイル情報を取得して、現在閲覧中ページでそのサムネイルを指定の位置にあてはめて表示する前に処理が中断されてしまうのだろうと思います。iOS自体xmlhttprequestと相性が悪くなっている感もあります。

予約した処理を確実に実行するためのプロセスを再構築しました。また、OGP未設定の場合にエラー判定にならない処理も追加しました。サムネイル表示不備は今回の修正で解消されるはずで、もしかすると症状自体を確認できない方もいらっしゃる可能性がありますが、できれば変更をおすすめします。

OGP未設定の場合にページナビのスタイル自体を再編成しようかとも思いましたが、OGP設定はよほどの理由が無い限り有効化をおすすめ したいので、再編成はやめました。若干不自然にしておかないとみなさん気づかないので ^^;

SEOアドバイザー対応

本件については以前に記事を書いたのでご参照ください。記述方式を変更しただけで内容的にはさほど変更はありませんので、本件のためだけに再DLする必要は無いと思います。他の件と絡めて決定をお願いします。

「SEOアドバイザー機能が追加されました」というアナウンスがありました

「SEOアドバイザー機能が追加されました」というアナウンスがありました

新機能のアナウンスがありました。テンプレートの構成に係る内容なので簡単な説明をしておきたいと思います。結論から言うと「特に何もしなくて良い」ということです(もちろん私が作成したテンプレートのことしか言及できません)...

その他の修正

ページナビ・アドバイザーの2件を作業中、テンプレートによって不備に気づいたものは修正を入れています。詳細は以降に掲載する各テンプレートの表をご覧ください。

各テンプレート修正表

リリース日が新しい順に記載しています。緑のチェックマークは修正完了を意味しています。また、ブログ内限定配布については

  • Transit
  • Ample
  • Choir

の3テンプレートについて、ページナビJSのみをサポート致します(再配布はありません)

テンプレート名 ページナビ修正 head修正 その他修正 リンク
ordinary_days コメント関連ツールチップ修正 専用記事へ DLページへ
wash_ashore コメント関連ツールチップ修正 専用記事へ DLページへ
Francesca なし 専用記事へ DLページへ
Halo なし 専用記事へ DLページへ
El-zigzag なし 専用記事へ DLページへ
BigGirlNoCry なし 専用記事へ DLページへ
OmbreRose なし 専用記事へ DLページへ
Magazine なし 専用記事へ DLページへ
Fall なし 専用記事へ DLページへ
Haven なし 専用記事へ DLページへ
Mystyle なし 専用記事へ DLページへ
Blowing なし 専用記事へ DLページへ
Tarth なし 専用記事へ DLページへ
Muse なし 専用記事へ DLページへ
tremolo なし 専用記事へ DLページへ
alias-Jane なし 専用記事へ DLページへ
Lilting なし 専用記事へ DLページへ
Son-Of-Valkyrie なし 専用記事へ DLページへ
Bron-Broen なし 専用記事へ DLページへ
Greetings なし 専用記事へ DLページへ
La_Vita コメント送信ボタン背景色調整
コメント編集ページのボタン位置調整
専用記事へ DLページへ
Behavior jQueryを3.6.0にアップデート 専用記事へ DLページへ
Donna コメント送信ボタンの背景色調整 専用記事へ DLページへ
CommonSense なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Crescent jQueryを3.6.0にアップデート 専用記事へ DLページへ
Hymn jQueryを3.6.0にアップデート 専用記事へ DLページへ
Generic なし jQueryを3.6.0にアップデート
個別記事ページナビセレクタ記載ミス修正
専用記事へ DLページへ
Axis なし 専用記事へ DLページへ
Pinboard jQueryを3.6.0にアップデート 専用記事へ DLページへ
Classica jQueryを3.6.0にアップデート 専用記事へ DLページへ
Out-of-style jQueryを3.6.0にアップデート 専用記事へ DLページへ
VeryMerry jQueryを3.6.0にアップデート 専用記事へ DLページへ
Empty-street jQueryを3.6.0にアップデート 専用記事へ DLページへ
Sincerely-yours jQueryを3.6.0にアップデート 専用記事へ DLページへ
Dark-Divine jQueryを3.6.0にアップデート 専用記事へ DLページへ
Room38 なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Chronicle なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Juliette-Note なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Pianissimo なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Swollen なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Vanilla-Sky なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Cabbie なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Synchronisity なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Juvenile なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Basement なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Message なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Life-is なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Arrival なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Corridor なし jQueryを3.6.0にアップデート
スマホでコメント送信ボタンテキストが見づらい件修正
専用記事へ DLページへ
Colony なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Fraise なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Nostalgia なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Little-thing なし なし 専用記事へ DLページへ
Mocha なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Belong なし jQueryを3.6.0にアップデート
個別記事ページナビセレクタ記載ミス修正
専用記事へ DLページへ
All-about-us なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Sweetie なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Southerly なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
Promise-Me なし jQueryを3.6.0にアップデート
スマホでコメント送信ボタンテキストが見づらい件修正
専用記事へ DLページへ
Alternative なし jQueryを3.6.0にアップデート
スマホでコメント送信ボタンテキストが見づらい件修正
専用記事へ DLページへ
Decoy なし jQueryを3.6.0にアップデート
スマホでコメント送信ボタンテキストが見づらい件修正
コメント編集ページボタン周り余白調整
専用記事へ DLページへ
Jingle なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
GirlOnWire なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
TheCity なし jQueryを3.6.0にアップデート 専用記事へ DLページへ
OnTheGround なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Capricious なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Ranchu なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Sakura_nightglow なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Sakura_daylight2 なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Sakura_daylight なし jQueryを3.6.0にアップデート
ブログタイトルの太字調整
専用記事へ DLページへ
Transit なし なし 専用記事へ
Ample なし なし 専用記事へ
Choir なし なし 専用記事へ
Related post

Comments  16

-
2022/01/09 (Sun) 10:23

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
vanillaice (Akira)
2022/01/09 (Sun) 16:06

To 諸々の件 内緒さん

こんにちは ('0')/

今内緒さんの視聴リストを拝見していて、「三国志」があるじゃないですか!
私三国志大好き、自称マニアです(あくまでも自称です)

Three kingdomsの諸葛孔明が今まで見た映画やドラマの中では一番好きです。他のドラマや演義なんかで書かれているようなスーパーマンでなくて、間違えもするし悩みもする普通の人間という感じで良かった。
というか、みんな良かった。ただ雲長の方は「体ちっさ! ( ̄∀ ̄;)」と思いました ^^: (それ以外はほぼ完璧)
あと最初は曹孟徳の役者さんが若干大根かと思ったんですが、見ているうちに全く逆の評価に。この方は仕草が素晴らしい。

ちなみにこのドラマ3回見てます。全95話でしたか。家族には「またかよ、バカかよ (∵`)」って言われてる(笑)

-
2022/01/10 (Mon) 08:17

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

-
2022/01/11 (Tue) 12:52

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
vanillaice (Akira)
2022/01/11 (Tue) 16:46

To Choir tocの件 内緒さん

こんにちは ('0')/

今修正済みの状態ですよね。スクリーンショットの該当記事と思われるページを拝見しましたが、私の環境ではパソコン, スマホ(iPhone iOS 15.2)症状を確認することができません。再起動やキャッシュクリア後に確認し、改善がなければご利用中のiOSのバージョンを教えてください。

tocの見出しレベルの件ですが、結論から言うとできません。
書き出し要素の #toc の名称を変えても駄目な理由は
・見出し要素の取得
・idの付加
がtocでは必須です。仮に別のtocを導入してしまった場合、デフォルトをA, 新規をBとすると、デフォルトのAは各見出しにidを振ります。そして同様にBも各見出しにidを振ります。この時点でidの重複が起こりますよね。id重複は動作に影響を及ぼさない場合もありますが、今回はこのidがページ内移動の到達点になりますので重複は絶対的NGです(正しく動作しません)

そしてtocのid振りはclassやidを参照するのではなく見出しのレベルを参照します。なのでAもBも同時に処理を行ってしまいます。

対処法としては
1. これまで通り最上位を h3 とする
2. これまでh3が最上位になっている記事をh2最上位に全て書き換える + tocのselectorを h2 からに変更
3. 過去にh3最上位になっているページから <nav id="toc"></nav> を取り除く(この場合はJS内部エラーですが見た目に影響はありません)

toc導入時にテンプレートの仕様確認と見出しレベルの検討を行うべきでした。今言ってもアレですが ^^;
現時点で内緒さんの記事は

h1
┗h3
┗h4

という形でh2が歯抜けになっている状態で記事を重ねています。本来は

h1
┗h2
┗h3
┗h4

こうですよね。歯抜けだけならSEO的に大きなダメージではありません(h1→h3→h2 など順序不整合の場合は別です)
お役に立てず申し訳ないです。

M
2022/01/11 (Tue) 21:19

To vanillaice (Akira)さん(お返事不要)

Akira様

お世話になっております。
ご回答、ありがとうございます。

iPhoneは、15.2にアップデートした直後に今回の不具合を見つけたので、
何かその関係なのかな?と思ったのですが、
今Akira様のコメントを拝見した後にiPhoneの閲覧履歴とキャッシュをクリアにしたら
修正されていました(汗)

ちなみに、Safariで閲覧していました。

ご迷惑をお掛けして、本当にすみませんでした(-_-;)

原因は、何だったんですかね…

TOCの件も教えて頂き、ありがとうございます!

これからh2を使うのに、見出しの数が増えてもTOCが使えないなんて変だよね?
と思いながらついつい質問してしまいました。

なお、TOCは現在お借りしているテンプレよりもずっと前から使用していて、
最初にTOCを使い始める時に気付くべきでした(;^ω^)

調べたら、600記事くらいに実装していたので、これから全部削除してみようかと思います。

貴重なご回答、非常に参考になりました。

いつもありがとうございます。

あっちゃん
2022/01/14 (Fri) 15:50

どれもすてき♡

akiraさん、今年もよろしくお願いいたします。
こうしてみると、ほんとどれも素敵すぎるテンプレートばかりで、うっとりです。( *´艸`)
先日、初めてZOOMでのレッスンを受けました。笑
DLから登録、実際の画面でのやりとりの感じなど、とても新鮮でした☆彡
だんだんと新しいことに付いていけなくなりつつありますが、チャレンジだけは恐れないでいたいです。
体調、お気をつけてお過ごしくださいね♡

vanillaice (Akira)
vanillaice (Akira)
2022/01/19 (Wed) 13:08

To あっちゃんさん

こんにちは ('0')/
お返事大変遅くなりごめんなさい。
こちらこそ本年もよろしくお願いします :)

zoom、今ちょうど次男がリビングでやってますね(笑)
一時期は家族ほぼ全員が同じ時間帯にzoomしててカオスでした ( ̄∀ ̄;)

-
2022/01/25 (Tue) 21:29

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
vanillaice (Akira)
2022/01/25 (Tue) 22:09

To Choir mixed contentの件 内緒さん

こんばんは ('0')/

googleadsenseがJSエラーでコードが古い + 重複掲載
です。現在利用中コードは
(adsbygoogle = window.adsbygoogle || []).push({
から始まっていますが、現在のadsenseは
data-ad-client
という文字列が含まれ、カスタムデータで行うはずなのでご確認をお願いします。そして重複しないよう注意してください。

上記を修正し、解消されるかどうか確認を行ってください。ご心配のエラー内容についてはSSLに関するエラーなので、広告が原因でなければFC2のバックエンドエラーの再発かもしれません(ただしそういった報告は目にしていません)

まず広告の方を対処して結果を見てくださいね。よろしくお願いします。

-
2022/01/26 (Wed) 00:40

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
vanillaice (Akira)
2022/01/26 (Wed) 01:07

To Choir mixed contentの件 内緒さん

お疲れ様です ('0')/

出てますね。「最近になって」というのと、こちらのエラーはバックエンドで生じるという点も考え合わせると、何らかの不具合が発生している可能性がありますね。
例えばJSファイル内にスタイルシートへのリンクがあり、そのスタイルシートの方にhttp通信が存在している、といったときにもこのエラーが出るんですが、今のところ見当たらないですね。原因を探しにくいものではあるので絶対とは言えないけれど。
数日様子を見て解消が無ければ運営に報告、という形でも良いかもしれません。

ただ、内緒さんのブログの場合情報量、特にカテゴリが非常に多く、このテンプレートは各カテゴリのトップにバックグラウンドでアクセスし、必要な情報を取得する、という特殊なものです。内緒さんのカテゴリ数を考えると負荷が高い気がしますね。

-----
FC2ブログは無償提供を続けてきましたので、今のところそこを崩すつもりはないのです 。ごめんなさいね (∵`)


-
2022/01/26 (Wed) 08:40

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

-
2022/01/26 (Wed) 08:43

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
vanillaice (Akira)
2022/01/27 (Thu) 17:20

To Choir mixed contentの件 内緒さん

こんにちは ('0')/

消えていますね。一時的不具合だったようで安心しました。お疲れ様でした :)

M
2022/01/29 (Sat) 04:51

To vanillaice (Akira)さん(お返事不要)

Akira様

いつもお世話になっております。

この度は、本当に助かりました。ありがとうございます!

教えて頂かなかったら、僕なんかは一生解決策が分からぬままだったと思います。

それを、一睨みでエラーの原因を発見されるスゴさに改めて驚かされました(゚Д゚;)

おかげさまで、お気に入りのカルーセルスライダー付きテンプレートを引き続き使わせて頂く事ができます♪

コメントに関する注意事項
  • テンプレートに関するご質問は各テンプレート専用記事でのみ受付致します。また、よくある質問をまとめているページも事前にご参照ください。
  • 専門的なご質問の場合、記事内容と明らかに関連の無い内容はお控えください(雑談の場合はその限りではありません)
  • 第三者が不快と感じる内容や論調でのコメントはお控えください(性的,高圧的,暴力的など)