全国観るなび ( 自治体 観光協会ご担当者様用 ) 操作マニュアル Ver.01 2014.07.10 Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 1
目次 ログイン 3 メインビジュアルとスライドショー設定 4 おすすめ観光情報 5~6 観光ニュースリスト 7~8 フリーエリア設定 9~11 入力エリアについて 12 画像のアップロード 13~15 リンクの設定方法 16~17 youtube を埋め込む 18 ソーシャル連携機能 19 Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 2
ログイン 1 ページの作成 更新 承認するために メールアドレス パスワードを入力し 全国観るなび 管理画面へログインします 管理画面ログイン 現在ご利用中のログイン ID パスワードを入力します ログイン完了ページ 認証が出来たら管理画面になります Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 3
スライドショー TOP ページで複数のメインビジュアルを使ったスライドショー設定が可能です メインビジュアル トップページに表示される観光地や景勝地の写真スライドショー 複数のメインビジュアルを自動でスライドさせる機能 画像変更 登録する場合 参照をクリック 現在使用中の PC からアップしたい画像を選択し 更新をクリック 削除 削除へチェックを入れ更新ボタンをクリック 題名 説明メインビジュアルの下部に表示されます URL 画像に対してリンクを設定できます 状態有効 HP 上に公開されます無効 HP 上に非公開になります Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 4
おすすめ観光情報 1 TOP ページへ表示されるおすすめ観光情報の優先設定 おすすめ観光情報 全国地域観光情報データベース ( データベース ) に登録されているコンテンツが 新着順で 8 件まで自動表示されます 管理画面のおすすめ観光情報で指定した記事を優先表示させることが可能です 管理画面おすすめ観光情報 優先させて表示させたい観光情報の ID を 8 件まで登録できます 観光情報 ID を調べる方法は次のページでご説明します 入力後は必ず更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 5
おすすめ観光情 2 TOP ページへ表示されるおすすめ観光情報の優先設定 データベース検索 データベースに登録されているコンテンツを検索できます 都道府県 市区町村 旅行目的 キーワードの条件を入力して検索をします 観光情報 ID を調べる 検索後 おすすめ観光情報へ登録したいページの ID をコピーし管理画面へ登録します 詳細ページの URL の最後の部分 ( スラッシュの後の英数字 ) が観光情報 ID になります Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 6
観光ニュースリスト 1 観光ニュースの登録 観光ニュースリスト 管理画面の観光ニュースで登録した記事が表示されます 都道府県のページでは 各市町村で登録された観光ニュースも自動で表示されます タイトルの先頭にどの地方から登録された記事なのかが表示されます 例 ) 2014.07.01 沖縄県那覇市 花火大会開催のお知らせ 2014.06.05 沖縄県 沖縄県の観光ニュースです 管理画面観光ニュースリスト 編集 作成済みの記事を編集できます 削除 作成済みの記事を削除できます 新規作成 新しく観光ニュースリストを登録します Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 7
観光ニュースリスト 2 観光ニュースの登録 管理画面観光ニュースリスト 日付 お知らせの日付 (TOP ページに表示されます ) タイトル お知らせのタイトル (TOP ページに表示されます ) 内容 記事の内容を入力していきます テキストを入力するだけではなく 上部のアイコンを使用することで写真データ入力やリンク設定 文字のサイズ カラー変更が可能です 各アイコンの説明は 入力エリアについて を参照ください 公開 非公開 HP 上への公開非公開の設定ができます 入力後は必ず更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 8
フリーエリア設定 ( メイン下 ) 各コンテンツへ表示される フリーエリアの設定です フリーエリア ( メインコンテンツ下 ) 管理画面のフリー ( メイン下 ) で登録した内容が表示されます 全国版で登録した内容は 地方版へも自動で表示されます 管理画面フリー ( メイン下 ) フリーエリア内容 表示させたい内容を入力します 画像登録 リンクの設定をします 設定方法につきましては画像のアップロード リンクの設定方法のページをご確認ください 公開 非公開 HP 上への公開非公開の設定ができます 入力後は必ず更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 9
フリーエリア設定 ( サイド上 ) 各コンテンツへ表示される フリーエリアの設定です 全国版の管理画面からのみの登録です フリーエリア 管理画面のフリー ( サイド上 ) で登録した記事が表示されます 全国版で登録した内容は 地方版へも自動で表示されます 管理画面フリー ( サイド上 ) フリーエリア内容 表示させたい内容を入力します 画像登録 リンクの設定をします 設定方法につきましては画像のアップロード リンクの設定方法のページをご確認ください 公開 非公開 HP 上への公開非公開の設定ができます 入力後は必ず更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 10
フリーエリア設定 ( サイド下 ) 各コンテンツへ表示される フリーエリアの設定です バナーエリア 管理画面のフリー ( サイド下 ) で登録した記事が表示されます 全国版で登録した内容は 地方版へも自動で表示されます 管理画面フリー ( サイド下 ) フリーエリア内容 表示させたい内容を入力します 画像登録 リンクの設定をします 設定方法につきましては画像のアップロード リンクの設定方法のページをご確認ください 公開 非公開 HP 上への公開非公開の設定ができます 入力後は必ず更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 11
入力エリアについて 太字ボタン文字を太字にします 斜体ボタン文字を斜体にします 下線ボタン下線を引きます フォーマットボタン見出しのフォーマットを選択できます 絵文字ボタン絵文字が選べます フォントボタンフォントサイズを選択できます テキスト ワード貼り付けボタンテキストやワード エクセルの貼り付けを行います クリアボタンページを白紙にします リンク設定 削除ボタンリンク設定や削除を行います 文字 背景色ボタン文字や背景の色を選びます イメージボタン画像の選択を行います 表組みボタン表の作成を行います 揃えボタン左 真ん中 右揃えの設定を行います テンプレートボタンページ内のレイアウトをテンプレートから選びます CKeditorの詳しい情報は公式サイト( 英語 ) をご覧ください http://ckeditor.com/ AjaCompactに組み込まれているCKeditorは全ての機能動作を保証するものではありません CKeditorに関しての技術的 その他起因する事柄に関してのサポートは弊社では行っておりません ワード エクセルからの貼り付けは windows+officeシリーズでのみ全ての表現を貼り付けることが可能です その他の環境下ではテキストのみの貼り付けとなります Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 12
画像のアップロード 1 クリック! メニューバーの 2 段目にある イメージ アイコンをクリックします イメージプロパティウインドウが新しく開きます クリック! サーバーブラウザー ボタンをクリックします ( すでにアップロードした画像を使用する場合やこれから画像をアップロードする場合は 原則的にこの サーバーブラウザー ボタンを使用します ) 添付ファイルウインドウが新しく開きます イメージプロパティウインドウ 左にあるファイルの上で右クリックし フォルダを作る ボタンをクリックします 画像をアップロードする際は 必ず該当フォルダを作成してから行ってください クリック! サーバーブラウザ内 ( イメージ ) アップロードするファイル名は必ず半角英数字にしてください 日本語が含まれるとアップロードできません ( 後述参照 ) 基本的には画像のリサイズはされません 画像の大きさにはお気をつけください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 13
画像のアップロード 2 フォルダを作成したら アップロード をクリックして画像を選択します クリック! 別ウィンドウ アップロードするファイルの選択 が新しく開くので アップロードする画像ファイル ( この場合 AjaCompact の写真 ) を選択し 開く ボタンをクリックします サーバーブラウザ内 ( イメージ ) アップロードした画像は 表示スタイル / 表示項目 / 表示順 で切り替えて参照することができます 画像の名前を変更したい場合は 該当画像の上で右クリック 名前の変更 ボタンから変更できます アップロードするファイル名は必ず半角英数字にしてください 日本語が含まれるとアップロードできません ( 後述参照 ) 基本的には画像のリサイズはされません 画像の大きさにはお気をつけください サーバーブラウザ内 ( イメージ ) クリック! Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 14
画像のアップロード 3 クリック! 画像の名前変更が完了したら ファイル一覧にアップロードした画像が表示されます 使用する画像を選択してください サーバーブラウザ内 ( イメージ ) URL 欄にファイル名が挿入され プレビュー画面にアップロードした画像が表示されていることを確認してください 代替テキスト欄に画像の簡単な説明を入力し 確認ができたら OK ボタンを押してください 編集ウインドウに画像が配置されます クリック! イメージプロパティウインドウ Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 15
リンクの設定方法 1リンクしたい文字をや画像を選択し リンク挿入ボタンをクリックします 2 別窓でハイパーリンク窓が立ち上がりますので URL 枠に リンクするURLを記入します ( 内部リンクの場合 ) OK をクリック ( 外部リンクの場合 ) 3 ターゲット のタブを選択し ターゲットから 新しいウィンドウ (_ 空白 ) を選択して OK をクリックしてください リンク設定完了です 文字へのリンクの場合は下線が表示されます 4 再度 リンクや画像変更を行う場合は任意の場所で 右クリック をするとメニューが表示されます Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 16
PDF をリンク設定する 1 リンクしたい文字や画像を選択し リンク挿入ボタン をクリックします 2 別窓でハイパーリンク窓が立ち上がりますので サーバーブラウザ をクリックします 3ファイルブラウザーが立ち上がります 任意のフォルダを選択して アップロード をクリック 4 使用しているパソコンのファイルを選択する画面が表示されるのでアップしたいファイルを選択し 開く をクリック アップするファイルの名前は半角英数文字でお願いします 5 ターゲット のタブを選択し ターゲットから 新しいウィンドウ (_ 空 白 ) を選択して OK をクリックしてください PDF は全て 新しいウィンドウ (_blank) で設定してください リンク設定完了です Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 17
Youtube を埋め込む Youtube の動画を記事内に埋め込みができます 観光ニュースでは youtube へアップされた動画を埋め込むことができます 管理画面観光ニュース編集画面 Youtube を挿入したい箇所にカーソルを合わせます エディター上部の を選択する ポップアップが表示されたら 埋め込みをしたい youtube 動画の URL を入力し OK ボタンを選択します エディター上へは動画は表示されず 白い枠が表示されます 入力が終わったら更新ボタンをクリックしてください Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 18
ソーシャル連携機能 ツイッター フェイスブック ブログのコンテンツの連携設定が行えます ソーシャル連携 ツイッター フェイスブックの連携が行えます Copyright IamDesignNetwork Co. All right reserved. この資料は著作権を含んでおります 関係者以外の閲覧を禁止します 19