サポート » テーマ » ヘッダー デフォルト フォントの変更

  • 解決済 kazenoka

    (@kazenoka)


    お世話になっております。
    初投稿です。

    ヘッダーのデフォルトフォント変更に苦戦してます。

    とりあえずはサイト基本情報のサイトタイトルのフォント(英字)とヘッダーの固定ページのフォントを別々のフォントに変更したいです。

    サイト基本情報のキャッチフレーズはデフォルトのままで大丈夫です。

    テーマは「 Go 」を使用しております。

    google fonts 「 rightous 」をダウンロードしました。

    プラグインは「Simple Custom CSS and JS」を追加してあります。

    お忙しいところ申し訳ございませんが教えて下さい。

    よろしくお願いします。

    ヘルプの必要なページ: [リンクを見るにはログイン]

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • kazenokaさん、こんにちは。

    サイト基本情報のサイトタイトルのフォント(英字)

    とは、社名の h1 タグのことでしょうか。
    サイトトップでは h1 タグですが、固定ページでは span タグになりますが、同じ class が指定されているので、
    .site-title {}
    で問題ないように思えます。

    ヘッダーの固定ページのフォント

    これはどこを指していますでしょうか…
    ヘッダー全般だとすれば、
    #site-header {}
    でよさそうな気がしますが、 css の適用順で指定が上書きできないこともあるので、ヘッダー内のサイトタイトル部分だけ別指定したいならば、上記ヘッダー指定をした行よりも下に
    #site-header .site-title {}
    などのように適用順が後になるように css を指定してみましょう。

    なお、テーマの css で font-family の指定がデフォルトであるようです。子テーマの css での指定になるとは思いますが、適用順をよく考えて指定されることをお勧めいたします。

    基本的に css だけの質問内容のように見受けられますので、こちらのフォーラムでは WordPress に関連しない質問ですと回答がつきづらいと思います。html や css の回答を行っている他のフォーラム等をご利用されてみてはいかがでしょうか。

    ご参考になれば。

    スレッド開始 kazenoka

    (@kazenoka)

    shokun0803 様

    コメントいただきましてありがとうございます。

    WordPress

    ダッシュボード

    外観

    テーマの中から選んだ「 Go 」というテーマだったので、こちらのフォーラムと思っていました。

    申し訳ございません。

    教えて頂いたCSSを、インストールしたプラグインのカスタムCSS & JSにいろいろと入力してみましたが初心者の私には解決に至りませんでした。

    まだまだ勉強不足です。
    他のフォーラムも覗いてみたいと思います。

    お手数をおかけしまして申し訳ありませんでした。

    またよろしくお願いします。

    ありがとうございました。

    こんにちは

    CSS がよく分からないのであれば、プラグインを使用するのはどうでしょうか。
    Fonts Plugin | Google Fonts Typography プラグインなどは、CSS を記述することなくヘッダーやタイトルを Rightous フォントに変更することができると思います。

    スレッド開始 kazenoka

    (@kazenoka)

    ishitaka様

    コメントいただきましてありがとうございます。

    教えていただいた
    「Fonts Plugin | Google Fonts Typography」
    をインストールしたところ無事に解決しました!

    少しずつではありますがイメージに近づいてきて楽しいです。

    また何かありましたら是非ともよろしくお願いします。

    本当にありがとうございました。

    こんにちは、横から失礼します。

    go というテーマは、CSS Variables という比較的新しいスタイルの指定方法が使われています。

    なので、サイトタイトルのフォントサイズを変更する場合は、以下のように、カスタマイザーの追加CSSに記述するといいですよ

    
    body{
        --go-site-title--font-size: 3rem;
    }
    

    あら、解決済みみたいですね。お邪魔しました

    CSS Variablesは、WordPress5.8のサイトエディタ、ブロックエディタなどでも使われているので、実際の使い方は、ググってみるといいですよ。

    • この返信は2日、 13時間前にnobitaが編集しました。
    スレッド開始 kazenoka

    (@kazenoka)

    nobita様

    コメントいただきありがとうございます。

    早速サイトタイトルを大きくすることができました。

    たいへん嬉しいです!

    また機会がございましたら色々と教えてください。

    ありがとうございました。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • このトピックに返信するにはログインが必要です。