web-dev-qa-db-ja.com

埋め込みツイートをカスタマイズする(または埋め込みツイートで写真を非表示にする方法)

私はツイートを埋め込むためにWP機能に頼っています。ツイートURLを追加すると、次のようになります。

https://Twitter.com/SamFlowers/status/724417082247528448

エディタには、次のように展開されて表示されます。

Embedded Tweet displayed in WordPress 

私はTwitterから直接埋め込みコードに触れる必要はありません。しかし、画像が表示されないようにツイートをカスタマイズしたいのですが。 Twitterのドキュメント によると、写真を隠すためには、私は追加する必要があります:

 data-cards="hidden"

wordPressによって生成された引用符への。

私の質問...

WordPressが直接埋め込みコードを表示することはないので(エディタの[ビジュアル]タブや[テキスト]タブでは使用できません)、表示されるすべてのツイートのブロック引用符に 'data-cards = "hidden"'コードを自動的に挿入する方法はありますウェブサイトのコンテンツエリアにありますか?

ありがとうございます。

1
Yazmin

これは oembed_fetch_url フィルタを使用してhide_mediaクエリパラメータを追加する1つの方法です。これは、リンクした Twitter doc ページにも記載されています。

OEmbedクエリパラメータをhide_media=trueに設定するか、結果のdata-cards="hidden"要素に<blockquote>属性を追加して、コンテンツの表示が拡大されないようにします。

これが例です:

/**
 * Hide media for all Twitter oEmbeds, using the hide_media=1 query argument
 */
add_filter( 'oembed_fetch_url', function( $provider, $url, $args )
{
    // Target publish.Twitter.com provider
    if( 'publish.Twitter.com' === parse_url( $provider, PHP_URL_Host ) )
        $provider = add_query_arg( 'hide_media', 1, $provider );

    return $provider;
}, 99, 3 );

TwitterプロバイダーのURLは、次のようになります。

https://publish.Twitter.com/oembed?maxwidth=840&maxheight=1000&url=https%3A%2F%2Ftwitter.com%2FSamFlowers%2Fstatus%2F724417082247528448

以降:

https://publish.Twitter.com/oembed?maxwidth=840&maxheight=1000&url=https%3A%2F%2Ftwitter.com%2FSamFlowers%2Fstatus%2F724417082247528448&hide_media=1 /

それから、プロバイダから返されたHTMLをフィルタするための oembed_result があります。 embed_oembed_html フィルタを使用して、投稿ごとであっても動的にdata-cards="hidden"属性を追加したり、独自のカスタムクエリパラメータを確認したりすることもできます。しかし、最初の方法はより安定していると思います。動的なHTML構造に属性を注入するのは難しいからです。

2
birgire