最近、いろいろ勉強中のIDEA裏方職人です。

Facebookで、いいねボタンというのが最近話題ですよね！このブログにも設置しました。

で、また新しくFacebookのソーシャルプラグインで「送信」ボタンというものが新しく発表されました。

自社ブログにも設置しましたので、紹介します。

まず、送信ボタンというものは、特定の送りたい友達だけに紹介したい場合に使われるみたいですね。

いいねボタンは相手を選ぶことができませんでしたが、これにより相手に知ってもらえるのかと思います。

グループ分けしている人達だけに！とか、facebookの友達以外の人など幅広く使えます。

URLを貼って、メールを送る作業を考えるとfacebookで一連の作業が終わってしまう優れもの！！

今回は、wordpressで設置方法を紹介します。

1　まず送信ボタン設置のためのコードを取得します。

http://developers.facebook.com/docs/reference/plugins/send/

上記ページから、設置を行います。

必要な項目

URL to Send (?)
設置するサイトのURL　決まっていなかったら、書かなくて大丈夫です。

Font (?)
フォントを指定します

Color Scheme (?)

ボタンの種類を選びます

Get Codeを押して、コードを取得

下記のようなコードがでてきます

<div id=”fb-root”></div><script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script><fb:send href=”example.com” font=”segoe ui”></fb:send>

変更部分は赤文字部分

en_US　→　jp_JP　日本語指定してあげます（英語表記になってしまうため）

example.com　→ ?php the_permalink()?　wordpresの場合このURLを付けます。

これを表示したい部分に貼りつけます。

今回は、自社では、

wp-content　→　themes　→　nightlifeの中にあるindex.php 設定しました。

これにて完了です。

またひとつ勉強になりました。

最近、googleプラスワンとは、facebookでいういう「いいね！」ボタンみたいなものです。

今回は、自社サイトのwordpressブログに追加しました。

設置方法を記載しておきます。

まず、footer.phpに　以下のコードをかきます。

階層は、wp-content　→　themes　→　nightlifeの中にあるfooter.php

<script type=”text/javascript” src=”http://apis.google.com/js/plusone.js”>
{lang: ‘ja’}
</script>

次に以下のコードを貼りつければOK

今回は、wp-content　→　themes　→　nightlifeの中にあるindex.php

<!– 次のタグを head 要素内または body 終了タグの直前に貼り付けてください –>
<script type=”text/javascript” src=”http://apis.google.com/js/plusone.js”>
{lang: ‘ja’}
</script>

<!– 次のタグを +1 ボタンを表示する箇所に貼り付けてください –>
<g:plusone></g:plusone>

以上で完了！です。

今日は、Googleで提供しているサービス

Google web Fontsについて気になったので記事にしたいと思います。サイトURL
http://www.google.com/webfonts

1.まずは、気に入った書体を選ぶ
↓
2.専用のスタイルシートファイル (CSS) を読み込みます
↓
<link href=’http://fonts.googleapis.com/css?family=Droid+Sans‘ rel=’stylesheet’ type=’text/css’>

※上のソースは、選んだFontのページに記載しています。
絶対パスで、htmlのheadに読み込ませる
↓
3.フォントを使うためのCSSセレクターの設定をします
例
h1{
font-family: ‘Droid Sans‘ ;
}
↓
完了

まだ、英語だけですが、今後このようなAPIサービスで
日本語対応とかも増えてくるのではないでしょうか。
ぜひこのサイトチェックしてみてください。

footer部分を画面下部に固定するためのjsライブラリ
コーディングをしていまして、その際に起きる原因として
情報が少ないページ　多いページなど様々だと思います。
多いページはブラウザ下部で、フッターが表示されるのですが、
少ないページとかは、フッターの部分が上にきてしまい
下に余白ができてしまう原因を解消するためcssやjavascriptなどが
あると思います。

今回は、cssではなくjavascriptで対応方法を紹介したいと思います。
こんなに簡単に設置できるとは思っていませんでした。

javascriptのファイルはこちらから(footerFixed.js)
ソースをコピーして外部読み込みしてください。

head内要素にこちらを記述してください。

フッター要素にはid:footerを付けます。

１つの参考までに、ぜひつかってみてください。
サイト:http://blog.webcreativepark.net/2007/11/16-012253.html