まちカレンダーに掲載したイベント全てにリンクする

まちカレンダーにイベントをただ掲載するだけでは、予約管理の集約化や、集客効果につながりません。
ホームページやブログに、イベントへのリンクを貼り付ける必要があります。

開催団体様の全てのイベントをホームページやブログの訪問者に紹介すると、毎回リンクを張り替える必要もなく、簡単に作成できます。

開催団体様の全てのイベントを表示する方法

①次にまちカレンダーにて、開催者団体一覧を表示し、該当の団体名から「この団体のイベント」ボタンをクリックします。そこで表示されるURLをコピーしてください。

開催者団体一覧　：　http://town.bookers-on.net/offices
URLの一例：http://town.bookers-on.net/services?org=1

②bloggerの場合、ブログ記事投稿のメニューに「リンク」という機能があるので、ここで単純にリンクを作ると簡単です。

③こんなリンクが作成されます。

現在開催予定のイベントはこちら

これは、こんなコードから生成されています。

<a href="http://town.bookers-on.net/services?org=1">
    現在開催予定のイベントはこちら
</a>


⑤バナーを利用する場合は、HTMLを次のように変えます。

現在開催予定のイベントはこちらをクリック


<a href="http://town.bookers-on.net/services?org=1">
    <img src="http://town.bookers-on.net/img/machi_img.png">
</a>

参考

まちカレンダーに掲載したイベントにリンクする

まちカレンダーに掲載したイベントにリンクする

まちカレンダーにイベントをただ掲載するだけでは、予約管理の集約化や、集客効果につながりません。
ホームページやブログに、イベントへのリンクを貼り付ける必要があります。

単体イベントにリンクする方法

①次にまちカレンダーにて、イベントを表示し、URLをコピーします。

②bloggerの場合、ブログ記事投稿のメニューに「リンク」という機能があるので、ここで単純にリンクを作ると簡単です。

③こんなリンクが作成されます。

予約は「まちカレンダー」からお願いします。

これは、こんなコードから生成されています。

<a href="http://town.bookers-on.net/services/81">
    予約は「まちカレンダー」からお願いします。
</a>


⑤バナーを利用する場合は、HTMLを次のように変えます。

予約は「まちカレンダー」からお願いします。


<a href="http://town.bookers-on.net/services/81">
    <img src="http://town.bookers-on.net/img/machi_img.png">
</a>

参考
まちカレンダーに掲載したイベント全てにリンクする

無料ホームページ作成ツール「Jimdo」の弱み

先日サービス・エクスチェンジ社宛にホームページ作成のご相談を受けました。
自社の商品をホームページで紹介したいが、現在は担当者がHTMLレベルで更新していて、手間がかかり管理が大変とのこと。
更新と商品管理を簡単にするため、リニューアルを行いたいとのことでした。

このようなご相談をWEB制作会社に依頼した場合、
WordPressを使ったホームページ制作のご提案をされるのではないかと思います。
企業ニュースと、商品紹介の箇所はWordPressでブログ的な記事として管理。
ホームページには、記事を組み込んだページ＋固定ページを数枚での構成でしょうか。

ふと思いついて、Jimdoでサンプルを作ってみると、あらまあ、これは簡単。
現行ページからのコピペでさくさくと作って行けます。

さて肝心の商品紹介ページですが、これはブログ機能で作成します。
カテゴリーはタグで作って、写真を貼って、これも簡単に作成できました。
さてブログページのレイアウトをどうしようか、というところで、
通常あるべき、投稿日ごとのアーカイブリストとタグごとのアーカイブリストがないことに気が付きました。

これでは、ただの商品羅列になってしまい、とてもじゃないけど使い物になりません。

でもJimdoって確か良いサポートページもってたよな？と思い、ぐぐってみると、やはり有りました。

Jimdoオフィシャルブログ　Blogのカテゴリ別表示

作成できることはわかったのですが、
いちいち手作業で、タグの種類分作業しなければなりません。
面倒だなぁ。

そして、ブログ記事のコピーができないのも気になりました。

ただ、Jimdoのブログリストちょっとおもしろくて、一番最初に表示するコンテンツのみを含んだリスト表示となるんです。
レイアウトを揃えればタイトル＋写真、　タイトル＋写真とリストにすることもできます。
他のブログでは、タイトル＋ほぼ全文出てしまうので、リストっぽくはならないのですが、
使いようによっては面白いですね。

