Imaginary theme

Imaginaryの記事／追加ページの本文の画面の左下に表示される概要ボタンは本文に見出し、HTMLのh1かh2かh3の見出しタグがあった場合にそれを取り込んだ目次を自動生成して表示します。 本稿ではボップアップの目次と本文への自動生成の目次の追加とポップアップのコンテンツのカスタマイズについて紹介します。 カスタマイズは全てBloggerの管理画面の「テーマ」のカスタマイズの右横のメニューボタン（▼）のHTMLを編集かバックアップと元に戻すからテンプレートのソースコードを書き換えます。 追記：Imaginaryのポップアップの目次は2023年4月3日のバージョンから搭載していますので、それ以前のバージョンを使っている場合はポップアップの目次を表示できるバージョンに取り替えて下さい。 ポップアップの目次のソースコード ポップアップの目次のソースコードについて説明します。 最後のscriptタグのSu…

ブログに画像や動画を掲載すると容量が大きくてページの表示速度が下がります。閲覧するのに時間が訪問者を減るかも知れないので、なるべくページの表示速度を高めた方が良いと思います。 初回画面が三秒以内に表示されれば遅くて嫌になることは少ないといわれます。 魅力的な画像や動画を掲載しても不利益を被らないために記事／追加ページの高速化として投稿画像や動画の遅延読み込みや軽量化などのカスタマイズを紹介します。 Imaginaryに高速化のプログラムを取り付ける Man tying his shoes by Alexander Redl / Unsplash 投稿画像や動画の遅延読み込みや軽量化などの高速化に関して有利だと考えられる様々な機能を一つに纏めたプログラムを使います。 普通よりも使い辛くなる部分がありますので、予め留意して取り付けるようにして下さい。 記事本文をJavaScriptを使って出します。Goo…

記事ページのヘッダー 著者名、公開日（設定の一つ目は旧式で無効です）の機能が使えます。 記事タイトルに記事ページのブックマークリンクが付きます。 Bloggerのユーザープロフィール（Bloggerの「設定」のユーザ設定から編集）があれば著者名にリンクが付いてアイコンがあれば著者名の前に表示されます。 投稿の公開日には公開日の年月のアーカイブのリンクが付きます。 記事ページの本文 文章のデザインのサンプルを示します。 本文 本文 本文 見出しのh1 見出しのh2 見出しのh3 見出しのh4（本文と同じ文字サイズ） 見出しのh5 見出しのh6 引用文 引用文 引用文 リンク名／アンカーテキスト リスト リスト リスト 記事ページのフッター 投稿をメールするリンク、ラベル、リアクション、投稿の下に投稿者のリンクを表示、コメント（件数表示は反映しません）、そしてBloggerの「収益」がオンの場合には投稿の間に広告を表示するの機能が使えます…

全部で七つのセクションに大別されます。 ヘッダー ページリスト (先頭) Search (Top)／検索（先頭） ページの本文 サイドバー Page Sub／ページの補足 フッター Bloggerのレイアウトから編集できますが、5と6だけがウィジェットの入れ替えが可能です。 インデックスページの最初のスニペットと記事／追加ページの本文の上にフローティングバーが付いています。 スマホやタブレットなどの小画面のデバイスではフローティングバーの左端の三本線のハンバーガーメニューでサイドバーを開き、サイドバーの右上のバツ印でサイドバーを閉じます。 ブログの幅以上の大画面のパソコンなどのデバイスではサイドバーはブログの右端に最初から開いて表示されます。 モバイルのフローティングバーの左端のハンバーガーメニューの右隣の虫眼鏡がSearch (Top)のセクションのブログ内検索を開閉するボタンです。 右端の三つはパソコンでF…