Box」という名前が分からなかったのですが、今では一般の人にもその名前は浸透しているんでしょうかね。Boxの設置方法をご紹介します。BoxはFacebookページを開設していないと設置できません。Facebookページを持っていない場合は「Facebookページを作成する手順」を参考に新しくページを作成してください。Facebookページを開設したら、以下に進みます。developersにアクセスします。すると、以下のような項目があるので、各項目を順に設定していきます。URLあなたのFacebookページのURLを入力します(サイトやブログのURLではありません)。Boxの幅を入力します。Boxの高さを入力します。Faces「いいね」を押してくれた人のサムネイル表示の有無。表示させたい場合はチェックを入れましょう。PostsあなたのFacebookページのタイムライン表示の有無。表示させたい場合はチェックを入れましょう。Boxのカラーをプルダウンから選択します。「light」が一般的な色合いです。Box上部の帯を表示させるかどうか。不要な場合はチェックを外します。Boxの周囲の枠線を表示させるかどうか。不要な場合はチェックを外します。Code」をクリックします。Code」をクリックすると、下図のようなポップアップが表示されます。画面には「URL」「HTML5」「XFBML」「IFRAME」の4つのタブがありますが、URLはリンク用のコードが表示されるだけなので、それ以外の「HTML5」「XFBML」「IFRAME」の中からそれぞれの環境に応じたコードを選びます。この3つのコードは、大きく分けると以下の2つの用途に分けられます。XFBMLJavascriptが使える環境のサイト・ブログ用のコードです。IFRAMEJavascriptが使えない環境用のコードです。SDK」というスクリプトを使ってFacebookからのデータを取得・表示させる仕様です。これが使えない環境の人はIFRAME版を使います。一般的には記述が簡単なIFRAME版を選ぶ方が多いようです(もしくはスクリプトの実行が重いから、などの理由も...)。利用するコードを選択したら、サイトやブログの任意の場所にペーストします。無事に表示が出来れば完成です。表示されないという場合は、ソースコードやボックスの幅や高さの指定方法を確認してみましょう。2カラムレイアウト時に片方を固定・可変にする組み方2カラムのレイアウトで、サイドカラム幅は固定、メインカラムはウィンドウ幅に応じて伸縮するリキッドな感じの配置にしたい時のコーディング方法です。コーディング郵便番号から住所を自動入力してくれるフォームを作成してみた「郵便番号から住所を自動で入力できるようにしたい」。問い合わせフォームの製作時にそんな要望が挙がることもあります。角丸を簡単に実現できる「border-radius」の使い方CSS3には角丸が超簡単に実現できるborder-radiusというプロパティがあります。簡単な角丸から難しい角丸まで、その記述方法を解説します。ブラウザ間の表示の差異を注意する際のリストブラウザごとの表示の差異。若干の違いは仕方がないのですが、その許容範囲はクライアントによって様々。閲覧対象ブラウザによってはコーディングの仕方も変わってきます。ブラウザごとの表示の崩れを解消する!各主要ブラウザ用CSSハックブラウザ間で発生する表示の差異。場合によってはレイアウトが大きく崩れてしまうことも...。そんな時、問題を解消する一つの手立てとしてCSSハックという手法があります。コーディングサイト移転・引越しなどでドメインURLが変更になった時の”正しいリダイレクト”方法サイトの移転によってドメインが変更になったり、諸事情でページのURLが変更になる際には正しくリダイレクトを行う必要があります。画像ページの先頭へ某企業のウェブ担当を経て2012年に独立。現在は東京・神奈川を中心にウェブ企画/デザイン/コーディングなどウェブ製作業務に従事してます。