無料WEBサイト作成ツール「jimdo」を使ってみる

このサイトでは、bloggerを使ってホームページを作成する方法をご紹介しておりますが、他にもWEBサイト作成ツールはたくさんあり、その1つにjimdoというものがあります。

このサービスはなかなか優秀なのですが、無料バージョンの場合に

• 広告が掲載されること
• 独自ドメインが使えない

この2点がbloggerに比べて大きなマイナスでした。
しかしながら、2014年4月現在、無料版でも広告が何故か掲載されません。
これであれば、更にビジュアルのよいHPを作成するツールとして、jimdoはかなり有効だと思います。

サンプルサイトを1時間位で作ってみました。
jimdoをつかったサンプルサイト

こちらの見た目は、より”WEBサイト”として洗練しています。

設定方法に癖が強く感じられるのですが、HTML等を知らなくても十分作成できます。
サポートサイトや使い方の案内が手厚く、プロフェッショナルサービスも提供されている点が評価できます。

有料版にはメール機能が付属して、広告非掲載＋独自ドメイン利用可になります。
ショッピング機能も付いているので、そのあたりの需要がある場合には、
月々1000円程度と考えると、支払う価値がありそうです。

ファビコンの設定

ファビコンとは、ブラウザの上部に表示される画像のことです。
複数のホームページを表示している場合、タブメニューが幾つか作成されて、そこに小さな正方形の画像が表示されています。これがファビコンです。

bloggerの場合初期設定状態だと、オレンジ色にBのマークが 設定されています。
これをオリジナルのものに変更することができます。

設定ページの［レイアウト］メニューから、ファビコンの編集をクリックします。

画像を選択する設定画面が表示されるので、ファビコンの画像ファイルを設定します。
これだけです。

ファビコンの画像ファイルを作成するのは、「ファビコン　作成」などと検索すると、無料で作成できるサイトが表示され、そこでできます。

スマートフォンで情報が消える？

bloggerを使うと、スマートフォンで見た時に自動調整され、最適なページが表示されるということを、
なぜbloggerを使うのか？の記事で紹介しました。

特にページで凝ったHTMLを作成すると、いくら自動調整が入るとはいえ、限界をこえてしまい、ひどいレイアウト崩れが発生することも考えられます。

また、サイドに表示したコンテンツは、リスト形式のメニュー以外表示されないようです。
サイドのメニューはスマートフォンユーザーは閲覧できないと考え、
問合せやアクセス方法など重要情報へのリンクは必ずメニューに入れましょう。

そしてホームページを作成・変更したら、必ずスマートフォンでもチェックしましょう。

ホームを作成する

ホームページらしさの演出に、ホームというメニューの存在があります。

つまりは、ホームページの顔となるもので、企業のホームページでは、必要な情報、旬な情報に簡単にアクセスできるようリンクを提供したり、企業イメージや商品についてわかってもらえるようビジュアルを工夫したコンテンツを用意したりしています。

bloggerを使った場合に限らず、ブログを使っている場合、「ホーム」というトップページを自由に設計することが困難です。

通常の場合は、最新投稿記事が表示された普通のブログらしいページが表示されるだけです。

bloggerを使った場合は、

• タブメニューとページの組み合わせで、HTMLページ
• 通常のブログ同様、最新記事が投稿されたブログらしいページ

のどちらかをホームとします。
本当は、HTMLページと、投稿記事を組み合わせたページでホーム作成したいのですが、残念ですね。

HTMLページをホームとする場合

やり方は今まで何度も作成してきたように、ページを作って、メニューに追加する作業です。
団体のイメージに相応しいような、画像や動画を入れたこだわりのページに仕上げるのもいいですね。

メニューを設定する際に、一番左（リスト形式の場合は上）に表示されるように、「ページの順序」を入れ替えてくださいね。

【参考】
【TIPS】ニュースページを作成する
【blogger機能】メニューを作成する

ブログページをホームとする場合

メニューの設定で、ブログページの名称・表示順番を変更します。

設定画面左サイドにある[レイアウト]を選択すると、次のような画面が表示されます。

