翰文名人 专家一览 点评达人 翰文之星 原文库 译文库 全部项目 翰文网事 译者培养招募 年度奖励计划
"输出型"翻译学习的倡导者 每个人都可以成为翻译家!

原文

  • 潘琳 推荐于 2016-05-16 22:54
  • 原文语言:日文
  • 所属分类:科学
インテリジェンスビジネスソリューションズ社が2014年5-6月に行った調査によれば、中小企業のIT製品?サービスの購買において、7割以上が購買した製品/サービスについて検討前から知っていたと回答しています。ここから購入時期が来る前から継続的にプロモーション活動を行うことが重要と考えられます。また、検討時にWeb検索を約8割が利用していると回答しています。昨今のWeb検索には、スマートフォン対応のWebサイトであることやソーシャルメディア連携、動画や良質なホワイトペーパーといったコンテンツが影響を及ぼしています。とは言え、これらを作成するスキルを持つ社員がどこの会社にいるというわけでもありませんから中々厳しいですよね。それでも、PowerPointやExcelなら...という方が多いのもまた事実。
そこで、PCの中に眠っているWordやPowerPointで作った資料を活かすことができるWebサイトの構築方法を2回に分けてご紹介していきます。世界で最も使われているCMSの「WordPress」にプラグインとテーマを追加していくかたちです。前半は、PowerPointの資料をアップロードし、FacebookやTwitterにて資料をシェアする仕組みまでを実装します。この仕組みには、世界で最も使われているCMSである「WordPress」を用います。WordPressは、デジタルマーケティングプラットフォームの「SharedVue」と連携することができます。もし貴方の会社がIBM社やオラクル社、AT&T社などのパートナーであれば、「SharedVue」が用意されているはずです。(SharedVueの利用企業のパートナーログイン一覧はここをクリック)

--- 目次 ---

1. KUSANAGI for SoftLayerによるWordPress環境の準備
2. 管理画面からのFTP接続確認とプラグイン、テーマのインストール
3. テーマのカスタマイズとカテゴリ追加
4. プラグインの設定を確認
5. 投稿とWebサイトの確認
6. チャットサポートの追加
7. まとめ

1. KUSANAGI for SoftLayerによるWordPress環境の準備


Webサイトのベースには、WordPressを使用します。
ここでは、WordPressに最適化されたサーバーを用意するために、プライム?ストラテジー社が公開しているSoftLayer用の無償の仮想マシンイメージ「KUSANAGI for SoftLayer」を使用します。下記の手順書に従って、初期設定 → WordPressのプロビジョニング → WordPressのインストールを行い、WordPress環境を準備します。

KUSANAGI for SoftLayerのご利用方法 (こちらをクリック)
手順書に従って進め、WordPressの管理画面にアクセスできる状態になりましたら、管理画面にログインしましょう。

2. 管理画面からのFTP接続確認とプラグイン、テーマのインストール

WordPress管理画面では、Webサイトの構築に用いる「プラグイン」や外観を整える「テーマ」の追加、更新には、FTP接続を使用します。
FTP接続の接続確認として、実際にプラグインを追加してみましょう。

プラグインの追加例:マーケティングオートメーション連携プラグイン WP-Mauticの場合
  1. WordPress管理画面にアクセス → ログイン
  2. 画面左側のメニュー → [プラグイン] → [新規追加]の順にクリック。
  3. 画面右上の検索フィールドに「Mautic」と入れ、検索を実行 → 「WP-Mautic」が表示される
  4. [今すぐインストール]ボタンをクリック。
  5. FTP接続情報の入力を求められます。KUSANAGI for SoftLayerのFAQに従い、ホスト名、FTPユーザー名、FTPパスワード名を入力。KUSANAGI for SoftLayerのFAQはこちらをクリック
  6. [開始]ボタンをクリックし、その後、[プラグインを有効化]をクリック。
  7. プラグイン画面に、有効化された状態で表示されれば、プラグインのインストールは完了。
    有効化された状態を判別するには、プラグイン名の左側に縦に青い帯が表示され、プラグイン名の欄が薄めの青色で覆われている状態になります。

