スマートフォンサイトを表示する

  1. TOP
  2. みんビズ運用講座 お問い合わせや集客を増やすためのコツ : 第3回 SNSの連携

エキスパートコラム

みんビズ運用講座:お問い合わせや集客を増やすためのコツ(全3回)

第3回:SNSの連携

執筆:原 一宣。(株式会社Gazi工房)

2014年3月10日更新

  • このエントリーをはてなブックマークに追加

閲覧数5,069views

このコラムをPDF形式でダウンロードする

ホームページにおいて、ソーシャルメディアを使ってビジネスに活用するためには、その代表格であるSNS(ソーシャルネットワーキングサイト)のソーシャルプラグインと言われるパーツを導入する必要があります。
今回は、みんビズのコンテンツメニューに用意されている、SNSのソーシャルプラグイン機能を利用して、簡単にSNSとの連携をする方法を解説していきます。

今回のテーマはSNSとの連携となります。SNSと連携するためには、事前に登録し、アカウントを作成する必要があります。

Twitterと連携してみよう!

みんビズでTwitterと連携するには、まず[管理メニュー]から[設定]をクリック、[Apps]から[Twitter]をクリックします。画面が切り替わるので[JimdoとTwitterをリンクさせる!]をクリックしましょう。画面が一時的に、Twitterへと移動します。

この時、ホームページと連携させたいTwitterアカウントであるかを確認しましょう。問題が無い場合は、[連携アプリを認証]をクリックします。これで、Twitterとホームページが接続された状態となりました。

[設定]から[Twitter]、[JimdoとTwitterをリンクさせる!]の順でクリック。

Twitterアカウントを複数お持ちの方(個人アカウントと企業アカウントなど)は、[JimdoとTwitterをリンクさせる!]をクリックし、Twitterへ画面遷移した時に、連携させたくないアカウントが表示された場合、画面右上のアカウント名横の「▼」部分をクリックし、一度Twitterをログアウトすると下図のようにログインフォームが表示されます。

ここで、連携したいTwitterアカウントのユーザー名、または登録メールアドレス、パスワードを入力し、[連携アプリを認証]をクリックします。

フォローボタンの設置

今回のコラムで使用する[コンテンツメニュー]のボタンは上図の4つ。
Twitterのフォローボタンを設置するには、[コンテンツメニュー]から[Twitter]をクリックします。

編集画面で、「Twitterのユーザー名」部分に[管理メニュー]で設定した「Twitterのユーザー名」を入力し、お好みのスタイルを選び[保存]をクリックし、設定が終了です。

1Twitterのユーザー名 ホームページに表示させたいTwitterのユーザー名を入力します。
2数量 ホームページに表示させる最新のツイート(つぶやき)の数を指定できます。「0」を指定した場合、ツイートは非表示となります。
3フォローボタン 表示するボタンのスタイルを「ボタン」・「表示数」の2種類から選択できます。

フォローボタン:「ボタン」の表示

フォローボタン:「表示数」の表示

Facebookと連携してみよう!