ページの編集をクリックすると、設定ページが表示されます。

「表示するページ」の下に、テキストボックスが表示されています。
これがこのブログでの投稿記事を表示するページになります。
このテキストボックスに「ホーム」あるいは「トップ」というような名称を入れます。

次に、「ページの順序」で、一番上に順番を入れ替えます。
※ホームのメニューはやはり一番左側に表示されるべきなので。

設定は以上です。保存をクリックすると、完了します。

ホームページ制作を承ります

このような「ホームページ作成講座」をまちカレンダーのお客様向けに立ち上げ、情報をいろいろ記載しているのですが、設定は確かに簡単。
でもお忙しい皆さんに、１から設定してもらうにはハードルが高いかな？
と思ったりもしました。
そこで、bloggerを使ったホームページの作成をお手伝いするサービスも同時に提供していきたいと考えています。
費用や内容の詳細は、下記のページをご確認ください。
まちカレンダーのお客様向けに、費用も抑えめです。
ぜひご利用くださいね。

制作お手伝いします

【TIPS】ニュースページを作成する

ブログは簡単に記事を投稿することができるツールです。
ラベルによってカテゴリーに分けたり、投稿日ごとに検索させることはできますが、一般的に１つのサイトで複数種類のブログを展開するのは困難です。

まちカレンダーのお客様の場合、

• 団体や主催するイベントに関する事務的要素の強いアナウンスメント
• 日々の出来事やイベント報告など、楽しい内容のもの

の２種類を更新していくことが多いのではないでしょうか。
ここではアナウンスメントを「プレスリリース」あるいは「ニュース」というメニューとして、提供する方法をご紹介します。

アナウンスメント記事を投稿する

これは通常のブログ記事投稿と同じで、普通に記事を書いて公開するだけです。
ただし、記事のラベルに「NEWS」というタグをつけてください。
記事を投稿する画面の右サイドに、投稿の設定というメニューが有り、ここでラベルをクリックすると、入力欄が表示されます。
一度設定すると以後はリストから選択するだけで、設定が完了です。

メニューを作成する

作成の手順メニューのSTEP５にて、タブ形式のメニューを作成したのを覚えていらっしゃるでしょうか。
参考　【blogger機能】メニューを作成する
レイアウト画面にてすでに設定済みの「ページ」ガジェットの編集をクリックします。
設定ページが開きますので、ここから「リンクページを追加」のメニューを選択します。
ここで「ページタイトル」に、ニュースあるいはプレスリリースといったメニュー名を入力します。
「URL」には、NEWSというラベルが付いたニュースを全て表示することのできるURLを指定します。
URLは、最初に作成した「NEWS」というラベルがついた投稿から確認できます。
投稿の一番下部の、「NEWS」と書かれているところ（黄色の箇所）をクリックして表示されれるページのURLです。

以後、アナウンスメント系の記事をNEWSというタグ付きで投稿することで、立派なプレスリリースを持つことができます。
よりホームページの体裁に近づき、閲覧者様からも見やすさが増しますね。

【blogger機能】投稿記事のナビゲーション追加

一般的なブログでよくあるナビゲーションに、投稿年月から投稿を探すビューと、「子育て、幼稚園、出産」というようなキーワードから投稿を探すビューの２つがあります。
bloggerでホームページを作成することを選択しても、ブログとしての記事と、閲覧者が手馴れているビューを使わない手はありません。

年月から検索するビューの作成方法

設定画面左サイドにある[レイアウト]を選択すると、次のような画面が表示されます。

メニューとして一般的な表示位置である、右サイドから「ガジェットを追加」をクリックします。

表示されたガジェット一覧より、「ブログアーカイブ」を選択します。

好みに応じて設定を変え（プレビューで変更がすぐに確認できます）、保存をクリックすれば完了です。

カテゴリーから検索するビュー

同様にレイアウトの設定ページから、ガジェットの追加を選択します。

「ラベル」を選択すると、設定ページが表示されます。

好みで設定して、保存をクリックすると、ビューが表示されます。

【TIPS】サービスページの作り方

サービスページとは、ご自分が提供されているサービスやイベントを紹介するページです。
ユーザーとなるお客様が一番必要とするページになります。

