親テーマの CSS が変わったのでしょうか。文字色が白のため見えていないだけです。文字色を赤にすれば、添付画像のように見えます。

尚、このようなボタンは <a> ではなく、<button> でお作りになるのがいいです。

sato3さん

動作していると思います。

フォーラム上部の案内にありますように、お問い合わせ時には高速化設定の無効化をお願い致します。

書き込みの前に以下の3点をご確認ください。

1. 1つのトピックにつき1つの質問を書き込んでください
2. 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください
3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

環境情報の取得方法はこちら。
→  https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→  https://wp-cocoon.com/theme-trouble/

フォーラムマナー・ルールにご協力をお願い致します。

【追記】

すみません、Akiraさんと被ってしまいました。

ご回答ありがとうございます
高速化を無効致しました
失礼致しました

連投で恐縮ですが、突然色指定が変更された理由などはわかりますでしょうか
当方では特に弄った記憶がないのですが……

立て続けに恐縮です
追加CSSにて色指定をボタンと文字に対して行ったところ、見えるようになったのですが、マウスオンの状態で消えていることが確認されてしまいました

https://radiological.site/archives/%e7%ac%ac73%e5%9b%9e%e8%a8%ba%e7%99%82%e6%94%be%e5%b0%84%e7%b7%9a%e6%8a%80%e5%b8%ab%e5%9b%bd%e5%ae%b6%e8%a9%a6%e9%a8%93-%e5%8d%88%e5%89%8d-1-2.html

上記を含めて追加CSSでホバーの動作も色指定で分からなくしてしまいましたので、疑似的に解決させて頂きました

今回のようなことが起きたのはAkira様のおっしゃるようにbuttonではなくaによって書いている弊害なのでしょうか

ご参考までにお聞かせいただけると幸いです

@sato3 さん

親テーマのバージョンが古いですね。また、2 週間前に親テーマに修正が入っています。

ボタンブロックの文字色の不具合修正

親テーマを最新バージョンにされるとどうなるでしょうか？

buttonではなくaによって書いている弊害なのでしょうか

<button> がいいと言ったのは、アクセシビリティの観点からです。ページを表示して tab キーを押し続けるとお分かりになると思います。「正答」にフォーカスが当たりません。つまり、スクリーンリーダーなどの支援技術をお使いの方は、「正答」をクリックできないかもしれません。

そのため、<button type="button"> がいいです。どうしても <a> がいい場合は、 <a role="button" tabindex="0"> とするのがいいと思います。

※ href 属性がない場合にのみ <a> に role="button" が書けます。

ご丁寧な回答ありがとうございます

今気づいたのですが、上記の環境情報に誤りがありました

----------------------------------------------
テーマ名：Cocoon
バージョン：2.6.1.2
カテゴリー数：28
タグ数：1
ユーザー数：1
----------------------------------------------
子テーマ名：Cocoon Child
バージョン：1.0.6
style.cssサイズ：3871バイト
functions.phpサイズ：679バイト
----------------------------------------------

でしたので、最新版になっているかと思います
なので、前回の不具合更新に伴い、私の環境では新たな不具合が起きたという認識でしょうか

<button> の件に関しては、次回の記事より参考させて頂きます
大変参考になりました

@sato3 さん

ボタンはどのようにしてお作りになったのでしょうか？

私のテスト環境でボタンブロックを使った場合、このような HTML になります。

<div class="wp-block-cocoon-blocks-button-1 button-block">
  <a href="" class="btn" target="_self">ボタン</a>
</div>

対して、sato3 さんのサイトのボタンの HTML は、<div> で囲まれていません。

<p>
  <a target="_self " class="btn " data-text-default="正答 " data-text-clicked="2 ">正答</a>
</p>

<div> の class の button-block の背景色は、初期値が #333 です。その <div> がないために、ボタンの背景色が #fff になっています。また、<a> の class の btn の文字色は、初期値が #fff です。#fff の背景色に #fff の文字色ではボタンが見えないですね。

sato3さんは、クラシックエディタをご利用みたいです。

クラシックエディタの「ボタン(小)」だと、以下みたいです。
（以下は、アンバーです。）

<p><a class="btn btn-amber">ボタン</a></p>

sato3さんは、以下のような感じですから。

<p>
  <a target="_self " class="btn " data-text-default="正答 " data-text-clicked="2 ">正答</a>
</p>

classには"btn"しか残していませんから、背景色はない状態です。
そして、ボタンの文字色は、テーマデフォルトでは白です。

文字色と背景色は、上記のことから見えなくなると思います。
（何もカスタマイズがなければ）

残りは、ボーダーですが、テーマデフォルトでは、sato3さんのサイトは「--cocoon-custom-border-color」が適用されて、#cccなのですが・・・。
（追加CSSがないとして考えると）

アップデート後のボタンが見えなかった時がどんな状態だったのか、ちょっと記憶にないです。

それと、アップデート前の状態を確認するためには、アップデート前のCocoonのバージョンが分かると良い気はします。
（以前の状態をこちらで確認できるので）

