ファンシーボックスポップアップに表示される各画像に「Houzz追加」ボタンを追加したい。houzz が提供するコードを beforeShow 関数に配置して、各画像へのリンクを表示しましたが、ポップアップには最初の画像のボタンと Houzz.com にリダイレクトする他の単純なリンクのみが表示されます
ポップアップのすべての画像に [追加] ボタンを表示する方法はありますか
ボタンを動的に作成するたびに、各ボタンの SCRIPT タグを追加で埋め込むことで、これを実行できるはずです。これにより、A タグを Houzz ボタンに変換する JavaScript が再実行されます。
Houzz サーバーはバックエンドの CURL リクエスト (Facebook の Like ボタンと同様) を通じてメタデータを検証するため、FancyBox Houzz ボタンが指しているリンクが Houzz ボタンを独自の静的HTML ページにも埋め込んでいることを確認してください。
お役に立てれば!
Web 開発者用ドキュメント: http://www.houzz.com/buttonsAndBadges#houzzbutton
facebook、twitter、pinterest などのソーシャル サイト リンクを houzz と統合するためのコード 同様のコードを使用して、他のボタンを統合することもできます。
beforeShow: function () {
if (this.title) {
this.title += '<br />';
//----Twitter button------//
this.title += '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="' + this.href + '">Tweet</a> ';
//----pinterest (pin it)------//
this.title += '<a class="pin-it-button" href="http://pinterest.com/pin/create/button/?url='+encodeURIComponent(document.location.href)+'&media='+encodeURIComponent('http://absoluteimagepath.com/path/to/image/'+this.href)+'&description=Pin from ScottGale.com">'+'<img title="Pin It" src="http://assets.pinterest.com/images/PinExt.png" alt="" border="0" /></a>';
//----Facebook like------//
this.title += '<iframe src="//www.facebook.com/plugins/like.php?href='+this.href+'&send=false&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:23px;" allowTransparency="true"></iframe>';
//----Houzz button------//
this.title += '<iframe width="48" scrolling="no" height="20" frameborder="0" style="border: medium none;" src="http://www.houzz.com/buttonWidget/1?url='+this.href+'&img='+this.href+'&title=YourTitle&hzid=YourHouzzID&ref=http://yourdomain"></iframe>';
}
}