TCDテーマBIJOUX：ヘッダーボタンのリンクを無効にする方法

Q.ヘッダーボタンに電話番号を表示していますが、リンクをなくしたいです。

スマホ時にはヘッダーボタンは表示されません。つまりPC時のみ表示されるのですが、「電話番号を表示しつつ、リンクをなくしたい」ということですね。

▼変更箇所イメージ

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

TCDテーマ＞基本設定のカスタムCSSに入力してください。

#header_button a:nth-of-type(3) { pointer-events: none; }

(3)の箇所で何個目のアイテムか指定しています。適宜変更してください。
 

応用編

他のヘッダーボタンと少し表示を変えてみましょう。以下のCSS例では、文字の太さと大きさ・文字とアイコンの色を変更しています。

#header_button a:nth-of-type(3) {
    pointer-events: none;
    font-size: 20px;
    font-weight: 700;
    color: #004030;
}
#header_button a:nth-of-type(3) svg path {
    fill: #004030;
}

▼応用編の適用イメージ