Facebookとの連携する機能として、みんビズでは「いいね!ボタン」「いいね!ボックス」「シェアボタン」の3種類の設置が可能です。(「シェアボタン」については後述いたします。

「いいね!ボタン」とは、ホームページを閲覧した人がホームページやブログに対して「いいね!」と評価または意思表示をするためのもので、「いいね!ボックス」は、Facebookページのファン数や、最新のアップデートを表示させるものです。

「いいね!ボタン」の設置

「いいね!ボタン」を設置するには、[コンテンツメニュー]から[Facebook]をクリックします。
編集画面で、「いいね!ボタン」部分にチェックを入れ、スタイルを選び、表示方法や高さを調整し、[保存]をクリックで設定が終了です。

1スタイル 「いいね!ボタン」のスタイルを「Standard」「Button」「Box」の3つから選択することができます。
2プロフィール写真 プロフィール写真を表示する場合はチェックを入れます。
3カラー 背景色に合わせたカラーを「白」「黒」から選択できます。
3高さ 表示させる部分の高さを指定できます。

スタイルが「Standard」の表示

スタイルが「Button」の表示

スタイルが「Box」の表示

スタイルが「Standard」でプロフィール写真を表示した場合

「いいね!ボックス」の設置

「いいね!ボックス」を設置するには、「いいね!ボタン」と同じように[コンテンツメニュー]から[Facebook]をクリックします。

編集画面で、「いいね!ボックス」部分にチェックを入れ、「Facebook URL」にFacebookページのURLを入力します。表示するアイテムを選び、高さを調整し、[保存]をクリックで設定が終了です。

(注記)「Facebook URL」に個人アカウントのURLを入力しても何も表示されることはありません。「いいね!ボックス」で表示されるのは「Facebookページ」のみとなるので、ご注意ください。

1Facebook URL FacebookページのURLを入力します。
2プロフィール写真 Facebookページに「いいね!」をした方々のプロフィール写真を表示する場合はチェックを入れます。
3ストリーム Facebookページのストリームを表示する場合はチェックを入れます。
3カラー 背景色に合わせたカラーを「白」「黒」から選択できます。
3高さ 表示させる部分の高さを指定できます。

Google+と連携してみよう!

Google+との連携機能は、「+1ボタン」と「シェアボタン」、「Google+バッジ」の3種類の設置が可能です。

「+1ボタン」とは、Facebookの「いいね!ボタン」とほぼ同じ使い方をする機能で、Google+上で評価または意思表示をするためのものです。「シェアボタン」はホームページの情報をGoogle+で共有、「Google+バッジ」は登録されているGoogle+のプロフィールページへリンクと、サークルへの追加ができるものです。

「+1ボタン」の設置

「+1ボタン」を設置するには、[コンテンツメニュー]から[Google+]をクリックします。
編集画面で、「+1ボタン」部分にチェックを入れ、表示させるサイズ、スタイルを選び、[保存]をクリックで設定が終了です。

1サイズ 「小」「中」「標準」「大」からサイズを選択できます。
2スタイル 「表示数」「+1情報」「無し」から選択できます。

サイズ別スタイル「無し」の表示

サイズ別スタイル「+1情報」の表示

サイズ別スタイル「表示数」の表示

「シェアボタン」の設置

「シェアボタン」を設置するには、[コンテンツメニュー]から[Google+]をクリックします。
編集画面で、「シェアボタン」部分にチェックを入れ、表示させるサイズ、スタイルを選び、[保存]をクリックで設定が終了です。

1サイズ 「小」「標準」「大」からサイズを選択できます。
2スタイル 「横」「縦」「+1情報」「無し」から選択できます。

サイズ別スタイル「横」の表示

サイズ別スタイル「縦」の表示
縦表示に関しては、用意されているものが1種類のみとなるので、サイズを指定しても変更されません。

サイズ別スタイル「+1情報」の表示

サイズ別スタイル「無し」の表示

「Google+バッジ」の設置

「Google+バッジ」を設置するには、[コンテンツメニュー]から[Google+]をクリックします。
編集画面で、「Google+バッジ」部分にチェックを入れ、「プロフィール/サイトURL」にリンクさせたいGoogle+のプロフィールページのURLを入力します。スタイルを選び、[保存]をクリックで設定が終了です。

1プロフィール/サイトURL リンクさせたいGoogle+のプロフィールページのURLを入力します。
2スタイル 「Google+ バッジ」「ロゴ」から選択できます。
2カラー 背景色に合わせたカラーを「白」「黒」から選択できます。

スタイル「Google+ バッジ」の表示

スタイル「ロゴ」の表示

シェアボタンの設置

みんビズは、Twitter、Facebook、Google+を含め、様々なSNSに対し情報を共有することができる「シェアボタン」を設置することができます。

「シェアボタン」を設置するには、[コンテンツメニュー]から[シェアボタン]をクリックします。編集画面で、連携させたいSNS名にチェックを入れ、表示サイズを選び、[保存]をクリックで設定が終了です。

1サイズ ボタンのサイズを16px、32px、64pxから選択できます。
2スタイル ボタンのスタイルを「カラー」「グレースケール」か選択できます。
3SNSの選択 表示したいSNSまたはメールのボタンにチェックを入れます。

全てのボタンを32pxのサイズで表示。上段がカラー、下段がグレースケール。

まとめ

今回解説したソーシャルプラグイン機能は、設置する場所によってリンクや意思表示されるページが変わります。サイドバー(テンプレートによってはフッター部分)に設置すると、ホームにリンクし、ホームページ全体に対しての「いいね!」などの意思表示や評価となります。これに対し、コンテンツ(本文部分)に設置をすると、設置したページに対してのものとなります。これらを理解して、SNSと連携をしてみましょう。

エキスパートコラムでは、大月 茂樹さんが「ソーシャルメディアビジネス活用講座(全12回)」を連載されています。 ソーシャルメディアをビジネスに活用するために必要なことを丁寧に解説されていますので、そちらもぜひご覧ください。

  • このエントリーをはてなブックマークに追加
このコラムをPDF形式でダウンロードする

原 一宣。(はら・かずのり)

原 一宣。(はら・かずのり)

株式会社Gazi工房 代表取締役/JimdoExpert
http://gazikobo.co.jp/

1974年、福島県福島市生まれ。東北福祉大学社会福祉学部社会福祉学科卒業。山形県川西町在住。食品加工会社、電子基板製造会社を経て、フリーランスでWeb制作活動を開始。
2007年に株式会社Gazi工房を設立。Webサイトの企画・設計、制作業務に従事。
イラストやキャラクターデザイン、地域づくりの企画・助言、パソコン教室なども行う。
元東北芸術工科大学 非常勤講師。クリエイティブユニット「gabs」メンバー。
CSS Nite in FUKUSHIMA実行委員。

著書『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、エムディエヌコーポレーション)、『ああしたい、こう変えたいが手にとるようにわかるCSS基礎』(同)。

ああしたい、こう変えたいが手にとるようにわかるCSS基礎

  • はじめてWEB 大感謝祭!~新規加入または2年目更新をし、アンケートに答えてギフト券をもらおう!~
  • Jimdoリメイク | プロがあなたのホームページを今なら45,000円(税抜)でリニューアル!
  • 問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール
  • 文具、通信、オフィスのことなら何でもお任せ!まとめてオフィス

ホームページを作るのがはじめてのかたはまずこちらをご覧ください

コラム週間アクセスランキング[期間:2017/3/12~2017/3/18]

おすすめコンテンツ

はじめてWEBおすすめ本

創業・経営のお役立ち情報

  • ソウギョウノート

    飲食・小売・サービス業の開業スケジュールから、融資申込に必要な書類までをカンタン作成

  • 経理通信

    経営者と経理ご担当者必見!中小企業・小規模事業者のための経理サポートサイト

  • まとめてオフィス

    文具、通信、オフィスのことなら何でもお任せ

  • フリーコールS

    問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール

  • auオフィスナンバー

    事務所開設するなら固定電話番号で信頼アップ
    今ならキャンペーン実施中!