[ 解決済 ] 画像へのキャプションの背景色を変えたい

VWSとは フォーラム Lightning [ 解決済 ] 画像へのキャプションの背景色を変えたい

[ 解決済 ] 画像へのキャプションの背景色を変えたい

  • このトピックには4件の返信、2人の参加者があり、最後にsuisei98により1ヶ月、 3週前に更新されました。
5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • 投稿者
    投稿
  • #101385

    suisei98
    参加者

    ■ WordPress のバージョン
    6.6.2

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Lightning ( G3 ) + Lightning G3 Pro Unit

    ■ テーマのバージョン
    15.26.4

    ■ Pro Unit のバージョン
    0.27.1

    ■ スキンの種類
    Origin III

    ■ 期待する動作
    添付画像にあります、キャプション箇所の背景色が黒のグラデーションとなっていますが、この背景色を色々と変えたい。

    ■ 自分で試した事
    「外観」→「カスタマイズ」から何か設定箇所があるかどうか見たのですが、わかりません。
    どうかよろしくお願いいたします。

    ■ 症状が発生するブラウザ
    edge、クローム

    ■ 実際の症状
    キャプションを設定するとキャプション箇所の背景色が黒のグラデーションとなる。

    Attachments:
    You must be logged in to view attached files.
    #101391

    うなこ
    モデレーター

    お世話になっております。

    添付画像を確認しました。
    こちらは画像ブロックの外側を他のブロックで囲んでいたりしますか?
    ※リストビューから使用しているブロックを確認することができます。
    リストビューは、ブロックエディターの左上あたりにある [ドキュメント外観] アイコンをクリックすることで見ることができます。

    ▼リストビューの使い方についてはこちらの記事がわかりやすいです。
    https://www.vektor-inc.co.jp/post/list-view/

    また、もし差し支えなければ該当のページのURLを教えていただくことは可能でしょうか。

    #101394

    suisei98
    参加者

    うなこ様

    お世話になっております。
    説明が足りませんで、お手数をおかけします。

    「もし差し支えなければ該当のページのURLを教えていただくことは可能でしょうか。」→まだ下書き段階です。

    最初に添付した画像は「ブロック」から「ギャラリー」を挿入し、それに画像を入れた設定です。→添付画像
    そして「画像を選択し」→「キャプション追加」を指定すると自動で画像内の下部に「黒のグラデーション」が現れて黒のグラデーション内に文字を挿入できる状態に表示されます。

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

    Attachments:
    You must be logged in to view attached files.
    #101397

    うなこ
    モデレーター

    返信ありがとうございます。
    WordPressの「ギャラリー」ブロックは、キャプションにグラデーションの背景が入るようになっていますので、(現時点では)ブロックの設定からは調整できないようでしたので、cssでカスタマイズする必要があります。

    【外観】>【追加 CSS】に以下をコピーして貼り付けてください。

    /*ギャラリーのキャプション*/
    .wp-block-gallery.has-nested-images figure.wp-block-image figcaption{
    	background:none !important;
    	color:#222 !important;
    }

    もしくは他のブロックと画像の組み合わせにするのはいかがでしょうか。
    ※ 添付画像をご確認ください

    Attachments:
    You must be logged in to view attached files.
    #101404

    suisei98
    参加者

    うなこ様

    ご返信ありがとうございます。

    cssの記述ありがとうございます。試してみます。

    また「ブロックと画像の組み合わせ」という方法は大変勉強になりました。

    いつもありがとうございます。

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