投稿

4月, 2017の投稿を表示しています

facebook タイムライン埋め込みのコード

 前回、Facebookタイムラインをサイドバーに埋め込んでみましたが、Facebookサイトで生成したコードについてもう少し詳しく説明しましょう。 Facebookから取得したコードは 青 で表示しています。 <iframe IFRAMEを使います。IFRAMEはページの中に独立したフレームを作成し、フレームの中は独立したページのように扱うことができます。 src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2FLightningBrains%2F&tabs=timeline&width=250&height=300&small_header=true&adapt_container_width=true&hide_cover=false&show_facepile=false&appId" IFRAMEの中に表示するソースを指定します。ココでは、Facebookのサーバーサイドアプリを起動して、IFRAMEに表示する内容をHTTPSで要求しています。内容的にはページプラグインのページで設定した内容になっています。幅=250、高さ=300、スモールヘッダ=true、プラグインコンテナの幅に合わせる=True、カバー写真を隠す=False、友だちの顔を表示=Falseとなっています。 このサーバーサイドアプリはPHPで作られていることがわかります。 width="250" height="300" ココは、IFRAME自身の幅と高さを指定します。 やはり、ページプラグインのページで設定した内容と同様の値が設定されます。 style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true" このあたりも、IFRAME自身の属性を設定しています。 スタイルシートの指定、IFARMEのスクロールバーは

Google Blogger のサイドバーに Facebook タイムラインを表示してみよう

イメージ
Facebookとブログを相互に効果的に利用してみたいと思いません?  今回の使い方は、お知らせ的なコトは Facebook で、詳しい内容はブログで、と言うような使い分けで、ブログの方からも Facebook のタイムラインを覗けるようにしてみよう、と言う企画です。 こんな感じで、 Bloggerのサイドバーのトップに Facebook のボックスを作ってみました。 うう~、開発っぽくなってきましたね~ さて、実際に設定する方法について説明します。 まずは、Facebook の開発者ページ( developers.facebook.com )に行きましょう。 そこから、ドキュメントをクリックしてドキュメントのページを開き、「製品に関するドキュメント」にある「ソーシャルプラグイン」のリンクをクリック、さらにそのページにある「ページプラグイン」をクリックしてください。 下の方に行くと、「ページプラグイン」の設定ができます。 ココで設定するのは。ブログページに埋め込むあなたの Facebook ページのURL、タブとその大きさ(幅と高さ)を設定します。設定すると、表示イメージも変化します。今回、Bloggerのサイドバーに埋め込むときの大きさとしては幅=250、高さ=300くらいがしっくり来る感じでした。  最後に、その下にある「コードを取得」ボタンをクリックすると、ブロクに埋め込むHTMLのコードが表示されますが、IFrameの方を選択して表示されるコードを全てコピペして取っておいてください。 今度は、Bloggerの方に「ページプラグイン」を表示するところを作ります。Bloggerのダッシュボードでレイアウトを選択して、 ダッシュボードのところにあるガジェットを追加をクリックしてください。 別のウインドウが開くので、「HTML/JavaScript」のところにある「+」をクリック。 タイトルと、先程コピーしたコードをコンテンツのところにペーストして、最後に保存すると、小さいウインドウは消えて、元のレイアウトにガジェットが追加されます。レイアウトの画面で最後に「配置を保存」をクリックして完了です。  利用者はこれでブログから、Facebook のタイムラインを確認したり、Facebook に飛

Google Blogger で無料のブログを開始する方法

イメージ
小規模ビジネスをお考えの皆様! あまり設備に大きな投資はしたくないもの。そう、私もそうです! 今日は、Google の Blogger を使った無料のブログを開設してみましょう。 まずは、無料の Blogger でどんなコトができるのか?できないのか? そんな所から解説していきましょう。 Bloggerって何? Googleが提供しているブログサービスです。 実はGoogleのアカウントを持っていると、Googleの色々なサービスを利用できますが、この Blogger もその一つです。(他の Google サービスも今後説明しますね。リクエストがあれば是非!) Googleのアカウントって? あなたのスマホは Android ですか? もし、Android で動いているスマホをお持ちなら既に Google アカウントを持っているはずです。 そして、Gmailを使っているならそのメールアドレスそのものが Google アカウントです。 スマホで確認するには、「設定」をひらく → 下の方に行くと「アカウント」があるので「Google」を選ぶ → 「アカウント」が表示されます。 もし、あなたが iPhone で Gmail アカウントをお持ちでないなら、www.google.co.jp にアクセスしてアカウントを追加しましょう。 お店の名前でアカウントを作りたい! 基本、アカウントは早い者勝ちなのでまずはココからかな? 実は私のこのサービスを立ち上げるにあたり、まず取ったのがこの Google アカウントでした。  → lightning.brains@gmail.com ゲットだぜぇぇぇ プライベートなアカウントを親アカウントにして、別のアカウントとして「Lightning Brains」を追加しました。 Google のサービスを利用するには? www.google.co.jp を開いて、Google のアカウントでサインインしてください。 サインインしたブラウザで、Google の各種サービスが使えるようになります。 さっそく、ブログを作ってみよう! Google トップ(www.google.co.jp)の右上に四角いアイコンがあります。 ルービック・キューブじゃありません。 メニューのアイコンです。

Lightning Brains 始動!

船橋という街の頭脳になりたい。 プログラミング教室、講演、原稿執筆依頼など引き受けます。