VWSとは フォーラム Lightning [ 解決済 ] サイドバーWidgetリストのカスタマイズ

[ 解決済 ] サイドバーWidgetリストのカスタマイズ

このトピックには5件の返信が含まれ、2人の参加者がいます。1 週前 RICK さんが最後の更新を行いました。

6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • 投稿者
    投稿
  • #18584

    d-chirashi
    参加者

    lightning proの投稿サイドバーに、アーカイブ等のWidgetを配置しています。

    1)a:hoverの下線を消したいです。
    下記のようにcssを追加したのですが消えません。

    ul.localNavi li a:hover::after{
    content: none important!;
    }

    2)リストアイコンをつけたいです。
    下記css追加で動作しません。

    ul.localNavi a :before {
    font-family: "Font Awesome 5 Free";
      content: '\f105;
      font-weight: 900;
    color:#12aab1;
    }

    よろしくお願いします。

    #18589

    RICK
    参加者

    こういう問題は実際にどうなっているのか見てみないと具体的な回答ができないので
    差し支えなければあなたのサイトのURLをご提示していただけたら幸いです。

    もしくは、新規にサイトを作成してデモデータをインポートして同様のカスタマイズを施し
    そのサイトのURLを提示するのも手だと思います。

    #18590

    RICK
    参加者

    タグクラウドウィジットのa:hover

    上記のトピックの件と合わせて下記コードのみを
    外観 > カスタマイズ > 追加CSS
    に追加したところ、表示は下記URLのようになりました。
    スキンは「Origin」を選択し、「Lightning Header Color Manager」で少々色をいじっています。
    https://test02.rick-addison.com

    .tagcloud a:link {
    	color: #1111CC;
    	text-decoration: none;
    } 
    .tagcloud a:visited {
    	color: #006064;
    	text-decoration: none;
    }
    .tagcloud a:hover {
    	color:#12aab1;
    	text-decoration: none;
    }
    
    .widget_archive li a:hover,
    .widget_categories li a:hover,
    .widget_nav_menu .localNavi li a:hover{
    	text-decoration: none;
    }
    
    .widget_archive li a:before,
    .widget_categories li a:before,
    .widget_nav_menu .localNavi li a:before {
    	font-family: "Font Awesome 5 Free";
    	content: "\f105";
    	font-weight: 900;
    	color:#12aab1;
    }
    #18592

    RICK
    参加者

    追記:
    CSSのカスタマイズにトライする前に下記記事にあるスライドを熟読することをおすすめします。

    初心者向けオンライン勉強会 フォローアップ & 次回勉強会のお知らせ

    • この返信は1 週、 3 日前に  RICK さんが編集しました。
    #18624

    d-chirashi
    参加者

    RICK様

    お世話になっております。
    サイトで検証までしていただき、ありがとうございます。
    RICK様にご提示いただいたCSSを貼り付けたところ、
    おかげさまで本トピックの不具合は全て解消いたしました。
    タグの指定がまだ未熟なので、スライドを読んで学びたいと思います。

    「タグクラウドウィジットのa:hover」の方は未だ解決できませんでした。
    サイトURLをお伝えしますので、よろしくお願いします。

    チラシのデザインテンプレートは使いません。

    補足:トップページはelementorというプラグインで作成しましたが、
    タグクラウドウィジットのa:hoverは正常に動作しております。

    #18646

    RICK
    参加者

    あちらの問題はあちらで解決したほうが良いかもれないと思ったのであちらに投稿しておきました。
    簡単に言うと Lightning Skin Variety 特有のクラス指定があってそれが阻害していた感じでした。

6件の投稿を表示中 - 1 - 6件目 (全6件中)

このトピックに返信するにはログインが必要です。