[ 解決済 ] アラートの背景色を指定の色に変更したい

VWSとは フォーラム Lightning [ 解決済 ] アラートの背景色を指定の色に変更したい

[ 解決済 ] アラートの背景色を指定の色に変更したい

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

    神尾直志
    参加者

    ■ 利用テーマとバージョン :lightning Pro バージョン: 8.8.12

    ■ 質問内容:アラートの機能で背景色をinfo Success Warning Danger から選択できるようになっていますが、こちらをCSSで背景色を変更したい。

    高度な設定から、CSS追加
    .wp-block-vk-blocks-alert alert alert-info{background-color:red;}
    のように入力すると
    本文は、以下のように切り替わっていました。

    <div class=”wp-block-vk-blocks-alert alert alert-info .wp-block-vk-blocks-alert alert alert-info{background-color:red;}”><p>テキスト
    </p></div>

    あまりわかっていなくて、初歩的な過ちがあるのかもしれませんが、ご教示いただきますと幸いです。
    これまでもCSS書き換えチャレンジしているのですが、反映できず、方法を模索しています。

    URLの最初のアラートのところに入れましあ。


    該当URL : https://*********

    ※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます

    #49129

    komori0321
    参加者

    ieアラートの背景色でしょうか?
    でしたら下記の追記で可能です

    .ie_alert{
    background-color: #指定色 !important;
    }

    下記 参考フォーラム

    ieアラート

    #49130

    神尾直志
    参加者

    komori0321様

    どうもありがとうございます。
    いま追加CSSに加えて
    .ie_alert{ background-color: #d3d3d3 !important; }

    本文は、このようになていますが、
    <div class=”wp-block-vk-blocks-alert alert alert-info .ie_alert{ background-color: #d3d3d3 !important; }”><p>テキスト</p></div>

    表示色は変わりません。何か、根本的にわかっていないでしょうか?素人で大変もうしわけありません。

    #49131

    komori0321
    参加者

    説明不足ですみません

    上記cssは
    外観→カスタマイズ→追加css
    または、外観→テーマエディターからstyle.css(子テーマ)
    に追記する必要があります

    お試しください

    • この返信は1ヶ月、 1週前にkomori0321が編集しました。
    • この返信は1ヶ月、 1週前にkomori0321が編集しました。
    #49145

    komori0321
    参加者

    追記です

    ieアラートを使う場合
    キャッシュには注意してください
    特に”Expires ヘッダー”のような強いキャッシュを使うと
    ieとie以外の早い者勝ちになり
    先にieでアラートが表示されると、ie以外でもアラートが表示されてしまいます

    ご参考まで!

    • この返信は1ヶ月、 1週前にkomori0321が編集しました。
    #49147

    神尾直志
    参加者

    komori0321様

    その後、外観→カスタマイズ→追加css
    をやってみたのですが、変更できませんでした。

    しかし、Vectorさんの動画を見ていたら、ブロック化することで、そのブロックの背景色を変えることが出来ることがわかったので、ブロック化 背景色変更で、自分がやりたいことは実現できました。

    ということで、スタイルシートの適用はまた別の機会でぶつかったときに挑戦しようと思います。

    親切なアドバイスどうもありがとうございました。

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