如何使所有圖像可點擊？ （在帖子WordPress中）

Question

首次創建網站時，我會自動確保所有圖像都沒有鏈接（ image_default_link_type = none ）。 現在，我已經完成了Lightbox，所以我需要使所有帖子中的所有圖像都可點擊。

我需要翻譯視圖中所有帖子中的所有圖像：

<img src="https://example.com/wp-content/uploads/2018/04/Apple-iPhone-6-0.jpg" alt="" width="1500" height="1000" />

在

<a href="https://example.com/wp-content/uploads/2018/04/Apple-iPhone-6-0.jpg"> <img src="https://example.com/wp-content/uploads/2018/04/Apple-iPhone-6-0.jpg" alt="" width="1500" height="1000" /> </a>

我怎樣才能做到這一點？

有一個功能：

add_filter ('the_content', 'del_image_link');
function del_image_link ($ content) {
  $ content =
  preg_replace (array ('{a [^&gt;] *&gt; &lt;img}', '{/&gt; </a>}'), array ('&lt;img', '/&gt;'), $ content);
  return $ content;
}

它以相反的順序工作，也就是說，它使所有帶有鏈接的圖像絕對不發粘。 我需要達到相反的效果。

Answer 1

$(document).ready(function(){
  $("img").each(function() {
     $(this).wrap("<a href="+$(this).attr('src')+"></a>");
  });
});

您可以將此腳本添加到頁腳中，並准備好在文檔中循環瀏覽所有img元素。 在使用jQuery該循環WRAP你可以包裝img與標簽a標簽。

Answer 2

#Using the code in the functions.php with the following: # 

<?php 
if ( has_post_thumbnail() ) {
    $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large' );
    echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute( 'echo=0' ) . '">';
    the_post_thumbnail( 'thumbnail' );
    echo '</a>';
}
?>

#  OR  #
# Link all post thumbnails to the post permalink #   
<?php    
        function wpdocs_post_image_html( $html, $post_id, $post_image_id ) {
            $html = '<a href="' . get_permalink( $post_id ) . '" alt="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
            return $html;
        }
        add_filter( 'post_thumbnail_html', 'wpdocs_post_image_html', 10, 3 );
?>