wordpressの記事埋め込み機能embedを見やすくカスタマイズする方法

スポンサーリンク
Pocket
LINEで送る

wordpressのコンテンツ埋め込み機能のカスタマイズ方法の解説です。

WordPressの投稿のエディッタにURLを張り付けるとはてなブログのようにサムネイルとタイトルなどが見やすく表示されます。

ただ、変更しないままだと大きすぎてスマホからだと見辛いのでカスタマイズします。

 

必要なファイルをコピーする

最初に必要なファイルをコピーします。

wp-embed-template.min.css

embed-contant.php

2ファイルを自分が現在設定してるテーマフォルダの中にコピーします。

上記の2ファイルの場所は以下です。

public_html/wp-includes/css/wp-embed-template.min.css

public_html/wp-includes/theme-compat/embed-content.php

 

wp-embed-template.min.cssは埋め込みのデザインを調整するファイルで、embed-contant.phpは埋め込みのhtmlを編集するファイルです。

スポンサーリンク

 

 

functions.phpにcssファイルを読み込むよう記述する

functions.phpに以下のコードを追加します。

※functions.phpをwordpress管理画面から編集すると失敗した時に真っ白い画面になりログインもできなくなるので編集する場合は、エディタで編集しアップロードするかサーバーにログインしてvimで直接いじりましょう。

 

function my_embed_style() {
    wp_enqueue_style('wp-embed-template-org', get_stylesheet_directory_uri() . '/wp-embed-template.min.css');
}
add_filter('embed_head', 'my_embed_style');

 

これで埋め込みのデザインや表示するコンテンツを変更することができます。

wp-embed-template.min.cssに元々記述されているCSSは削除しても問題ありません。