サイドバーの固定ページメニューにボタンを付けたい

Simplicityの特徴 フォーラム テーマファイルのカスタマイズに関する質問など サイドバーの固定ページメニューにボタンを付けたい

  • このトピックには12件の返信、2人の参加者があり、最後にささやんにより11年、 5ヶ月前に更新されました。
12件の返信スレッドを表示中
  • 投稿者
    投稿
    • #6174
      ささやん
      ゲスト

      いつもありがとうございます。
      フィードボタンの表示改善していただきありがとうございました。
      ブログカードの機能、初めて使ってみたら、すごく簡単でびっくりでした。

      私のブログなんですが、サイドバーのメニューの羅列が激しくて、ちょっと見づらいので、それぞれボタンをつけて見やすくしたいと考えています。
      しかし、調べてみても、ウィジェットのタイトルにはボタンを付けられても、ページ名、カテゴリー名までにはボタンを付けるということが書かれていなくて…。

      CSSを編集するとできるのでしょうか?
      ご存知でしたら、教えていただけますでしょうか。
      よろしくお願いします。

    • #6232
      アバター画像わいひら
      キーマスター

      こんにちは。
      ブログカード、気に入っていただけて良かったです。

      一つ確認なんですが、ボタンというのはどのようなものを指すのでしょうか?
      よろしかったら、もう少し説明をお願いします。

    • #6257
      ささやん
      ゲスト

      説明が足りず、すみません。

      たとえば、他の方のサイトを例に挙げます。
      http://co-co-wa.com/website-management-stress/

      サイドバーのカテゴリー、フッターのアーカイブの項目で△(横タイプ)がついているのですが、こういうぽボタンのようなものがついていると、メニュー項目が見やすくなると思いました。

      無理なお願いで申し訳ありませんが、よろしくお願いします。

    • #6596
      アバター画像わいひら
      キーマスター

      Font Awesomeを使った方法は、いい機会なので調べてに記事にしてみました。

      12436288584_94d6bc46d2_b.jpg
      WordPressウイジェットの部分にFont Awesomeでワンポイントおいたリストの作り方です。

      画像などを使用する場合は、以下が参考になると思います。

      12436288584_94d6bc46d2_b.jpg
      HTMLタグ・スタイルシート・特殊文字等の早見表
    • #6725
      ささやん
      ゲスト

      わいひら様、
      ご対応いただきありがとうございます。

      私はマルチドメインで運用しているので、複数のブログのボタンを付けたいのですが、
      そうなると難しいため、それぞれのリストすべてに設定するのがベターかと思います。

      ブログで説明されている通りに、編集してみたのですが、固定ページだけうまく設定できません。
      アーカイブ・カテゴリーはちゃんと表示されます。
      固定ページのリスト全部に表示設定するには、どうすればよいのでしょうか…。

      あと一歩のところでつまづいております。
      よろしくお願いします。

    • #6734
      アバター画像わいひら
      キーマスター

      ブログで説明されている通りに、編集してみたのですが、固定ページだけうまく設定できません。
      アーカイブ・カテゴリーはちゃんと表示されます。
      固定ページのリスト全部に表示設定するには、どうすればよいのでしょうか…。

      どのように書いて失敗したのかなどの情報がないと何とも言えないです。

    • #6738
      ささやん
      ゲスト

      恐れ入ります。
      子テーマに書き足したものはこちらです。

      .widget_archive li:before {
        content: " \f0da";
        font-family: FontAwesome;
        margin-right:5px;
      }
      
      .cat-item:before {
        content: " \f0da";
        font-family: FontAwesome;
        margin-right:3px;
      }
      
      .page-item:before {
        content: " \f0da";
        font-family: FontAwesome;
        margin-right:3px;
      }

      以上です。どうぞよろしくお願いします。

    • #6739
      アバター画像わいひら
      キーマスター

      ささやんさんのページを見てみたら、なぜかクラスがアンダーバーになっています。
      ×.page-item
      ○.page_item

      何で違いが出るんだろう。謎です。

    • #6758
      ささやん
      ゲスト

      ×.page-item
      ○.page_item

      それが原因でしょうか…。

      一応、アーカイブやカテゴリーには設定できたので、このまま様子を見ようと思います。
      お時間をとっていただいてありがとうございました!

    • #6762
      ささやん
      ゲスト

      アンダーバーに変えて追記したら、固定ページも全リストがボタン表示されました。
      サイドバー限定ですが…
      結果的には、これでOKです。

      page_item:before {
      content: ” \f0da”;
      font-family: FontAwesome;
      margin-right:3px;
      }

    • #6774
      ささやん
      ゲスト

      上記でOKと思ったのですが、、固定ページをクリックしてページが表示されると、上部のメニューの部分にまでボタンが表示されてしまい、メニューが崩れた形になってしまいました。

      すみません、アンダーバーで追記するのは、無理のようです…。

      私には手におえないので、やはり様子見いたします…。

    • #7035
      アバター画像わいひら
      キーマスター

      それが原因でしょうか…。

      一文字でも違うとCSSセレクタは意味を成しません。

      上記でOKと思ったのですが、、固定ページをクリックしてページが表示されると、上部のメニューの部分にまでボタンが表示されてしまい、メニューが崩れた形になってしまいました。

      すみません、アンダーバーで追記するのは、無理のようです…。

      僕は、ささやんさんのサイト構造を把握しているわけではないのでどのような状態なのかはわからないですが、設定を反映させたいところにだけ適用させるためにCSSセレクタがあります。

      #pages-3 .page_item:before {
        content: ” \f0da”;
        font-family: FontAwesome;
        margin-right:3px;
      }

      CSSをカスタマイズをするのであれば、こういったところを読んでおくと役に立つと思います。
      意外と知らない!?CSSセレクタ20個のおさらい|Webpark

    • #7061
      ささやん
      ゲスト

      わいひら様

      ありがとうございます。
      CSSセレクタについて何も知らなかったので参考になります。
      お時間をとっていただきありがとうございました。

12件の返信スレッドを表示中
  • トピック「サイドバーの固定ページメニューにボタンを付けたい」には新しい返信をつけることはできません。
スポンサーリンク
アドセンス(大)
アドセンス(大)