Wordpress で選択したコンテンツを Sina Weibo に共有する方法

選択したコンテンツを Wordpress で Sina Weibo に共有するにはどうすればよいですか?

この記事の例では、WordPress が選択したコンテンツを Sina Tencent Weibo に共有する方法について説明します。皆さんの参考に共有してください。具体的な方法は以下の通りです:

推奨: 「wordpress チュートリアル」

1. jQuery を導入します。ほとんどの WordPress ブログはすでに導入されていると思います。 jQuery を導入しました。その後、直接 2 番目のステップに進むことができます。

2. ページの下部、より正確には、jQuery ライブラリを導入した後にこの JS 部分を追加すると、次と同じことがわかります。サイト それは機能します。

選択と共有の機能は比較的高度に見えます。実際、実装は非常に単純です。一部の原則はわかりにくく、ほとんどの人にとって興味がありません。ここではスキップします。この JS テキストを選択すると、Sina Weibo への共有機能を単純にカプセル化しました。メソッド名は次のとおりです: $sinaMiniBlogShare

コード例は次のとおりです:

コードは次のとおりです:

var miniBlogShare = function() { 
//指定位置驻入节点 
$(&#39;<img id="imgSinaShare" class="img_share" title="将选中内容分享到新浪微博" src="1328255868614.gif" /><img id="imgQqShare" class="img_share" title="将选中内容分享到腾讯微博" src="/1328255868314.png" />&#39;).appendTo(&#39;body&#39;); 
//默认样式 
$(&#39;.img_share&#39;).css({ 
display : &#39;none&#39;, 
position : &#39;absolute&#39;, 
cursor : &#39;pointer&#39; 
}); 
//选中文字 
var funGetSelectTxt = function() { 
var txt = &#39;&#39;; 
if(document.selection) { 
txt = document.selection.createRange().text; 
} else { 
txt = document.getSelection(); 
} 
return txt.toString(); 
}; 
//选中文字后显示微博图标 
$(&#39;html,body&#39;).mouseup(function(e) { 
if (e.target.id == &#39;imgSinaShare&#39; || e.target.id == &#39;imgQqShare&#39;) { 
return 
} 
e = e || window.event; 
var txt = funGetSelectTxt(), 
sh = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0, 
left = (e.clientX - 40 < 0) ? e.clientX + 20 : e.clientX - 40, 
top = (e.clientY - 40 < 0) ? e.clientY + sh + 20 : e.clientY + sh - 40; 
if (txt) { 
$(&#39;#imgSinaShare&#39;).css({ 
display : &#39;inline&#39;, 
left : left, 
top : top 
}); 
$(&#39;#imgQqShare&#39;).css({ 
display : &#39;inline&#39;, 
left : left + 30, 
top : top 
}); 
} else { 
$(&#39;#imgSinaShare&#39;).css(&#39;display&#39;, &#39;none&#39;); 
$(&#39;#imgQqShare&#39;).css(&#39;display&#39;, &#39;none&#39;); 
} 
}); 
//点击新浪微博 
$(&#39;#imgSinaShare&#39;).click(function() { 
var txt = funGetSelectTxt(), title = $(&#39;title&#39;).html(); 
if (txt) { 
window.open(&#39;http://v.t.sina.com.cn/share/share.php?title=&#39; + txt + &#39; —— 转载自：&#39; + title + &#39;&url=&#39; + window.location.href); 
} 
}); 
//点击腾讯微博 
$(&#39;#imgQqShare&#39;).click(function() { 
var txt = funGetSelectTxt(), title = $(&#39;title&#39;).html(); 
if (txt) { 
window.open(&#39;http://v.t.qq.com/share/share.php?title=&#39; + encodeURIComponent(txt + &#39; —— 转载自：&#39; + title) + &#39;&url=&#39; + window.location.href); 
} 
}); 
}();

$ が表示されます。sinaMiniBlogShare メソッドには、eleShare と eleContainer という 2 つのパラメータがあります。前者のパラメータは必須であり、テキストが選択された後に表示されるフローティング レイヤー要素を参照します (この記事のデモでは、 Sina eye icon)。後者のパラメータはテキスト選択のコンテナを参照します。要素、オプションのパラメータが設定されていない場合は、ドキュメント要素を参照します。つまり、ページテキスト全体の選択により共有機能がトリガーされます。

Sina Weibo 共有アイコンの HTML が次のとおりであるとします。

コードは次のとおりです :

<img id="imgSinaShare" class="img_sina_share" title="将选中内容分享到新浪微博" src="http://simg.sinajs.cn/blog7style/images/common/share.gif" />

次に、次のコードを直接使用します:

コードは次のとおりです。

$sinaMiniBlogShare(document.getElementById("imgSinaShare"));

この記事が WordPress ウェブサイトを構築するすべての人に役立つことを願っています。

以上がWordpress で選択したコンテンツを Sina Weibo に共有する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。