スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

wordpress サイトトップにソーシャルブックマークを設置する

wordpressで作成したサイトのトップにソーシャルブックマークを設置する方法をご紹介します。

通常、記事ごとにソーシャルブックマークを設置する場合は、プラグインのWP Social Bookmarking Lightを使用する事をおすすめします。
今回は、トップページのに表示するサイト全体に対してソーシャルボタンを設置する方法をご紹介しようと思います。

手順は
1、ソーシャルブックマークを設置するコードを取得する。
2、コードをトップページ用に編集する。
3、編集したコードを任意の場所に設置する。



1、ソーシャルブックマークを設置するコードを取得する。

今回は、私がおすすめする「忍者ツール」にてソーシャルブックマークのコードを作成します。
忍者おまとめボタンにてお好きなボタンを選択してコードを取得してください。
今回はサイドメニューの中に1行で収めたいので小さいアイコンを4つ選択しました。

201506201.jpg

取得したコードは以下の通りです。

<div class="ninja_onebutton">
<script type="text/javascript">
//<![CDATA[
(function(d){
if(typeof(window.NINJA_CO_JP_ONETAG_BUTTON_524b7f9d446aabe2b883762b30e05e3c)=='undefined'){
    document.write("<sc"+"ript type='text\/javascript' src='http:\/\/omt.shinobi.jp\/b\/524b7f9d446aabe2b883762b30e05e3c'><\/sc"+"ript>");
}else{
    window.NINJA_CO_JP_ONETAG_BUTTON_524b7f9d446aabe2b883762b30e05e3c.ONETAGButton_Load();}
})(document);
//]]>
</script><span class="ninja_onebutton_hidden" style="display:none;"><?php the_permalink(); ?></span><span style="display:none;" class="ninja_onebutton_hidden"><?php the_title(); ?></span>
</div>

注意したいのは赤字の部分です。パーマリンクとタイトルに設定しておくとうまく動作しません。トップページに設置しているのに個別記事の内容が表示されてしまいます。
この2箇所のコードを編集していきます。

2.コードをトップページ用に編集する。

2つのコードをそれぞれ以下の様に変更します。
<?php the_permalink(); ?> → http://xxxxsite.jp/ トップページのURL
<?php the_title(); ?> → サイト名

書き換えたコードがこちら

<div class="ninja_onebutton">
<script type="text/javascript">
//<![CDATA[
(function(d){
if(typeof(window.NINJA_CO_JP_ONETAG_BUTTON_524b7f9d446aabe2b883762b30e05e3c)=='undefined'){
 document.write("<sc"+"ript type='text\/javascript' src='http:\/\/omt.shinobi.jp\/b\/524b7f9d446aabe2b883762b30e05e3c'><\/sc"+"ript>");
}else{
  window.NINJA_CO_JP_ONETAG_BUTTON_524b7f9d446aabe2b883762b30e05e3c.ONETAGButton_Load();}
})(document);
//]]>
</script><span class="ninja_onebutton_hidden" style="display:none;">http://dwcc.blog.fc2.com/</span><span style="display:none;" class="ninja_onebutton_hidden">WEBクリエイターになるための学習</span>
</div>

3.編集したコードを任意の場所に設置する。

サイドメニューに設置するので、wordpressでは sidebar.php内の任意の場所に設置します。

設置が完了したら実際に表示されるか、クリックした際に設定したURLとサイト名が表示される事を確認してください。



PR ベーグルプラス -ベーグル専門ポータルサイト-

スポンサーサイト

スポンサードリンク

最新記事

最新コメント

プロフィール

かっこいいデザイン、にぎやかなデザイン、きゅ~となデザイン、シンプルで洗練されたデザイン。
想像するだけで心がモワモワしてきます♪
いいデザインにいっぱい出会いますように★

好きな言葉は、旋律と色彩

ブログランキングに参加しています。こちらにも是非♪

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。