ACTION Google その他

フォントの種類・変更(Googleフォント含む)

フォント設定

基本フォント

テーマ管理の「全体設定」>「フォントの種類」にてサイト全体や見出しタグのフォントなどを変更できます。

基本記事タイトル・見出しタグ(h2~5)・ウィジェットタイトル・バナー風ボックス・コメント・NEW ENTRY・関連記事
サイト名サイト名(モバイル・フッター含む)
記事一覧タイトル記事一覧タイトル
各メニュー(第一階層及びウィジェットボタン)各メニュー(第一階層及)・ヘッダーバナー・スマホミドル・スマホフッター・タグクラウド・カテゴリリンク・ウィジェットボタン
各メニュー(第二階層以下)各メニュー(第二階層以下)
おすすめ記事・ブログカードおすすめ記事・ブログカード

※利用OSにフォントがインストールされていない場合は反映されません

適応ID及びクラス

適応ID及びクラスを記載することで任意のテキストにも反映させることができます。

  • 複数のクラスに適応する場合は「,(半角カンマ)」で区切ってください。
  • 末尾の「,(半角カンマ)」は不要です

表示速度優先時は使用不可

様々なフォント設定例

Yahoo!ニュース
font-family: 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,"メイリオ",Meiryo,Osaka,'MS Pゴシック',MS PGothic,sans-serif;
note
font-family: YakuHanJPs,"Segoe UI",Arial,Meiryo,sans-serif;
myBest

https://my-best.com/

font-family: -apple-system,BlinkMacSystemFont,Roboto,arial,helvetica,Hiragino Kaku Gothic ProN,"ヒラギノ角ゴ ProN W3",Meiryo,sans-serif;
文春オンライン
font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',YuGothic,'Yu Gothic','メイリオ', Meiryo,'MS ゴシック',sans-serif;
毎日キレイ

https://mainichikirei.jp/

font-family: Helvetica Neue, Helvetica, Arial, Geneva, sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", verdana, Osaka, "MS Pゴシック", "MS PGothic", Sans-Serif;
女子SPA

https://joshi-spa.jp/

font-family: "游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
当サイト
font-family: europa,-apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Hiragino Kaku Gothic ProN", "メイリオ", meiryo, sans-serif;
その他
font-family:"Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Arial, メイリオ, Meiryo, sans-serif;

「その他(優先)」に記載して使用します。いいなと思うサイトがあったらどんなフォントを使っているのか見てみるのも良いですね。

Googleフォント

https://fonts.google.com/ にて任意のフォントの①「+」をクリックして出てきた②をクリック

①のhttpsで始まる「URLの部分のみ」と
②のfont-family:で始まる「全て」それぞれメモ

テーマ管理で設定

テーマ管理の「Googleフォント」にて

①に先ほどの「URL」、②に「fontfamily:~;」を記入して保存

fontfamilyは「;」まで全て記入

③反映箇所

従来のGoogleフォントとの設定範囲もより柔軟に使いやすいように基本に合せた設定範囲に変更致しました。

サイト名・コメント・NEW ENTRY・関連記事サイト名・NEW ENTRY・関連記事・コメント
記事タイトル・見出しタグ・ウィジェットタイトル 他記事タイトル・見出しタグ(h2~5)・ウィジェットタイトル・バナー風ボックス
記事一覧タイトル記事一覧タイトル
各メニュー(第一階層以下)各メニュー(第一階層以下)・ヘッダーバナー・スマホミドル・スマホフッター・タグクラウド・カテゴリリンク・ウィジェットボタン
各メニュー(第二階層以下)各メニュー(第二階層以下)
ブログカード・おすすめ記事タイトルブログカード・おすすめ記事タイトル
SNSボタンSNSボタン
 電話番号・任意記事のナンバー・Views(EX) 電話番号・任意記事のナンバー・Views(EX)

※「基本」の方で指定している箇所はそちらが優先されるので!importantを付与するか、上記を無効化して下さい。

数字だけフォントを変える(Google Fonts) #HTML - Qiita
数字だけフォントを変える(Google Fonts) #HTML - Qiita

数字だけフォントを変えたい時、Google Fontsだと簡単にできます。Google Fontsh ...

qiita.com

適応ID及びクラス

適応ID及びクラスを記載することで任意のテキストにも反映させることができます。

複数のクラスに適応する場合は「,(半角カンマ)」で区切ってください。

※末尾の「,(半角カンマ)」は不要です

設定するフォントの種類によってはリストの並びにズレが生じたり、太字設定などが反映されないなどの不具合が生じる場合がございます。

解決しないことは検索もしてみてね

あなたにおすすめ

カード型デザイン・ワイドレイアウトなど20以上の特別機能を追加する

AFFINGER EX

ここが便利

  • 20以上の特別機能内容を見る)を解放
  • 列数を変更できるカード型デザイン
  • タグ一覧・無限スクロール・ワイドデザイン 他多数

EX版はAFFINGERを購入した方だけがアップデート(有料)できる最上位版です。

様々なアクセスアップや収益化に役立つ機能が搭載しており、非常に満足度と人気の高いバージョンです。

サンプルをみる

追加機能の詳細はコチラ

AFFINGER6EX(アップグレード)版 - 【公式】STINGER STORE
AFFINGER6EX(アップグレード)版 - 【公式】STINGER STORE

12,000円 → 10,000円 AFFINGER6EXはAFFINGER6購入ユーザーのみがアッ ...

on-store.net

オススメ記事

no image 1

ver20240115よりレイアウト及びウィジェットエリア名称を一部変更いたしました。 下部にPDF ...

2

https://action-sample.com/ 上のサイトのようなカテゴリーで分けた記事一覧の ...

3

AFFINGERブロックプラグインプラグインを有効化しよう 当テーマは「AFFINGERブロックプラ ...

-ACTION, Google, その他

【AFFINGER監修】 SEOを考慮したAI記事作成ツール

AFFINGER公式マニュアル

パスワードを入力してください

- 不明な方はコチラ -

PAGE TOP