0

目標: tumblr の各投稿の下部に "ピン留め" ボタンを (Facebook および Twitter ボタンと一緒に) 追加したいと考えています。

主な問題: http://pinterest.com/about/goodies/で提供されているコードを単純に貼り付けて、tumblr のカスタム HTML エディターにピン留めボタンを追加しても機能しません。{block:Posts} ブロックの最後に次のコードを貼り付けました。

    <a href="http://pinterest.com/pin/create/button/" class="pin-it-button" 
    count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>
    <script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

これにより、各投稿の正しい場所に「固定」ボタンが表示されますが、クリックしても何も起こりません。tumblr によって生成される HTML は変更され、次のようになります。

    <a style="cursor:pointer" title="http://pinterest.com/pin/create/button/" class="pin-it-button" count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It"></a>
    <script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

Tumblrが生成するアンカータグにはhref属性がありません。これは問題のようです。Tumblrでこれを正しく行う方法を知っている人はいますか?

別の問題(おそらく重要): pinterest が提供するコードは、ピン留めする画像を指定していません。投稿に画像を固定するボタンが必要です。オンラインで読んだことから、 href 属性に url パラメーターと media パラメーターを含めるというアイデアが得られました。例えば：

    <a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}" class="pin-it-button" count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>

繰り返しますが、結果の pin it ボタンをクリックしても何も起こりません。そのため、これらのパラメーターが必要かどうかはわかりません。ただ、最初の問題は解決されません。

どんな助けでも大歓迎です。

乾杯 - デビッド

4

3 に答える 3

1

提案をありがとう。これが私のために働いたものです。

http://tumblring.net/how-to-add-a-pinterest-button-to-tumblr/の指示に 従いましたが、次の違いがあります。

  1. {/block:Posts} 終了タグの直前に次の HTML 埋め込みコードを使用しました。

    <a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}"
class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>

  2. HTML埋め込みとともに切り取られた次のjavascriptを含めませんでした:

    <script type="text/javascript" src="http://assets.pinterest.com/js/pinit.js"></script>
于 2012-06-11T19:16:42.630 に答える
1

URLEncodedPermalink を使用して変数をエンコードしてみてください - これは私にとってはうまくいきました:

{block:Posts}

  {block:Photo}
    <a href="http://pinterest.com/pin/create/button/?url={URLEncodedPermalink}&media={URLEncodedPhotoURL-500}" class="pin-it-button" count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
   </a>
  {/block:Photo}

{/block:Posts}
于 2012-06-01T13:34:52.610 に答える
0

コードは Posts ブロックと Post type ブロック内にもある必要があります。たとえば、写真の投稿に pinit ボタンを追加する場合は、次のようになります。

{block:Posts}

{block:Photo}
<a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}" class="pin-it-button" count-layout="horizontal">
    <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>
{/block:Photo}

{/block:Posts}
于 2012-05-31T18:06:49.573 に答える