Cocoon設定の「画像」タブの設定で「アイキャッチ自動設定を有効にする」にチェックが入っていませんでしょうか？

@leafytree

夜分遅くにありがとうございます。

項目を確認しましたが、チェックは入っておりませんでした。

インストールされているプラグインは少ないようですが、これらの影響は考えられにくいですか？

@leafytree

ありがとうございます。

一番最初から入っているセキュリティプラグイン以外のものを試しにすべて削除してから、キャッシュをクリアしてみましたが、変化がありませんでした。

@tekytoh さん

私はtwitterには疎いので、twitterのCard Validatorでのブログカードの確認方法というのがよくわかりません。

明日、と言っても、もう日付は今日ですが、詳しい方が回答くださるかと思います。

お役にたてず、すみません。

@leafytree

いえ、夜分遅くまでお助けくださりありがとうございましたm(_ _)m

ごめんなさい、念の為に追記なのですが、「画像」タブ最下部の「NO IMAGE設定」という部分も、しっかり自作の画像を設定しています。

こちらも一度削除→キャッシュクリアと試しましたが、挙動に変わりがありませんでした。

色々試したところ、どうもブログ内部でのブログカード（記事一覧の画像や、内部リンクを貼った場合など）は正常に機能している（本文中の一番上の画像ではなく、cocoon設定画像タブ・OGPタブで設定した画像を表示出来ている）ようなのですが、twitterのCard Validator（ https://cards-dev.twitter.com/validator ）（実際のツイートも試しましたが結果は同じでした）への出がうまく行っていないようです。

また、この際初めからやり直そうと思い、FTPから親・子テーマ共にフォルダを丸ごと削除し、zipから再インストールを試みたのですが、綺麗に元通りに復元されてしまい、表題の挙動にも変化がありませんでした。

初心者の為、もしかすると初歩的なミスかもしれず恐縮ですが、何卒よろしくお願い致します。

こんにちは。

固定ページをトップページに設定しているのでしょうか？

トップページのソースを見ると、アイキャッチが設定されているように見えます。

アイキャッチ部分の設定や、Cocoon設定のOGPのキャプチャなどをいただけないでしょうか？（添付画像の箇所など）

色々試したところ、どうもブログ内部でのブログカード（記事一覧の画像や、内部リンクを貼った場合など）は正常に機能している（本文中の一番上の画像ではなく、cocoon設定画像タブ・OGPタブで設定した画像を表示出来ている）ようなのですが、twitterのCard Validator（ https://cards-dev.twitter.com/validator ）（実際のツイートも試しましたが結果は同じでした）への出がうまく行っていないようです。

上記の意味がちょっと分からなかったのですが、Card ValidatorでPreview cardボタンは、押されましたか？（キャッシュを更新するには、ボタンを押す必要があります）

https://nelog.jp/how-to-use-twitter-card-validator

@tanakama

こんにちは。お世話になっております。

＞固定ページをトップページに設定しているのでしょうか？

はい。

＞トップページのソースを見ると、アイキャッチが設定されているように見えます。

そのようですが、たとえばトップページをCard Validatorでチェックすると、設定したアイキャッチではなく、このページの一番上に表示している画像が表示されます。

他、現在テスト用に「アイキャッチテスト」というメニューを作ってテスト記事を公開しておりますので、必要があればお手数ですがご覧いただければと思います。

OGPタブのSSを添付いたします。

@tanakama

途中で送信してしまいました、申し訳ありません。

＞Card ValidatorでPreview cardボタンは、押されましたか？

そのページは拝読しました。何度も押しています。

OGPタブの「タグの挿入」チェックを入れたり外したりして何度かPreviewし直し、状況がリアルタイムに反映されることは確認しています。

＞意味がわからないのですが、

わかりにくい文章で申し訳ございません。

cocoonでは、記事内にURLを貼った場合、それを自動的にブログカードの形で表示してくれる機能が備わっていると思います。たとえば記事内に、現在トップページに指定している固定ページ（アイキャッチ指定なし）のリンクを貼ると、OGPタブ・画像タブで設定した通りの画像がブログカードとして表示されます。しかし、twitterのほうでは表題の通り、設定した画像ではなく、ページ内の一番上にある画像が表示されるということです。

すみません。添付が漏れていました。

投稿の編集画面にある添付画像の箇所には、設定されていませんよね。

