サポート » テーマ » Twenty-fourteen:左サイドバーのタイトルフォントの大きさ

  • 解決済 dean110

    (@dean110)


    CSSの意味が少し分かったくらいの初心者です。

    Twenty-fourteen:左サイドバーに「カテゴリー」「アーカイブ」などをウィジェットで組み込んだんですが、タイトルフォントの大きさを変更したいのですが、CSSのどこを変更すればよいのかどうしても分かりません。

    どなたか詳しい方がいらっしゃいましたらご教授頂けませんでしょうか。
    よろしくお願いします。

9件の返信を表示中 - 1 - 9件目 (全9件中)
  • Twenty-fourteenの左サイドバーのタイトルは
    .site-title {
    float: left;
    font-size: 18px;
    font-weight: 700;
    line-height: 48px;
    margin: 0;
    }

    .site-title a,
    .site-title a:hover {
    color: #fff;
    }
    このようになっているので、font-sizeを大きい数値にすることで変更できましたよ。

    トピック投稿者 dean110

    (@dean110)

    digit@maetelさん

    回答ありがとうございます。

    しかし、上記の箇所ですとサイトタイトルそのものの大きさが
    変わるだけでサイドバーは変化ないのですが、何か設定が必要なのでしょうか?
    (因みにphpファイルは何もさわっていません。)

    2556行目あたりの

    .content-sidebar .widget .widget-title {
    border-top: 5px solid #000;
    color: #2b2b2b;
    font-size: 18px;
    font-weight: 900;
    margin: 0 0 18px;
    padding-top: 7px;
    text-transform: uppercase;

    のところのフォントサイズを変更すると右のウィジェットサイドバーの
    タイトルは大きさが変わりますが左は変わらずです。

    分かりやすく申しますと
    ________________
    ◉カテゴリー
    ・リンク
    ・リンク
    ・リンク
    _________

    という感じでサイドバーに表示されている場合
    ”カテゴリー”と”リンク”のフォントは同じ大きさで
    色も白fffで非常に見づらくなってしまっています。

    どなたか引き続きご教授お願いします。

    『カテゴリー』や『アーカイブ』といったウィジェットのタイトルフォントサイズの変更箇所は、

    /**
     * 7.1 Widgets
     * -----------------------------------------------------------------------------
     */
    
    /* Primary Sidebar, Footer Sidebar */
    
    .widget {
    	font-size: 14px;
    	-webkit-hyphens: auto;
    	-moz-hyphens:    auto;
    	-ms-hyphens:     auto;
    	hyphens:         auto;
    	line-height: 1.2857142857;
    	margin-bottom: 48px;
    	width: 100%;
    	word-wrap: break-word;
    }

    で変更できますよね。

    こんにちは

    よくわかってないのかもしれないですが、

    左サイドバー(.secondary-navigation)は、widgetで配置ではなくて、メニューで配置じゃないですか ?
    ( 左サイドバーウィジェットの配置の仕方わかってないのかもしれないですが、やり方があれば、教えてください )

    メニューには、通常タイトルはつかないので、ナビゲーションのリンク(投稿のタイトル等)だとすると

    .secondary-navigation .menu-memu1-container{
      font-size:1.5em;
    }

    みたいな事なのでしょうか?

    トピック投稿者 dean110

    (@dean110)

    digitさん、nobitaさん 

    ありがとうございます。
    無事解決いたしました。

    因に * 7.1 Widgetsの箇所は変更すると
    右サイドバーの文字が変わりました。

    3774行目 あたりのこの箇所
    .footer-sidebar .widget .widget-title,
    .primary-sidebar .widget .widget-title {
    font-size: 16px;
    font-weight: 900;
    line-height: 1.6363636363;
    margin-bottom: 18px;

    このフォントを変更すると左のウィジェットのタイトルが変更できました。

    用語も不慣れでどうお伝えすればよいのか分からなかったので
    質問が分かりづらかったかもしれません。
    皆様にはヒントを戴きましたので助かりました。

    感謝です!

    分かりやすく申しますと
    ________________
    ◉カテゴリー
    ・リンク
    ・リンク
    ・リンク
    _________

    という感じでサイドバーに表示されている場合
    ”カテゴリー”と”リンク”のフォントは同じ大きさで
    色も白fffで非常に見づらくなってしまっています。

    サンプルサイトを作りました。
    左サイドバーのスタイルシートは、このように書いてます

    #primary-sidebar.primary-sidebar .widget-title {
    	font-size: 1.2em;
    	color: rgba(255,255,255,0.7);
    	padding: 0 10px;
    	text-align: justify;
    	letter-spacing: auto;
    	border-top: solid 1px rgba(255,255,255,0.7);
    	border-bottom: solid 1px rgba(255,255,255,0.7);
    	-webkit-font-smoothing: antialiased;
    	-webkit-text-size-adjust: 100%;
    }
    
    #primary-sidebar.primary-sidebar .widget-title:before {
    	content: "◉";
    }

    nobita さん
    Twenty-fourteen の左サイドバーは
    「.secondary-navigation」と「.primary-sidebarのウィジェットエリア」で上下に分かれているようです。
    メニューとしてカテゴリーを入れるとタイトルは必要ないですが、
    ウィジェットとしてカテゴリーを入れる場合は、タイトルが出てきますしフォントサイズが小さくなるのでユーザーによって気になるところでも在るのでしょうね。

    dean110さん
    特有のジャンルなどでなくカテゴリータイトルに特色がない場合はメニューとするのもいいでしょう。

    トピック投稿者 dean110

    (@dean110)

    digitさん

    ありがとうございます。
    サンプルサイト拝見させて頂きました。

    最高にかっこいいですね。
    参考にさせていただきます。

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

    digit@maetelさん

    ありがとうございます

    わたしにもやっと理解できました

9件の返信を表示中 - 1 - 9件目 (全9件中)
  • トピック「Twenty-fourteen:左サイドバーのタイトルフォントの大きさ」には新たに返信することはできません。