この記事のポイントは… 主に個人ブログやブログ形式のオウンドメディアを運営する皆さまを対象に、アイキャッチ画像の概要と設定方法を詳しく紹介する記事です。 アイキャッチ画像（サムネイル画像やOGP画像とも呼ばれます）とは、サイト内やSNSのタイムライン上に記事URLと共に流れる記事の顔となる画像のこと。 アイキャッチ画像を利用するために必要な知識、画像の仕様と非デザイナー向けの作成方法、アイキャッチ画像をHTMLのメタ要素OGP内で指定する方法を記事内で詳しく解説しています。 この記事は、2024年01月12日に更新しました！ ウェブ記事のアイキャッチとなるタイトルを載せた画像、ソーシャルメディア上で、良く見ませんか？まさにこの文章のすぐ上にある「徹底解説」と書かれた画像も、アイキャッチ画像のひとつです。 この記事は、主に個人ブログやブログ形式のオウンドメディアを運営する皆さまを対象に、アイ

昨日公開した当ブログのスマートフォン版デザイン。 このデザインを作成するにあたって、ちょっとカスタマイズしたのが、Facebookのソーシャルプラグイン「Like Box」です。 デフォルトだと固定幅レイアウトになるので、スマートフォンサイトでは可変幅になるようCSSで調整しました。その実装方法をご紹介します。 Page Pluginでは不要です 追記 「Like Box」が取下げられ、その代替として「Page Plugin」というソーシャルプラグインが登場しました。 こちらのプラグインは、最大幅が500pxしかありませんが、自動的にデバイスに合わせて幅が可変されるようになっており、本記事で紹介しているカスタマイズが不要になります。 「Like Box」は今後一切使えなくなりますので、速やかに新しいコードへ移行することをオススメします。 実装するとこんな感じになります! まずは縦向きで表示

昨日家に帰ったら、テレビでジュンスカの小林さんと元ボウイの高橋さんが太鼓の達人で対決してて興奮した kimoto です。 いやー高橋まことさん、楽しそうに太鼓叩いてたなー！ゲーム自体はすっげえ下手だったけど。 さて今回は、昨日のエントリーの続きで、「Recommendations Bar」の導入方法です。 このプラグインが一体どういうものかと言うと、ページ閲覧の邪魔にならないよう画面下の方を追随してきて、（ある程度）サイト管理者の任意のタイミングでエリアが開き、そこにオススメの記事が表示される、という物です。 ちなみにFacebook の発表によると、従来の Recommendations プラグインの 3 倍のクリックスルー率が出たとのことでした。 これの導入について書いてみようと思います。 ちなみに、これまでも facebook のソーシャルプラグインについて導入方法を書いています。そ

以前、「FacebookページへのIFrameタブ追加方法が変更」で紹介したとおり、FacebookページにIFrameタブ（以下ページタブ）を追加するには、次のようなURLをたたき、表示された画面でページタブを追加したいFacebookページを選択する必要があります。 https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&display=popup&next=YOUR_URL が、手動でURLを入力するのは面倒なので、その後「Facebookページ IFrameタブ追加ツール（下）」を作りました。 Facebookページ IFrameタブ追加ツール 気がついたら340いいね！ほど頂いてます。ありがとうございます。 が、これもアプリIDやページタブURLの入力をしないといけないのでやや面倒です。 ということで前置きが長くなりま

'+'%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%B0'+'%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%B0 ';if(og_image%20==%20undefined){addtext%20+='%C3%97%20og:image%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82 '}else{addtext%20+='url'+%20og_image%20+' ';if(og_image.match(/http:\/\/[^\/]*/)%20!=%20null){var%20og_image_domain%20=%20o

こんにちは@sayobsです。今までに当ブログ書いたfacebookの記事を目次別にまとめました。フェイスブックは仕様がよく変わるので古い情報はupdateして常に最新の情報をお届けできるようにします。 Facebook基本 使い方 – 最初の1歩┗Facebookを始めよう！Facebook初心者のための10ステップ+α | Last Day. jp ┗Facebook 好きなウェブサイト・ブログをShareする方法 | Last Day. jp ┗Facebookで友達を探す方法 名前やメールアドレス・出身地 | Last Day. jp ┗Facebookの写真をPC/Macから編集・変更する方法 | Last Day. jp タイムラインの設定┗Facebookのタイムライン設定方法 [図解] | Last Day. jp ┗Facbeookタイムラインが設定できない | Last

ホームページがある企業は必須！Facebookインサイト Facebookページ運用者は、いいね！ボタンやFacebookコメントボックスなど、Facebookのソーシャルプラグインを、自分のホームページやブログに導入されている方が多いですね。 ホームページ上のいいね！ボタンが、どれだけ押されて、その結果、Facebookで記事がどれだけ表示され、更にはFacebookから記事への流入がどれだけあったか。そんな重要な事がバッチリと分かるのが、Facebookのドメイン・インサイト（解析）です。 上記のように、いいね！ボタンだけでなく、ホームページやブログに配置した、Facebookのコメントボックスの反響も分かるスグレモノ。なのに、その存在すら知らない中小企業があまりにも多い！ 実は簡単！ ホームページやブログを持つ、Facebookページの企業運用者には絶対に必須である、Facebook

Facebook な内容がつづきまーす！ Facebook ページのカバー写真を綺麗に！ 前回 Facebook ページのカバー写真を作ってみました！ で、画像をアップロードすると劣化がひどいってお話を書きました。最後に「あまり神経質にならない方が良い」とか書いておきながらやっぱり気になってしまうので調べてみました。 企業のページはどうだろう？ ヴィジュアルにこだわる企業にとってカバー写真が汚いのは、ブランドイメージの落とすのでもしかしたら綺麗なカバー写真を使っているかもしれない！と思ったので調べてみました！（内心は大手だけ特別に綺麗にアップロードする方法教えてたりするんじゃないの？とか思いながら…ｗ） Facebook ページでまず思いついたのがコーラ！たまに飲みたくなりますよね〜ｗ ということでチェック！ コカ・コーラ パーク ファンページ Coca-Cola Park Fan Pag