作成例では、弊社が提供している「まちカレンダー」サービスを取り上げました。
どのようなサービスで、誰が利用するのかを説明するのですが、あまり丁寧に読んでる人はいらっしゃいませんよね。
イラストや写真が命です。
とにかくひと目でどんなサービスなのか、興味を惹かなければなりません。

複数サービスがあるときは、サービスリストを作るといいですね。


　作成例　
S：サービス

一般的に必要な情報は次のとおりです。

サービス名称	「幼児リトミック」といった提供サービスの名称です。
サービス概要	どのようなサービスなのか、具体的に簡潔に記載します。 実際の写真があると、一番わかり易いですね。
対象者	「未就学児」「女性のみ」などと、利用できる方を明確に記載します。
値段	いくらかかるのか、これがはっきりしないサービスは信頼性にかけます。材料費や教材に別途費用がかかる場合は、これも明記します。
利用方法・問合せ	予約がいるのか、直接行けばいいのか利用する方法を明確にします。 記載した情報が少ないと、問合せが発生します。電話やメールアドレスを合わせて記載しましょう。

【TIPS】お問合わせ・アクセスページの作り方

お問合わせ・アクセスページページとは、サービスがどこで提供されているか、団体所在地へのアクセス、コンタクトする方法を示した、非常に大事なページになります。

どのサイトでのある内容なので、目新しさはないと思いますが、NPOや支援グループ様のホームページでよく見かける残念な例があります。
ぜひ改善をおすすめします。

メールアドレスが見つからない
メールがフォームからのみ送信できる
メールアドレスが画像で表示されている
フォームを提供するのみで、メールアドレスが記載されていない場合がございます。
一昔前、メールフィルタの性能が悪く、WEBサイトを自動的に検索するロボットからの迷惑メールが大量に送られてきた時代の名残だと思います。
GMailといったフリーメールでも、適切なメールフィルタを利用しているので、迷惑メールが受信してすぐに「迷惑メールフォルダ」に入ることが多くなりました。

スマートフォンからの利用が増えた今、コピペでアドレスがコピーできるか、
クリックひとつでメーラーが開くようにならないと、問合せが手間に感じてしまいます。

電話番号が表示されていない
住所が表示されていない
個人で運営されていらっしゃるからでしょうか、初めて利用するには心配なほど情報掲載がないサイトを見かけます。
個人情報の公開が気になるようでしたら、必ずその旨を明記しましょう。
そして、メールアドレスを必ず掲載しましょう。
できれば、どのような人物が運営しているのか、顔写真や経歴を掲載できると、ユーザーの安心感が増します。

地図の表示がない
スマートフォンのシェアが伸びている時代です。
地図データは無料で使える状況なので、ぜひ地図の掲載をしましょう



　作成例　
S：お問合せ・アクセス

一般的に必要な情報は次のとおりです。

住所	NPO法人名や会社名といった名称です。
最寄り駅	住所からすぐに立地がイメージつかないものです。 公共交通機関の駅やバス停からの距離が具体的に示してあると、より利用しやすいですね。
電話番号	問合せを電話でされる方多いですよね。 対応できるのであれば、是非記載しましょう 対応可能な時間を明記しましょう 対応可能時間外でも電話がきます。留守番電話にできる番号が望ましいです 電話番号が公開できない場合は、その旨明記しましょう
メールアドレス	フォームがあっても、メールアドレスを明記しましょう。 画像での表示や一部の表示をわざと変えるのも止めましょう。 迷惑メールは、あくまでフィルターではじきます。
地図	地図の掲載は簡単です。関連記事からやり方を見て下さいね。

関連記事

他のサイトのかっこいいデザインを見つけよう
Googleマップの地図を貼り付ける

無料でイラスト・写真を利用する

個人のブログで使う場合は、無償で利用できる画像や写真をインターネット上で提供しているサイトがたくさんあります。
しかしながら、商用利用となると話は別。
料金の支払いが必要だったり、作者の許可が必要だったりと、非常に面倒です。

ホームページ全体のイメージを崩さないように、テイストの似たイメージを探すのはただでさえ大変なのに、ましてや無料のものを探すのは不可能に近いです。

ごく稀に存在するのですが、その画像はたくさんの団体・企業で使用されており、個性が出せなくなったりします。

