Bir düğme oluşturmadan Pinterest'e "sabitleme" bağlantısı

Her biri sosyal düğmelere sahip onlarca veya yüzlerce gönderi içeren bir sayfam var. Her url için tüm düğmeleri oluşturamıyorum: çok yavaş (facebook, g +, twitter, pinterest ... yüzlerce bağlantı için). Bu yüzden, anında oluşturulacak facebook paylaş düğmesi yerine, basit bir img kullanıyorum.

https://www.facebook.com/sharer.php?u=${url_of_current_post}&t=

Kullanıcı üzerine tıkladığında, facebook tarafından oluşturulan içeriğin bulunduğu bir açılır pencere açılır.

Bunu Pinterest için nasıl yapabilirim? Düğmeyi oluşturmak için yalnızca kodu buluyorum, ancak mümkünse js'den kaçınmak istiyorum. Aşağıdaki gibi bir şey var mı?

http://pinterest.com/pinthis?url=${url_of_current_post}

Lütfen js düğmesini kullanmamı sağlamaya çalışmayın, teşekkürler.

Standart Pinterest düğmesi kodu ( burada oluşturabileceğiniz ), Pinterest düğmesinin <a>bir <img>kısmını saran bir etikettir .

pinit.jsKomut dosyasını sayfanıza dahil etmezseniz , bu <a>etiket "olduğu gibi" çalışacaktır. Uygun boyutlarla yeni bir pencere açan bu etiketlere kendi tıklama işleyicinizi kaydederek veya en azından target="_blank"yeni bir pencerede tıklamaları açması için etikete ekleyerek deneyimi iyileştirebilirsiniz .

Etiket sözdizimi şöyle görünür:

<a href="http://pinterest.com/pin/create/button/?url={URI-encoded URL of the page to pin}&media={URI-encoded URL of the image to pin}&description={optional URI-encoded description}" class="pin-it-button" count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>

Paylaşım düğmelerinin JavaScript sürümlerini kullanmak sayfa yükleme sürelerinizi mahvediyorsa, eşzamansız yükleme yöntemlerini kullanarak sitenizi iyileştirebilirsiniz. Bunu Pinterest düğmesiyle yapmanın bir örneği için, gelişmiş bir HTML5 sözdizimi içeren GitHub Pinterest düğme projeme göz atın .

Sabitle düğmesi yerine basit bir köprü oluşturmak istiyorsanız,

Bunu değiştir:

http://pinterest.com/pin/create/button/?url=

Buna:

http://pinterest.com/pin/create/link/?url=

Dolayısıyla, tam bir URL şöyle görünebilir:

<a href="https://stackoverflow.com//pinterest.com/pin/create/link/?url=http%3A%2F%2Fwww.flickr.com%2Fphotos%2Fkentbrew%2F6851755809%2F&media=http%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg&description=Next%20stop%3A%20Pinterest">Pin it</a>

Ben de aynı soruyu sordum. Bu, Wordpress'te harika çalışıyor!

<a href="https://stackoverflow.com//pinterest.com/pin/create/link/?url=<?php the_permalink();?>&amp;description=<?php the_title();?>">Pin this</a>

Bu gibi durumlar için Share Link Generator'ı çok faydalı buldum , Facebook, Google+, Twitter, Pinterest, LinkedIn paylaşım düğmeleri oluşturmaya yardımcı oluyor.

WordPress için bir kod buldum:

 <script type="text/javascript">

    function insert_pinterest($content) {
        global $post;
        $posturl = urlencode(get_permalink()); //Get the post URL
        $pinspan = '<span class="pinterest-button">';
     $pinurl = '';
     $pinend = '</span>';
        $pattern = '//i';
        $replacement = $pinspan.$pinurl.'$2.$3'.$pindescription.$pinfinish.''.$pinend;
        $content = preg_replace( $pattern, $replacement, $content );
        //Fix the link problem
        $newpattern = '/<span class="pinterest-button"><\/a><\/span><\/a>/i';
     $replacement = '';
     $content = preg_replace( $newpattern, $replacement, $content );
     return $content;
    }
    add_filter( 'the_content', 'insert_pinterest' );

    </script>

Sonra PHP'nize aşağıdakileri koyarsınız:

<?php $pinterestimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
<a href="http://pinterest.com/pin/create/button/?url=<?php echo urlencode(get_permalink($post->ID)); ?>&media=<?php echo $pinterestimage[0]; ?>&description=<?php the_title(); ?>">Pin It</a>

Yani, düğmeyi yüklemeden kodun pin it düğmesine eklemesini mi istiyorsunuz? Öyleyse, bu kodu sabitlediğiniz sayfanın URL'sinin yerine yapıştırın. Düğmesiz pin it düğmesi olarak işlev görmelidir.

javascript:void((function(){var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)})());

Küçük bir jQuery komut dosyası kullanarak burada açıklandığı gibi özel bir bağlantı oluşturabilirsiniz.

$('.linkPinIt').click(function(){
    var url = $(this).attr('href');
    var media = $(this).attr('data-image');
    var desc = $(this).attr('data-desc');
    window.open("//www.pinterest.com/pin/create/button/"+
    "?url="+url+
    "&media="+media+
    "&description="+desc,"_blank","top=0,right=0,width=750,height=320");
    return false; 
});

bu linkPinIt, görüntü ve açıklamanın HTML 5 veri özniteliklerinde depolandığı sınıfa sahip tüm bağlantılar için çalışacaktır data-imagevedata-desc

<a href="https%3A%2F%2Fwww.flickr.com%2Fphotos%2Fkentbrew%2F6851755809%2F" 
   data-image="https%3A%2F%2Fc4.staticflickr.com%2F8%2F7027%2F6851755809_df5b2051c9_b.jpg" 
   data-desc="Title for Pinterest Photo" class="linkPinIt">
    Pin it!
</a> 

bu jfiddle örneğine bakın