leafytreeさんのおっしゃる通り、アイキャッチの自動設定が入ってなければ、原因が何でしょうね・・・。

Cocoon設定の「画像」タブの設定で「アイキャッチ自動設定を有効にする」にチェックが入っていませんでしょうか？

僕のテスト環境からブログカードでリンクしました。

ブログカードもヘッダーロゴになっています。（ソースコードのOGPの通り）

アイキャッチを設定していなければ、ホームイメージの画像が出てくるはずなのですが、何でしょうね・・・。

@tanakama

お忙しい中、テストしてくださりありがとうございます。

添付画像をいただいた部分のSSを添付します。特に設定していないと思います。

画像タブのアイキャッチ自動設定チェックの部分を再度確認しましたが、やはりチェックは外れていました。

投稿者:: @tekytoh

現状の「そのページの一番上の画像」ではなく、「cocoon設定→OGPタグの最下部で設定したホームイメージ画像」が表示されるようにしたいのですが、どの設定を弄ればよいか、ご教授いただけませんでしょうか？

Cocoon設定・画像・NO IMAGE設定　でおきたい画像のurlを入れると良いと思います。

その際、記事内の画像がアイキャッチになるような設定を停止しておくと良いですよ

結果うまくいったかおしえてくださいね❦

@kautakku

ありがとうございます。仰る通りの設定は実は既にしてあると思うのですが、反映されないので困っている次第です…。

SNSの画像については、元々そういう仕様のようです。
その部分の画像をプログラマバブルに変更できるフックを追加しておきました。
まずは以下でアップデートしてください。
------------------------------------------------
https://github.com/yhira/cocoon
最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

FTPでのアップデート方法はこちら。
https://wp-cocoon.com/ftp-update/
------------------------------------------------

あとは、以下のコードを子テーマのfunctions.phpにコピペしてみてください。

//SNSシェア画像を動的に変更する
add_filter('get_singular_sns_share_image_url', function ($image){
  if (is_single(array(123))) {
    $image = get_no_image_url();
  }
  return $image;
}); 

条件分岐のところには、固定ページの投稿IDを入力してください。
※動作確認はしていません

@yhira

ありがとうございます。お手数をお掛けします。

では、手動でアイキャッチ画像を設定していない記事・ページについては、SNSでは自動的にその記事内一番上の画像が表示されるのが仕様ということですね。わかりました。ありがとうございます。

申し訳ありません、条件分岐のところ、というのがどこのことかわからないのですが、どこに固定ページのIDを書けばいいのかご教授願えますでしょうか？

（専門的な知識がないため、コードが読めません。申し訳ないです）

手動でページごとにアイキャッチを指定したところ、今度は別のエラーが出て来て対応出来なくなったため、一度ワードプレスごと削除して1からやり直すことにしました。

ありがとうございました。

固定ページ一覧にIDというのがあるのでメモします。（添付画像）

わいひらさんに書いていただいたコード内の

123をIDの番号に打ち替えればOKです。

  if (is_single(array(123))) {

手動でページごとにアイキャッチを指定したところ、今度は別のエラーが出て来て対応出来なくなったため、一度ワードプレスごと削除して1からやり直すことにしました。

▼ローカル環境でテストした方が良いかもしれませんね。

https://nelog.jp/local-by-flywheel-install

@tanakama

123の部分でしたか！ありがとうございます。

子テーマのphpへの追記ですが、ファイルを直接弄るのは私のレベルではまだ早いように思いますので、控えておくだけにして、今回は追記を見送らせていただくことにしました。申し訳ありません。

ローカル環境…というものもあるのですね。やはり私にはまだ少し早いようで理解が追いつかず、ブックマークしておいて、もう少し賢くなってから試みようと思います。勉強になります、ありがとうございます。

最終的に、ワードプレスの本体から入れ直してサイトを1から作り直し、すべてのページに手動でアイキャッチをつけることで自己解決しました。

ありがとうございました。

今回のケースの場合、個別に投稿IDを指定するより「アイキャッチが存在しないとき」の方がスマートかも。

//SNSシェア画像を動的に変更する
add_filter('get_singular_sns_share_image_url', function ($image){
  if (!has_post_thumbnail()) {//アイキャッチがないとき
    $image = get_no_image_url();
  }
  return $image;
});