Pinterest のピン留めボタンを自分のウェブサイトで利用しようとしています。ピン留めしたい画像の URL を入力するオプションしか与えられていないことを除けば、Pinterest の「ボタンを作成する」セクションの指示は簡単です。これは、特に 100 ページを超える Web サイト (製品画像を含むページ) で作業しているユーザーにとっては、非常に骨の折れる冗長な作業になる可能性があります。そこで、Javascript (できれば jQuery) を使用してこのトリックを行うことにしました。
これが私のコードです。
HTML:
<div id="pinterest"></div>
<!--Sample Image-->
<div id="pic">
<img id="sampleimage4div" src="images/wonderfulpicture.jpg" />
</div>
<!--SCRIPTS-->
<script type="text/javascript" src="http://assets.pinterest.com....
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/... etc
jQuery スクリプト
<script type="text/javascript">
$(document).ready(function(){
var currentURL = $(location).attr('href');
var description = encodeURIComponent($(this).attr('title'));
var imageURL = encodeURIComponent($('#sampleimage4div').attr('src')+currentURL);
$('#pinterest').append('<a href="http://pinterest.com/pin/create/button/?url='+currentURL+'&media='+imageURL+'&description='+description+'"class="pin-it-button"count-layout="horizontal"><img border="0" src="http://assets.pinterest.com/images/PinExt.png"title="Pin It"/></a>');
});
</script>
ページの「URL」と「説明」を変更/カスタマイズできましたが、何らかの理由で画像を取得できません。
何か案は?