web-dev-qa-db-ja.com

記事の中のすべての画像をdivで囲むにはどうすればいいですか？

私が投稿に画像を追加するとき、私はそれがdivにあることを望みます。これは自動的に行われたいので、HTMLエディタで行う必要はありません。これを実現するためにjsを使用したくはありません。また、投稿内の画像にカスタムクラスを自動的に追加する方法を知りたいのです。乾杯！

postscustomizationhtmlimages
1
vanjadjurdjevic

デフォルトでは、画像はすでにユニークなクラスを持っていますが、これはあなたのテーマによって異なります。 firebugを使って画像の上にカーソルを置くと、class="aligncenter size-full wp-image-1525"のようなものが見えるはずです。

クラスまたはIDを変更したり、画像の属性を変更したい場合は、get_image_tagフィルタを使用できます。例えば、

add_filter('get_image_tag_class','my_custom_class');

function my_custom_class($class){
$class='my_custom_name';
return $class;
}
2
Wyck

私はいくつかの研究をしながら、次のコードを見つけました。 WordPressの組み込みフィルタimage_send_to_editorを使用することで、投稿画像をDivに簡単にラップできます。これが一例です。

if( is_admin() ) {

    add_filter( 'image_send_to_editor', 'wp_image_wrap_init', 10, 8 );  
    function wp_image_wrap_init( $html, $id, $caption, $title, $align, $url, $size, $alt ) {
        return '<div id="wp-image-wrap-'. $id .'" class="wp-image-wrap">'. $html .'</div>';
    }

}

ありがとう http://wpalkane.com/hacks/wrap-post-image-inside-div-automatically/

3
Steve Kamn

Get_image_tag _class（）のフックチェックポイントはクラス属性を変更するだけなので、あなたは答えは近いですが十分ではありませんでした。それで、私はいろいろ試してみて、それぞれの画像をラッピングするのに正しいことはget_image_tag（）であることを知りました。

function my_image_tag($html, $id , $alt, $title){

$html = "<div class='**wrap-div**'>" . $html . "</div>";
return $html;
}

add_filter('get_image_tag','my_image_tag',10,4);

あなたは部分的に正しいと答えたので、それが最良のものです;）歓声は仲間とあなたの助けをありがとう。

1
vanjadjurdjevic

ここでの答えは2つの方法に分けることができます。

1）POST EDITOR（バックエンド）で動作する関数
2）POST OUTPUT（フロントエンド）で機能する

pSフロントエンド出力を変更する別の方法

a）

function my_image_class_filter($classes) {
    return $classes . ' another-image-class';
}
add_filter('get_image_tag_class', 'my_image_class_filter');

b）

function add_post_image_class($content) {
    return preg_replace('/<img(.*?)class="(.*?)"/', '<img $1 class="$2 YOUR_CLASS_NAME"', $content);
}
add_filter( 'the_content', 'add_post_image_class' );
0
T.Todua