Q&A
WordPress に bbpress プラグインを入れて動作確認したところ、デフォルトではトップページや固定ページと同様の meta 要素タグが topic/* ページでも出力されました。
当該サイトで og:image や twitter:image が出力されていない理由が分かりません。何か meta 出力周りをカスタマイズされていたりするでしょうか。
ところで、HTMLソースコードが改行せずに出力されているようですが、何によるものでしょうか。何かのプラグインによるものでしょうか。
質問失礼します。
特定のサブディレクトリに対して、OGPを設定したいのですが、方法がわからないためご教示お願いします。
ちなみにbbpressには、OGP の設定項目はなく、自身でPHPをカスタマイズするしかない?そうです。
ワードプレス(テーマはcocoon)を使用しているのですが、トップページと投稿ページと固定ページのOGPやTwitter Cardsに関しては、テーマの設定でできています。
しかし、プラグインbbpressで作成されたトピックページのOGPに関しては設定できていないためこちらを設定したいと考えています。
ちなみに
https://gift-box.bright-web.jp/bright/topic/〇〇〇〇となるサブディレクトリに対してOGP画像を設定したいのですが、そのようなことは可能でしょうか？
また可能な場合、どのようなコードをどの部分に追加するのかご教示いただきたいです。
よろしくお願いいたします。
わざわざ確認までしていただきありがとうございます。
bbpressに関しては、ココナラの方でカスタマイズ依頼を少し前にしたので、それが原因かもしれません。
無知で恐縮なのですが
>>HTMLソースコードが改行せずに出力されているようですが
これはまずいのでしょうか？↑
可能であれば、親テーマ cocoon-master の中にある、cocoon-master/tmp/header-ogp.php の50〜80行目あたり（og:image の出力処理が書かれている部分）のコードを提示いただけるでしょうか。
トピックページだけ og:image や twitter:image を出力しないようにするためのカスタマイズを試してみたのですが、それを出力しない方が大変だったので、上記の header-ogp.php がカスタマイズされているのかなと思ったのですが。
header-ogp.php に触れずにカスタマイズするとしたら、子テーマ側の functions.php で get_singular_sns_share_image_url フックを使って falsy な値を返すことで実現できそうでした。
> >>HTMLソースコードが改行せずに出力されているようですが
> これはまずいのでしょうか？↑
まずくはないのですが、第三者がHTMLコードを確認しようとしたときに、1行にまとめられていて確認がしづらいという程度です。
返信ありがとうございます🙇♂️🙇♂️
どの部分かわからずなので、全てコピペさせてください。
以下になります
<?php //Facebook OGPタグ
/**
* Cocoon WordPress Theme
* @author: yhira
* @link: https://wp-cocoon.com/
* @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later
*/
if ( !defined( 'ABSPATH' ) ) exit; ?>
<!-- OGP -->
<meta property="og:type" content="<?php echo (is_singular() ? 'article' : 'website'); ?>">
<?php
$description = get_meta_description_text();
if (is_singular()){//単一記事ページの場合
$title = get_the_title();
if ( is_front_page() ) {
$title = get_bloginfo('name');
}
$url = get_the_permalink();
} else {//単一記事ページページ以外の場合（アーカイブページやホームなど）
if (is_front_page()) {
$url = home_url();
$title = get_bloginfo('name');
} else {
$url = generate_canonical_url();
$title = wp_get_document_title();
}
$description = get_bloginfo('description');
if ( is_category() ) {//カテゴリ用設定
$description = get_category_meta_description();
if ($category_title = get_the_category_title(get_query_var('cat'))) {
$title = $category_title;
} else {
$title = wp_title(null, false).' | '.get_bloginfo('name');
}
$url = generate_canonical_url();
}
if ( is_tag() ) {//タグ用設定
$description = get_tag_meta_description();
if ($tag_title = get_the_tag_title(get_queried_object_id())) {
$title = $tag_title;
} else {
$title = wp_title(null, false).' | '.get_bloginfo('name');
}
$url = generate_canonical_url();
}
}
$title = apply_filters('sns_card_title', $title);
$title = apply_filters('ogp_card_title', $title);
echo '<meta property="og:description" content="'; echo esc_attr($description); echo '">';echo "\n";//ブログの説明文を表示
echo '<meta property="og:title" content="'; echo esc_attr($title); echo '">';echo "\n";//ブログのタイトルを表示
echo '<meta property="og:url" content="'; echo esc_url($url); echo '">';echo "\n";//ブログのURLを表示取る
if (is_singular()){//単一記事ページの場合
if ($ogp_image = get_singular_sns_share_image_url()) {
echo '<meta property="og:image" content="'.esc_url($ogp_image).'">';echo "\n";
}
} else {//単一記事ページページ以外の場合（アーカイブページやホームなど）
if (is_category() && !is_paged() && $eye_catch = get_the_category_eye_catch_url(get_query_var('cat'))) {
$ogp_image = $eye_catch;
} elseif (is_tag() && !is_paged() && $eye_catch = get_the_tag_eye_catch_url(get_queried_object_id())) {
$ogp_image = $eye_catch;
} elseif ( get_ogp_home_image_url() ) {
$ogp_image = get_ogp_home_image_url();
} else {
if ( get_the_site_logo_url() ){//ヘッダーロゴがある場合はロゴを使用
$ogp_image = get_the_site_logo_url();
}
}
if ( !empty($ogp_image) ) {//使えそうな$ogp_imageがある場合
echo '<meta property="og:image" content="'.esc_url($ogp_image).'">';echo "\n";
}
}
?>
<meta property="og:site_name" content="<?php echo esc_attr(get_bloginfo('name')); ?>">
<meta property="og:locale" content="<?php _e( 'ja_JP', THEME_NAME ); ?>">
<?php if ( false ): //fb:adminsの取得?>
<meta property="fb:admins" content="<?php echo esc_attr(get_fb_admins()); ?>">
<?php endif; ?>
<?php if ( get_facebook_app_id() ): //fb:app_idの取得?>
<meta property="fb:app_id" content="<?php echo esc_attr(get_facebook_app_id()); ?>">
<?php endif; ?>
<meta property="article:published_time" content="<?php echo esc_attr(get_seo_post_time()); ?>" />
<?php if ($update_time = get_seo_update_time()): ?>
<meta property="article:modified_time" content="<?php echo esc_attr($update_time); ?>" />
<?php endif ?>
<?php //カテゴリー
$cats = get_the_category();
if ($cats) {
foreach($cats as $cat) {
echo '<meta property="article:section" content="' . esc_attr($cat->name) . '">'.PHP_EOL;
}
} ?>
<?php //タグ
$tags = get_the_tags();
if ($tags) {
foreach($tags as $tag) {
echo '<meta property="article:tag" content="' . esc_attr($tag->name) . '">'.PHP_EOL;
}
} ?>
<!-- /OGP -->
お手隙にご確認よろしくお願いします。
header-ogp.php は大丈夫そうですね。ということは、og:image の出力を妨げているものが他にあるようです。
子テーマの functions,php から呼び出されるコードの中に get_singular_sns_share_image_url にフックして値を変更するようなコードはないでしょうか。
子テーマのディレクトリ内で以下のように grep して、何か表示されるでしょうか。
$ cd cocoon-child-master
$ grep -r -i 'get_singular_sns_share_image_url' .
これで何も表示されない場合、トピックページにおいて og:image が出力されていない原因が、この質問文だけでは推測できません。実際のソースコードをデバッグ調査してみないと分からないかもしれません。
返信ありがとうございます
初歩すぎる質問ですみません・・grepする方法がわからないのですが、それはワードプレス上から確認できますか？それともファイルマネージャーから確認するのでしょうか（ ; ; ）
シェルコマンドを実行することを意味しているのですが、難しくて分からなければ無視していただいて構いません。
代わりに、子テーマの中にある cocoon-child-master/functions.php にどのような記述があるか提示いただけるでしょうか。そのくらいしか外部から調査する方法が思いつきません。あとは、使用しているプラグインの一覧を教えて頂くくらいでしょうか。
なるほど、ありがとうございます🙇♂️🙇♂️
functions.phpには、一部カスタマイズを追加しているだけで他は特に何もありません。
//アイキャッチカテゴリーラベルの非表示
add_filter('is_eyecatch_category_label_visible', '__return_false');
//エントリーカードカテゴリーラベルの非表示
add_filter('is_entry_card_category_label_visible', '__return_false');
//関連記事カードカテゴリーラベルの非表示
add_filter('is_related_entry_card_category_label_visible', '__return_false');
//カルーセルカードカテゴリーラベルの非表示
add_filter('is_carousel_entry_card_category_label_visible', '__return_false');
プラグインは、以下になります。
All-in-One WP Migration
Contact Form 7
EWWW Image Optimizer
GD bbPress Attachments
hCaptcha for WordPress
Redirection
Schema & Structured Data for WP & AMP
SiteGuard WP Plugin
WP ULike
そして、上記プラグインの他にも公式には公開されていないbbpressカスタマイズ専用のプラグインが一つあります。(こちらはクラウドソーシングサービスでカスタマイズ依頼していただいたときにアップロードしたものです)
このプラグインが原因の可能性が高いですかね、、💦
回答1件
0
ベストアンサー
「質問へのコメント」でやりとりした情報を基に調査してみました。
画像の取得がうまくできていれば、どのページであっても HTML ソースコード中に <figure class="eye-catch"> なる figure 要素タグがあって、その中に画像情報が出力されるはずですが、当該サイトのトピックページでは、その中身が空になっています。
トピックページなどの単一記事ページにおいて、何らかの理由で OGP 画像が取得できなかった場合に、Cocoon 設定で設定された OGP 画像を取得し直すコードを以下に示します。
子テーマの functions. php に追記してください。
php
1add_action('get_singular_sns_share_image_url', function($url) { 2 if (!$url) $url = get_ogp_home_image_url(); 3 return $url; 4});
これを追記してもトピックページで og:image が出力されなければ、どこかのソースコードで単一記事ページの画像出力を明示的に妨害している可能性があります。
上記のコードを試してみてください。
投稿2022/12/23 16:17
総合スコア2857
あなたの回答
tips
プレビュー
