web-dev-qa-db-ja.com

コンテンツ内の画像の出力を変更する

私はタグの周りにいくつかのhtml（divとクラス）をラップしたいです（image Spriteによって写真のコーナーの外観を作成するために）。

基本的に、私はここから私の関数ファイル内のいくつかのコードを経由してコンテンツにWPによって追加されたすべてのタグを書き直したいです。

<a href="#link"><img src="image.jpg" class="someclass"></a>

これに：

<div class="featured-img">
    <a rel="#lightbox" href="#link" class="#lightboxclass"><img src="image.jpg" class="someclass"></a>
    <div class="corner-nw"></div>
    <div class="corner-ne"></div>
    <div class="corner-sw"></div>
    <div class="corner-se"></div> 
</div>

の後にページが私または他の誰かがコンテンツを追加することによって追加/編集された後、私はこれをやりたいです。以下の関数で wp_get_attachment_image を使用してみたところ、最初にコンテンツを編集画面に追加するときにのみHTMLが追加されました。さらに、画像自体が編集ボックス内でドラッグされたり、削除されたりすると、htmlの残りがめちゃくちゃになります。

    function image_corners( $html, $id, $alt, $title ){
    $html = '<div class="featured-img"><img src="' . esc_attr($img_src) . '" alt="' . esc_attr($alt) . '" title="' . esc_attr($title).'" '.$hwstring.'class="'.$class.'" /><div class="corner-nw"></div><div class="corner-ne"></div><div class="corner-sw"></div><div class="corner-se"></div></div>';
    return $html;
    }
add_filter('wp_get_attachment_image','image_corners',10,4);

私がフィルタやフックで見るすべてのオプションは編集画面のadd-imageステップの間にそれを追加するだけのようです。私はこれを間違えましたか？私はページの読み込み後にHTMLを変更するためのjqueryオプションで大丈夫だと思いますが、私はそれを書く方法がよくわからない、それが必要かどうかわからない？任意の助けは大歓迎です！

post-thumbnailsimagescontent
2
RodeoRamsey

1つの方法はこれを動的に行うことです。

function do_the_replacements($matches){

  // $matches[0] = full string
  // $matches[1] = link attributes
  // $matches[2] = link contentes (the image)

  // change 'someclass' here...
  if(strpos($matches[2], 'someclass') !== false){
    return '
      <div class="featured-img">
        <a '.$matches[1].'>'.$matches[2].'</a>
        <div class="corner-nw"></div>
        <div class="corner-ne"></div>
        <div class="corner-sw"></div>
        <div class="corner-se"></div>
      </div>
    ';

  }

  // no matches, leave it as it is
  return $matches[0];
}

function my_content_filter($content){
  return
    preg_replace_callback('#\<a(.+?)\>(.+?)\<\/a\>#s', 'do_the_replacements', $content);
}

add_filter('the_content', 'my_content_filter');
3
onetrickpony