スキップしてメイン コンテンツに移動

Imaginary theme

フォント変更のためのVariableタグの一覧表

Bloggerブログのフォント(字体)はカスタマイズで変更することができます。

管理画面のテーマのカスタマイズのテーマデザイナーのフォントで用意された一部の英数字以外はCSSを書き換える必要があり、その場合、Imaginaryのテンプレートに的確に反映させるためにはソースコードのVariableタグを書き換えるのが最良だと思いますので、どこを変えられるかの対応を載せます。

Imaginaryのフォント設定のVariableタグ

黒板に「Time for Change」と白墨で書かれている
Time for change by geralt / CC0

九つのVariableタグでブログのフォントが全て設定されています。

Variable①ページのテキスト:フォント

<Variable name="body.text.font" description="Font"
    type="font"
    default="16px sans-serif"  value="16px sans-serif"/>

Variable②ブログタイトル:フォント

<Variable name="blog.title.font" description="Font"
    type="font"
    default="bold 180% sans-serif"  value="bold 180% sans-serif"/>

Variable③タブのテキスト:フォント

<Variable name="tabs.font" description="Font"
    type="font"
    default="100% sans-serif"  value="100% sans-serif"/>

Variable④投稿:投稿タイトルのフォント

<Variable name="posts.title.font" description="Post title font"
    type="font"
    default="bold 163% sans-serif"  value="bold 163% sans-serif"/>

Variable⑤投稿:投稿タイトルのストリームのフォント

<Variable name="posts.stream.title.font" description="Post title stream font"
    type="font"
    default="bold 163% sans-serif"  value="bold 163% sans-serif"/>

※インデックスページのスニペットの投稿タイトル。

Variable⑥投稿:投稿のテキストのフォント

<Variable name="posts.text.font" description="Post text font"
    type="font"
    default="16px sans-serif"  value="16px sans-serif"/>

Variable⑦投稿:引用のフォント

<Variable name="blockquote.font" description="Blockquote font"
    type="font"
    default="16px sans-serif"  value="16px sans-serif"/>

Variable⑧検索:入力のフォント

<Variable name="search.input.font" description="Input font"
    type="font"
    default="16px sans-serif"  value="16px sans-serif"/>

Variable⑨閲覧の多い投稿:人気の投稿のタイトルのフォント

<Variable name="popularposts.title.font" description="人気の投稿のタイトルのフォント"
    type="font"
    default=" bold 120% sans-serif"  value="bold 120% sans-serif"/>

何れもテーマデザイナーの各項目に一致してます。帯文字の部分がブログの所定の場所で反映するフォントになりますので、Google FontsなどのWebフォントならば読み込みのソースコードも追加した上で、使いたいものに書き換えると新しいフォントにカスタマイズできます。

ブログ全体に新しいフォントを反映させたい場合は、九ヵ所、全てのフォントを書き換えて下さい。

  • ブログの投稿者: 結城永人
  • タイトル: フォント変更のためのVariableタグの一覧表
  • 最終更新: 
自分の写真
二十代前半から作家活動を天職として何よりも励んで来ました。当初は小説家を志望していましたが、十年を経て作詩する機会も増すほどに詩人こそ素性だと認めるに至りました。以降、個人的に永遠を歌う生き方として自分の中で最も重要な位置を占めています。ブログについては2015年から『些細な日常』を本格的に運営しています。人生健康芸術学問娯楽開発言語政治社会歴史生物自然、等々、どんな話題でも自由気儘に取り上げるつもりです。今までの経験を活かしながら新しい思考や表現を得られれば良いと思ってやっています|学歴:経済学士。職歴:物流業。資格:はんだ付け。特技:ダイエット。

コメント

人気の投稿

記事/追加ページの画像の遅延読み込みや軽量化による高速化のカスタマイズ

イメージ

ブログに画像や動画を掲載すると容量が大きくてページの表示速度が下がります。閲覧するのに時間が訪問者を減るかも知れないので、なるべくページの表示速度を高めた方が良いと思います。 初回画面が三秒以内に表示されれば遅くて嫌になることは少ないといわれます。 魅力的な画像や動画を掲...

インデックスページのスニペットの本文の削除と項目の並び替えのカスタマイズ

イメージ

Imaginaryのインデックスページ:トップとアーカイブとラベルとブログ内検索では記事のスニペットが表示されますが、初期値では記事のタイトルと画像と抜粋と二つのリンク(アーカイブと続きを読む)が表示されます。 テンプレートのデザインのカスタマイズとしてスニペットの本文の削除...

読み込みボタン/無限スクロールの手動化のカスタマイズ

イメージ

Imaginaryのインデックスページ、つまりトップページとアーカイブページとラベルページとブログ内の検索結果ページではスクロールが画面下に達すると次のページを自動的に読む込むという無限スクロールが搭載されています。 本稿では画面スクロールによる動作を停止して読み込みボタンで...