同じ手順で、下記プラグインとテーマをインストールします。
  • 使用プラグイン① : Embed Any Document
  • 使用プラグイン② : WP Social Bookmarking Light
テーマの追加については、プラグインと同じように、画面左側のメニュー → [外観] → [新規追加]の順にクリックし、「Surfarama」で検索、テーマをインストールします。インストール後は、テーマを有効化します。

3. テーマのカスタマイズとカテゴリ追加


WordPress 管理画面の画面左側より、[外観] → [カスタマイズ]の順でクリックし、適用中のテーマ「Surfarama」のカスタマイズ画面を呼び出します。
カスタマイズ画面では、画面左側の[ウィジェット] → [Home Page Widgets] をクリックします。Widgets (ウィジェット)は、画面下の「最近の記事」や「アーカイブ」といった部品です。ここでは、下図の赤枠部分の[ウィジェットの追加]をクリックし、「Recent Posts(最近の記事)」、「Archives(アーカイブ)」、「Categories(カテゴリ)」、「Tags(タグ)」の4つを配置します。配置後は、青枠の「保存して公開」ボタンをクリックします。

また、Home Page Widgets のカスタマイズ画面で、[並べ替え]をクリックしますと、最新の記事やアーカイブといった各Widgetsの順番を入れ替えることができます。並べ替え後は、設定を保存するために、[保存して公開]ボタンをクリックしましょう。クリック後、画面左上の「×」をクリックし、テーマのカスタマイズ画面を閉じます。

適用中のテーマ「Surfarama」では、投稿する記事をカテゴリ別に色分け表示することができます。そこで、幾つかのカテゴリを作成しましょう。
手順は、WordPress 管理画面の画面左側より、[投稿] → [カテゴリ]の順でクリックし、カテゴリ作成画面を呼び出します。
カテゴリ作成画面で、下記3つを設定します。とりあえず「クラウド」「ビジネス」「未分類」などの名称でカテゴリを作ります
  • 名前 → Web上に表示するカテゴリ名
  • スラッグ → URLに反映される半角英数字のカテゴリ名
  • Category Color → 「Surfarama」のテーマで、カテゴリごとの記事を識別するための色。

4. プラグインの設定を確認


 昨今のWebサイトでは、自社のWebサイトにたどり着いてもらうためには、B to Bであってもソーシャルメディア連携なくして成り立ちません。ソーシャルメディアで記事が拡散すれば、拡散先からのアクセス数を増やすことができます。WordPressでは、プラグインによるソーシャルメディア連携のためのボタンを設置することが簡単です。プラグイン使わずに、コードを書いてしまう手もありますが、保守を考えればプラグインを使った方がベターでしょう。

プラグインの「WP Social Bookmarking Light」はインストール済みとして、ご説明します。
WordPress 管理画面の画面左側より、[設定] → [WP Social Bookmarking Light]の順でクリックし、設定画面を呼出します。「一般設定」タブでは、ソーシャルメディアと連携するボタン(共有ボタン)の配置位置や表示対象を制御する他、連携したサービス(はてな, Facebook, Twitter, Google+ など)を指定することができます。「一般設定」タブの画面で、設定後、画面下部の「変更を保存」ボタンをクリックします。

Facebookの「いいね」や「シェア」を活用するには、下図のように「FB」タブから、Localeに「ja_JP」を入力、Versionには「html5」としておくと良いでしょう。設定後、画面下部の「変更を保存」ボタンをクリックします。ここまで簡単に説明していますが、「WP Social Bookmarking Light」について詳細な情報は、Webで検索すると日本語資料が豊富です。また何か問題がある場合は、Githubのissuesからプラグインの開発者に報告すると良いでしょう。

