Tagged: , ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • May 26, 2016 at 12:47 am #638355
    BeeCee

    Hi,

    I would like to add

    data-pin-nopin="true"

    to the featured image of single posts, so that they cannot be chosen for pinning.
    See here the Pinterest docu for that attribute »

    I’ve tried this attribute for images in the content of a post like this, and it works fine:
    <img src="https://xyz.de/wp-content/uploads/2016/03/myimage.jpg" alt="abcdefg" width="480" height="250" data-pin-nopin="true"/>

    I suppose, that I need to add it in the loop-index.php, but where exactly and how can I add this please? My PHP is not very good …

    Thank you.

    May 26, 2016 at 2:51 am #638387
    Vinay

    Hey Chris,

    You can either hide the pin icon using CSS or jQuery method to insert the data attribute

    please check below link for more info

    http://api.jquery.com/attr/
    http://stackoverflow.com/questions/26956007/jquery-add-data-attribute-while-creating-dynamic-dom-elements

    Use the jQuery code in a function below and insert it in functions.php

    function hide_pin(){
?>
<script>
jQuery(document).load(function(){	
// Add your jQuery script here

});
</script>
<?php
}
add_action('wp_footer', 'hide_pin');

    Best regards,
    Vinay

    May 26, 2016 at 1:17 pm #638682
    BeeCee

    Hi,

    thanks, but this does not solve my question – because I have no pin button.

    Using a browser’s Pin button, the user is able to choose the featured image. And this is, what I want to avoid, the featured image should be excluded for being able to be pinned – no matter what Pin option a visitor is using.

    So I just need to add this attribute to the featured image output, if you could please tell me where in the loop-index.php (I guess) I should add it. Thanks.

    May 26, 2016 at 1:29 pm #638685
    Josue

    Hey!

    Try adding this at the very end of your theme / child theme functions.php file:

    function modify_post_thumbnail_html($html, $post_id, $post_thumbnail_id, $size, $attr) {
    $id = get_post_thumbnail_id(); 
    $src = wp_get_attachment_image_src($id, $size); 
    $alt = get_the_title($id); 

    $html = '<img src="' . $src[0] . '" alt="' . $alt . '" data-pin-nopin="true" />';

    return $html;
}
add_filter('post_thumbnail_html', 'modify_post_thumbnail_html', 99, 5);

    Cheers!
    Josue

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.