予算がふんだんにあるわけではない場合、次のサイトを使っています。

イラストAC
写真AC

確かに商用でも無料で使えるのですが、会員登録が必要で、毎日のように広告メールが飛んでくるようになります。

素晴らしいイラストや写真が提供されているので、本当に助かります。

【blogger機能】テンプレートを変えよう

ブログツールにはよくある機能ですが、bloggerでも見た目のテンプレートを変更することができます。
管理者画面の左サイドにあるメニューより[テンプレート]を選択すると、いろいろなテンプレートを選択することができます。

これらのテンプレートは、おそらく英語圏で作成されたのではないかと思うのですが、いくつかのテンプレートは日本語のサイトにはうまくフィットしません。
カスタマイズをすればいいのでしょうが、大変なので、まずは適切に見えるものを選択するのがいいと思います。

時間や予算がとれた時に、あとから変更できます。
コンテンツの配置や、色、サイズ、フォントなどもカスタマイズできますよ。

【blogger機能】メニューを作成する

ホームページといえば、タイトルがあり、タブやフレーム（四角い枠）のメニューがあり、そこから複数のページが表示される、というのが一般的なイメージではないでしょうか。

bloggerをホームページとして利用するには、まずメニューを利用するのが一番です。

メニューの作成方法

設定画面左サイドにある[レイアウト]を選択すると、次のような画面が表示されます。

１．タグメニュー形式で追加する場合

上記の画面では「ページ」と書かれていますが、初めて設定するときには、Headerの下「ガジェットを追加」と書かれていますので、これをクリックします。

よりホームページらしいのはこちらだと思います。

２．リンクリスト形式で追加する場合

右側に40%くらいの表示幅で、「ガジェットを追加」とあります。これをクリックします。

このレイアウトの場合、右側にリスト形式でメニューが表示されます。

ページが沢山ある場合、サービスリストとしてなど、一部のページ・メニューをこの形式で提供するのがいいのではないでしょうか。

※１と２を併用して作成することもできます。

すると、ガジェットを選択すページが表示されますので、「ページ」を選択します。

ページを選択すると、次のような設定画面が表示されます。

【blogger機能】ページの使い方 で説明しましたが、メニューとして提供したい内容を「ページ」として作成してある場合、チェックボックスでメニューとして表示するか、非表示とするかを選択するだけで、タブメニューが完成します。

公開時に自動的に新しいページを追加する

という機能にチェックが入っていると、わざわざ設定しなくても、ページを作成する度にメニューが増えますが、表示位置が指定できないので、自分で設定するほうが適切かもしれません。

ページの順序

マウスでドラッグ・アンド・ドロップすることで、表示順を入れ替えることができます。

リンクページを追加

投稿記事や他のサイトを直接指定して、メニューにすることができます。

例えば、このホームページには「S：ニュース」というメニューがあり、このメニューでは、プレスリリースを一覧表示するのが目的です。

このメニューでは、「NEWS」とタグ付けされた投稿記事のみを表示することにしており、

http://machi-calendar.blogspot.jp/search/label/NEWS

というURLが指定してあります。

設定が終わったら「保存」をクリックし、見た目をチェックします。

変更したい場合は、同じく[レイアウト]メニューより、ページ・ガジェットの編集をクリックするとうまくいきますよ。

【blogger機能】メタタグを設定して、検索上位を目指す

「メタタグ」と言われてもイマイチ日本人にはピンときませんが、
WEBの世界では、ブラウザに直接表示されない情報ながら、
GoogleやYahooからの検索結果に大きな影響を与えるデータです。

Googleで検索をする時、ほしい情報が適切に表示されるため、
検索キーワードを工夫しますよね。
例えば、箱根の日帰り温泉を探している場合、
「箱根　日帰り温泉　オススメ」
といったキーワードを入力します。

この入力キーワードに適したサイトをGoogleの検索エンジンは秘密のやり方で探すのですが、
その時閲覧する情報の１つが「メタタグ」です。

先程の例で言うと、「利用した中からオススメの箱根の日帰り温泉を紹介しています」と書いてあるサイトであれば、このユーザーのほしい情報が出ていそうですよね？