記事を投稿する前に、プラグインの「Embed Any Document」の設定も確認しておきます。WordPress 管理画面の画面左側より、[設定] → [Embed Any Document]の順でクリックし、設定画面を呼出します。「Embed Any Document」は無料版を使用していますので、Google DriveやDropbox上のファイルを呼び出すことは出来ませんが、無料版では、ファイルのアップロードと外部から公開中のファイルを呼び出すことができます。「Default Size」では、アップロードしたファイルや外部からURLを用いて呼び出したファイルを埋め込んで表示するサイズ、「Show Download Link」では、埋め込み表示中のファイルについて、Webサイトに登録した会員だけにする「For Logged-in users」、誰でもダウンロード可能にする「For all users」、ダウンロード不可にする「No Download」から選ぶことができます。設定後、「変更を保存」ボンタをクリックし、「Embed Any Document」の設定を保存します。

5. 投稿とWebサイトの確認

WordPress 管理画面の画面左側より、[投稿] → [新規追加]の順でクリックし、記事の作成画面を呼出します。タイトルを決めます。タイトル入力欄のすぐ下にある「Add Document」ボタンをクリックします。

「Add Document」ボタンは、プラグインの「Embed Any Document」によるものです。「Upload Document」をクリックし、記事に埋め込むファイルをアップロードします。「Embed Any Document」は、PDF形式やWord形式、Excel形式、PowerPoint形式、AI(イラストレーター)形式などのファイルに対応していますから、今回は、Word形式のファイルをアップロードし、埋め込みます。

ファイルをアップロードし、表示される「Insert」ボタンをクリックしますと、下図の画面が表示されます。
画面内の「Width」と「Height」、「Show Download Link」の設定値は、プラグインの設定の内容を引き継いでいます。値の変更が必要であれば、ここで変更します。また、「Viewer」は、今回は、Google Docs Viewerを使用しますが、Microsoft Office Online でも構いません。PowerPoint形式のファイルの場合は、Microsoft Office Online を選択した方が使いやすかったです。埋め込み表示するファイルの設定を保存するため、「Insert」ボタンをクリックします。

記事を作成、掲載するにあたり、カテゴリーの選択やアイキャッチ画像(いわゆるサムネイル画像)の設定も重要です。今回使用しているテーマ(Webサイトの外観)は、各カテゴリー別に記事を色分け表示しますから、注目を浴びやすい色を設定したカテゴリーを割り当てたり、アイキャッチ画像を設定すると、目を引くことに役立ちます。

ファイルの埋め込み設定やカテゴリー、アイキャッチ画像の設定、タイトル、その他文章などを追記したら、「公開」ボタンをクリックして記事を公開しましょう。WordPressの標準機能により、公開日時を指定することも可能です。

この記事では、埋め込み用にアップロードしたファイルのViewerに、Google Docs Viewerを選びましたので、下図のように表示されます。埋め込み部分を操作するとスクロールすることができますし、このWebサイトにユーザー(会員)登録している人だけが、ファイルをダウンロードすることができます。記事の下部に、はてなブックマーク用のボタンやFacebookのボタンが表示されいます。「いいね」をクリックすると、閲覧者の方がFacebookでつながりのある方に、役立つ記事であることを共有、拡散してくれます。ソーシャルメディア連携ボタンの設定は、プラグインの「WP Social Bookmarking Light」によるものです。

また、サイト全体を表示したところ、カテゴリー別に色分け表示されています。アイキャッチ画像を設定することで記事が目立っています。

このように、資料を公開する記事を用意することで、WordやExcel、PowerPointでコンテンツを作成することができますし、今までに作成したものを役立てることができます。また、Webセミナーなどの際には事前に資料を公開、事前アンケート(これもプラグインで実現可能)、後述のチャットサポートなどを行うことで、より商談に発展する可能性がある見込み顧客を獲得することに役立てることができます。

6. チャットサポートの追加


