WordPressテーマTCDのカスタマイズを研究するサイト

TCDテーマKADAN:トップページ画像スライダーのキャッチフレーズに影をつける方法

2020/7/3 記事を更新しました。

Q.トップページのヒーローヘッダー設定で、画像スライダー上の文字に影をつけたいのですが、どうしたらよいでしょうか?

A.下記の方法でご対応ください。

カスタムCSSに下記のコードを記述いただくと、text-shadowを有効にすることができます。

.p-index-slider__item-desc{ color:inherit; text-shadow:15px 15px 10px red !important; }
.p-index-slider__item-title{ color:inherit; text-shadow:15px 15px 10px red !important; }

※ただし、仕様上、上記の効果を追加することでアニメーションのブラー表現(すりガラスの様なぼかし効果)が外れます。ご了承ください。

上記内容が反映されない場合は以下の記述を加えてください。

@keyframes sliderContentAnimation1 {
  from {
    opacity: 0;
    color: #fff;
    text-shadow: 15px 15px 10px red; }
  to {
    opacity: 1;
    color: #fff;
    text-shadow: 15px 15px 10px red; }
}

この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

0

TCD LABO ご利用上の注意

TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただけますようお願い申し上げます。

お問合せ・ご要望

TCDLaboへのお問合せやご要望は
ご連絡フォーム をご利用ください。