「TCD AWARD 2023」受賞サイトを発表しました。

ワードプレステーマ別

TCDテーマICONIC:売り切れバッジの文言と色を変更する方法

Q.商品の「Sold Out」のテキストや色の変更は可能でしょうか。

▼変更箇所イメージ
変更箇所イメージ

A.下記の方法でカスタマイズしてください。

・商品一覧ページ

編集するファイル: wc_templates/wc_item_single.php
編集する箇所: 24行目

echo '<span class="p-article__soldout">'. __( 'Sold Out', 'tcd-w' ) . '</span>';

 ↓

echo '<span class="p-article__soldout">'. __( '任意の文言', 'tcd-w' ) . '</span>';

 

・商品詳細ページ

編集するファイル: widget/styled_post_list_tab.php
編集する箇所: 209行目

echo '<div class="p-article__thumbnail-soldout"><span class="p-article__soldout">'. __( 'Sold Out', 'tcd-w' ) . '</span></div>';

 ↓

echo '<div class="p-article__thumbnail-soldout"><span class="p-article__soldout">'. __( '任意の文言', 'tcd-w' ) . '</span></div>';

 

・ウィジェット「デザインされた記事一覧(tcdバージョン)」

編集するファイル: widget/styled_post_list_tab.php
編集する箇所: 209行目

echo '<div class="p-article__thumbnail-soldout"><span class="p-article__soldout">'. __( 'Sold Out', 'tcd-w' ) . '</span></div>';

 ↓

echo '<div class="p-article__thumbnail-soldout"><span class="p-article__soldout">'. __( '任意の文言', 'tcd-w' ) . '</span></div>';

 

・色を変更する

TCDテーマ>基本設定のカスタムCSSに入力

.p-article__soldout { background: ★; color: ☆; }

★には任意の背景色を、☆には任意の文字色を入力ください。

この記事は役に立ちましたか?

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

同じテーマのカスタマイズ記事