Webサイトにアクセス中のユーザー(ビジター)が他社サイトに行かないように、チャットサポートを行うWebサイトが増えました。Webサイト訪問者の視点では、課題にマッチした製品/サービスについて、すぐに回答が欲しいにもかかわらず、問合せフォームでは時間がかかることからモチベーションがダウンしがちです。チャットサポートを活用することで、競合製品/サービスを探すまえに見込み顧客を捕まえることができます。
無料のチャットサポートシステムを探しますと、ウフル社のクラウドプラットフォーム「Milkcocoa」があります。今回はこちらのMilkcocoaのブログ記事を参考に設定を行います。但し、WordPressへの設置方法については解説がありませんので、下記にてご説明します。
WinSCPなどのFTP接続ソフトを用いて、使用しているテーマのディレクトリに移動し、「header.php」と「footer.php」のパーミッションを「0664」→「0666」に変更し、WordPress管理画面で「header.php」と「footer.php」を編集?保存できる状態にします。Milkcocoa Chat Support Admin画面の操作
「header.php」では、
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />と<?php wp_head(); ?>の間に、
<link rel="stylesheet" type="text/css" href="https://cdn.mlkcca.com/chatsupport.min.css">
を追記、保存します。
「footer.php」では、<?php wp_footer(); ?>と</body>の間に、
<div data-appid="あなたのapp_id" data-color="blue" data-meson="疑問や質問があればお気軽にお声がけ下さい。" data-mesoff="ただいまオフライン中です。メールアドレスとメッセージを残して頂ければ、後日返信致します。" milkchat></div>
<script src="https://cdn.mlkcca.com/v2.0.0/milkcocoa.js"></script>
<script src="https://cdn.mlkcca.com/chatsupport.min.js"></script>
を追記、保存します。保存後は、FTP接続ソフトを用いて、使用しているテーマのディレクトリに移動し、「header.php」と「footer.php」のパーミッションを「0666」→「0664」にもどします。
追記するコードで言うところの「あなたのapp_id」とは、Milkcocoaにログイン → [アプリ名] → [〇〇〇(アプリ名)の概要] をクリックしますと表示される画面内に、
var milkcocoa = new MilkCocoa('xxxxx.mlkcca.com');と表示されますが、この「xxxxx」の部分を指しています。
ここまでの設定により、下図のようにチャットサポートが稼働します。前述のMilkcocoaのブログ記事にありますように、「Milkcocoa Chat Support Admin画面の操作」を参考にAdmin画面で待機することで、Webサイト訪問者に対して、チャットサポートを行うことができます。


チャットサポートにおける会話内容は、Milkcocoaにログイン → [アプリ名]をクリック → [データストア]の画面にて、「データストア名を入力してください」の入力欄から選択することで確認することができます。チャットは匿名になっておりますので、具体的に個人情報を獲得したい場合は、マーケティングオートメーションの仕組みと連携すると良いでしょう。(関連記事はこちら)

まとめ


KUSANAGI for SoftLayerと各プラグイン、その他クラウドサービスを使うことで、手元のPCやファイルサーバーに眠っているコンテンツを使った集客のためのWebサイトを構築できることがわかりました。とはいえ、Webサイトをどういった人達がアクセスしているか把握した上で、どのようなコンテンツを出すかが重要になります。
次回は、定番のプラグインを用いて会員限定の記事を作成する手順や、新規投稿の記事をソーシャルメディアに通知などについても紹介する予定です。

本文还没有人翻译

 

关于我们|招聘英才|本站声明|隐私权保护规则|帮助中心|翰译欣翻译

Copyright@ 2013 www.cnposts.com 京ICP备09086341号 京公网安备110107000042

本站保留所有权利未经许可不得转载 本站刊载的所有文章仅代表作者(译者)本人观点 不代表本站立场

"输出型"翻译学习的倡导者---每个人都可以成为翻译家

北京翰译欣翻译有限公司 | Email: info#cnposts.com

我要啦免费统计 技术支持:汉虎网 合作译者群:QQ199194583