なので、検索されるであろうキーワードを含んだ文字列を設定します。


メタタグ設定方法

１．まず、左側のメニューから[設定] - [検索設定]を表示します

２．一番上にある「メタタグ」メニューの編集をクリックし、検索向け説明を「有効」に設定します。

３．変更を保存ボタンをクリックすると、テキストボックスが表示されるので、ここで適切な文字を入力します。

ちなみにこのサイトでは、次の文字が設定してあります。

まちカレンダーが、NPO・ボランティア団体の無料ホームページ作成方法を教えます。Googleのbloggerで構築

ホームページ作成講座をはじめました

NPOや支援グループの皆様へ、WEB作成知識をシェアするべく、
ホームページ作成講座サイトをオープンいたしました。
できるだけ安く、簡単に、自分で作るか、というポイントにこだわり、
いろいろな情報を提供していきたいと思います。

ご希望があれば、対面でのレッスンもやっていきたいと考えています。
ご要望をお寄せくださいね。

【TIPS】運営団体ページの作り方

運営団体ページとは、ホームページを提供している団体がどのような者で、何をしているのかという情報をまとめて表示したものです。
表を使うと、簡単かつ美しくレイアウトできます。

　作成例　
サンプル：運営団体ページ

一般的に必要な情報は次のとおりです。

団体名	NPO法人名や会社名といった名称です。
法人格	法人格を取得していれば、記載します。
代表者	代表者の名称をフルネームで記載します。 外部から問合せをする際に、宛先としても代表者が必要です。 代表者が著名人である場合には、信用度や宣伝に関係します。 顔写真や略歴を掲載すると、信用度が高まったり、親近感が湧いたりします。 FacebookやLinkedinといったソーシャルネットワークへのリンクを貼るのもいいですね。
運営情報	活動地域やどのようなことをしているのか、概要を記入します。 簡単な「沿革」コーナーを作るのもいいですね。
サービス紹介	サービスについて記載します。 次のような情報が入ると的確です。あくまで概要なので、細かい情報を掲載したい場合はリンクとしたほうが見やすいです。 画像やバナーを入れると、華やかになります。 サービスの名称 サービスの対象者 サービスの特徴 サービス詳細へのリンク
住所	住所を記載します。 個人でやっている場合も、郵便番号が示す程度の情報は記載し、「個人宅であるため、詳しい情報は公開していません。お問い合わせください」といった中を入れたほうが、信頼性が増します。
連絡先	電話番号やメールアドレスを表示します。 別途アクセス・お問い合わせページを作成する場合は、重複して表示する必要はありませんが、リンクしておくと、ユーザーが迷わずすみますね。

関連記事

他のサイトのかっこいいデザインを見つけよう

【blogger機能】ページの使い方

bloggerにおけるページは、日記的な要素の強い「投稿記事」とは異なり、
誰もが頻繁に知りたい、必要な内容を、アクセスしやすいメニューからリンクされるものです。

例えば、

• 概要
• サービス
• 問合せ
• アクセス

といったものは、どの団体のホームページでもよく見かけ、その団体に興味を持った人がかならず必要とする内容です。

ブログでなにかを記載するときに、「投稿記事」を使いますが、これは投稿日とカテゴリーによってのみ分類され、必ず表示されるようにしたり、重要性によって自動的に並べ替えしたりすることは困難です。

誰もが必ず必要とする情報は、ページで作成します。
そしてページは、上部に設置したタブメニューからリンクしていきましょう。

ページの作成方法

ページは、メニューから簡単に作成することができます。
左サイドにあるメニューの[ページ]を選択すると、ページ一覧が出てきます。
上部に「新しいページ」というボタンがありますので、これをクリックすれば、編集画面がでてきます。
入力は投稿記事と同じです。

ここでは、記事の書き方は説明しませんが、１つ大事な設定があるのでぜひ設定をお願いします。

右サイドに[ページ設定] - [検索向け説明]というメニューが有ります。
ここには、GoogleやYahooで検索するときに検索上位に表示されるための
必要なデータになります。

詳しくは、【blogger機能】メタタグを設定して、検索上位を目指すの記事を見てください。

関連記事

【blogger機能】メタタグを設定して、検索上位を目指す

【TIPS】運営団体ページの作り方