カスタムCSSに、ボーダーは「transparent」で書かれていますね。

もし、カスタムCSSは、以前から今の状態。
そして、追加CSSは、以前はなかったと仮定すると。
（前がどうだったのかが、良く分からないので・・・）

全部、白ないし透明で、ボタンは見えないと思います。

あとは、以前どうだったかでしょうか。
（今、手元の環境には古いテーマが入っておらず、本番で見ているので入れられないです）

ボタンに関しては、もう1つ不具合対応が。

ボタンブロックにカスタム色が反映されない不具合修正
https://github.com/xserver-inc/cocoon/commit/8e51bcf9473427bb0f24091d8c7709ef664fee03

これらのことがありますので、以前の親テーマのバージョンを教えていただきたいです。

（私は今確認できないですが、後程なら）

ローカル環境が使える状態になりましたので、いくつかのバージョンで確認を行いました。

sato3さんのサイトのボタンの以下を、クラシックエディタに貼り付けました。

<p>
  <a class="btn" target="_self" data-text-default="正答" data-text-clicked="2">正答</a>
</p>

その下には、テーマデフォルトのボタン（レッド(小)）を作りました。

①

まずは、現状のバージョン。
「Cocoon 2.6.1.2」です。

.btn {
    font-size: 20px;
    border-radius: 40px;
    border: 4px solid transparent;
}

②

続いては、2つのボタンの不具合対応が入る前のバージョン。
「Cocoon 2.6.0」です。

• 文字色が黒く、見づらい
• 薄いグレーの枠線がある

 
これらは、不具合のある状態でした。

Akira様、ｍｋ2様、ご丁寧な回答ありがとうございます

直近でCSSを弄った記憶はないのですが、前回の投稿のときに触っているかもしれません（2022/8）

https://wp-cocoon.com/community/bugs/%e3%83%a2%e3%83%90%e3%82%a4%e3%83%ab%e3%81%a7javascript%e3%81%8c%e5%8b%95%e4%bd%9c%e3%81%97%e3%81%aa%e3%81%8f%e3%81%aa%e3%81%a3%e3%81%9f/

クラシックエディターは使用していますが、今回問題になっているbtnに関してはテキストエディターで手打ちして作ったものです
他のサイトのものをアレンジして流用してありますので、色々不具合も出ているのかと……
ご迷惑をお掛けしております

また、以前の親テーマのバージョンに関して、知識不足で申し訳ないのですが、確認の方法がわかりません

追記：

ご確認ありがとうございます

このボタンを導入し始めて、私が正常に動作していると認識していたのは

③「Cocoon 2.5.5」の状態です

その後、最近になって②「Cocoon 2.6.0」の状態になり、違和感を感じ始めて、①「Cocoon 2.6.1.2」の現在の状況になりました

なので、おっしゃる通り、③「Cocoon 2.5.5」の状態を思っていたが、不具合含めたいくつかの更新で、現在の状況に落ち着いたのだと考えます

sato3さん

私の1つ前の返信をご覧ください。
https://wp-cocoon.com/community/postid/71648/

画像を途中に数枚入れる都合上、何回か再編集しております。

今、全量書いてありますので、ご確認いただければ、今回の経緯がこんな感じだったのかなということをお分かりいただけるのではないかと思います。
（推測ではありますけれど）

@mk2_mk2 

追記：

ご確認ありがとうございます

このボタンを導入し始めて、私が正常に動作していると認識していたのは

③「Cocoon 2.5.5」の状態です

その後、最近になって②「Cocoon 2.6.0」の状態になり、違和感を感じ始めて、①「Cocoon 2.6.1.2」の現在の状況になりました

なので、おっしゃる通り、③「Cocoon 2.5.5」の状態を思っていたが、不具合含めたいくつかの更新で、現在の状況に落ち着いたのだと考えます

わいひらさん

クラシックエディタの「ボタン」は、必ずクラスが「btn btn-xxxxx」のようになり、背景色のためのclassがあるかと思います。
（「スタイル」のプルダウンから入力すると、背景色のclassは必ずある）

しかし、sato3さんは、背景色のclassを削除なさっており、今回の事象になった様子です。

「Cocoon 2.5.5」を今回確認してみると、「btn」だけでも背景色がありますね。（#32373c）

ちなみにですが。

以下のようにすると・・・。

background-color: var(--cocoon-custom-background-color, #32373c);

すると、こんな感じになるみたいです。
（なかった背景色が、黒っぽくなった）

投稿者:: @mk2_mk2

↑

現状では「btn」だけにすると、以下のように「inherit」になって色がない？状態みたいです。

mk2さんが書かれたようにサブ値を設定することで対応してみました。
mk2さんありがとうございます！
ボーダー色は灰色（本来は透明）が入ってしまいますが本来.btnクラスのみで使うようなケースはあまりないためそのままとします。
というかブロックエディターのカスタム色に対応しつつ変更する方法が今のところ思いついてません。
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------