めぐろ すくナビ 更新マニュアル 平成 25 年 4 月 8 日 株式会社まちづくり三鷹
目次 ログイン... 3 ログイン方法... 3 記事の更新 ( すくなび記事 / キッズレポート )... 4 新規作成... 5 記事の入力... 7 タイトルと内容の入力...7 入力時の注意点改行の方法... 8 段落番号の設定... 13 箇条書きの設定... 15 リンクの設定... 17 スタイルの設定... 20 フォーマットの設定... 21 セルの結合... 24 ヘッダの設定... 25 ファイルの管理... 26 ファイルのアップロード... 26 ファイルの貼付 添付... 27 画像のサイズ変更... 28 記事設定... 30 分野を設定する... 30 属性を設定する... 30 新着記事表示... 30 記事一覧表示... 30 イベントカレンダーを設定する... 31 表示端末を設定する... 32 地図を表示する... 33 表示中のマップ情報... 33 マーカーの設定... 34 マップの設定... 34 公開日時設定... 36 表示日時... 36 公開開始日時 公開終了日時... 36 承認設定... 37 承認者... 37 記事を登録する... 37 下書き保存... 37 承認待ち... 37 1
プレビュー画面の確認... 38 登録した記事の編集... 39 今月のめぐろ すくナビ ( すくナビアルバム ) の更新... 40 画像ファイルのアップロード... 40 新規作成... 40 画像ファイルの登録... 41 フォルダ... 41 ファイル... 42 登録した画像ファイルの編集 削除... 43 編集... 43 削除... 43 アップロードした画像ファイルの追加... 44 編集 44 本文 の編集... 45 今月のめぐろ すくナビバックナンバー の追加 修正... 48 複製 ( 更新用 ) の作成... 48 複製 ( 更新用 ) の編集... 50 本文 の編集... 51 承設定... 58 承認者... 58 保存 59 下書き保存... 59 承認待ち... 59 2
ログイン ログイン方法 1. 下記の URL にアクセス http:// sukunavi.megurokodomo.net/_system/login 2. ZOMEKI ログイン画面にユーザ ID とパスワードを入力し [ ログイン ] をクリック ユーザ名 パスワード ログイン情報 3
記事の更新 ( すくなび記事 / キッズレポート ) 枠で囲まれた範囲に表示されます 赤 [ すくなび記事 ] 緑 [ イベント情報 ] 青 [ キッズレポート ] 4
新規作成 1. コンセプトを すくなび記事 に変更 イベント情報の場合は イベント情報 キッズレポートの場合は キッズレポート に変更 (1) (2) 2. [ コンテンツ ] をクリック 5
3. コンテンツ名 [ すくなび記事 ( 分野 ) ] をクリック イベント情報の場合は イベント情報記事 キッズレポートの場合は [ キッズレポート ] をクリック (3) 4. [ 新規作成 ] をクリック (4) 6
記事の入力 タイトルと内容の入力 1. タイトル を入力 タイトルは必須項目です (1) 2. 内容 の入力 コマンドボタンを使用して入力した文字列に装飾や配置の設定 変更を行います (2) コマンドボタン ここに文字を入力 7
入力時の注意点改行の方法 改行の方法は 2 通りありますが 表示方法が異なります 改行 [Enter] キーを押す 段落内改行 [Shift] キーを押しながら [Enter] キーを押す <HTML 表記 > [Enter] <p>~</p> ( 段落 ) [Enter] で改行を行った場合 改行された部分の前と後で段落が変わります [Shift]+[Enter] <br /> ( 改行 ) [Shift]+[Enter] で改行を行った場合 その段落の中で改行されます プレビュー表示 約 1 行分の行間が空きます ほとんど行間は空きません 8
入力時の注意点環境依存文字 ( 機種依存文字 ) について 記事の 内容 に環境依存文字が入力されているとエラーとなります 環境依存文字とは 閲覧者の使用環境に影響し 特定の環境以外では表示が変化したり 正常に表示できなくなる文字のことです 上記のメッセージが表示された場合は 内容 から環境依存文字を削除するか 別の表記 (1 1. など ) に置き換えることで解決します また 環境依存文字は インターネット上で利用できる検出ツールで簡単に探すことができます 参考 さぶみっと!JAPAN 機種依存文字チェッカー http://www.submit.ne.jp/tool/uniquechar/check.html コマンドボタンの機能解説一覧 ボタンボタン名解説 ソース HTML ソースを直接編集することができます 保存 下書きとして保存されます タイトルの入力が必須 新しいページ 白紙の状態になります 9
プレビューテンプレート ( 雛形 ) 切り取り 作成している資料登録をブラウザ (WEB 表示 ) で確認できます テンプレートを挿入します 選択した範囲を切り取ります コピー 選択した範囲をコピーします 貼り付けプレーンテキスト貼り付け元に戻す コピー ( または切り取り ) をした内容を貼り付けます コピー ( または切り取り ) をした内容を書式無しで貼り付けます 直前の操作を取り消して 元に戻します やり直し 直前の [ 元に戻す ] 操作を取り消します ボタンボタン名解説 検索 文章から指定した文字を検索します 置き換え 文章から指定した文字を検索し 別の文字に置き換えます すべて選択 入力されている文字や画像をすべて選択します 太字 選択した文字を太字にします 斜体 選択した文字を斜体にします 下線 選択した文字に下線を引きます 打ち消し線 選択した文字に打ち消し線を引きます 添え字 選択した文字が下付き文字になります 上付き文字 選択した文字が上付き文字になります フォーマット削除 選択した文字に設定した書式を解除します 段落番号 選択した段落に段落番号を設定します 参照 - リストの設定 10
箇条書き選択した段落に箇条書きを設定します ( リストマークは黒丸など ) インデント解除 選択したインデントが解除されます インデント 選択した段落に対して インデント ( 字下げ ) が設定されます ブロック引用 選択した段落に対して 字下げ ( 引用文章 ) が設定されます 左揃え選択した段落に対して 文字列の配置を左に揃えます ( 初期状態 ) 中央揃え 選択した段落に対して 文字列の配置を中央に揃えます 右揃え 選択した段落に対して 文字列の配置を右に揃えます 両端揃え 選択した段落に対して 両端揃えになります ボタンボタン名解説 リンク挿入 / 編集 選択した文字にリンクを設定します 参照 - リンクの設定 リンク解除アンカー挿入 / 編集イメージ 選択したリンクを解除します 文字を選択した状態で アイコンをクリックすると文字にアンカーが挿入されます 画像の挿入または編集をします Flash テーブル横罫線絵文字特殊文字挿入スタイルフォーマット Flash の挿入 又は挿入した Flash の情報編集 ( 詳細設定 ) ができます テーブル ( 表 ) の挿入 又は挿入したテーブルの編集 ( 詳細設定 ) ができます 参照 - 表の作成 : 挿入 アイコンをクリックすると 横罫線が挿入されます アイコンをクリックすると 絵文字パレットが表示され 絵文字を挿入できます アイコンをクリックすると 特殊文字パレットが表示され 特殊文字を挿入できます 選択した文字 ( または段落 ) に登録されている書式を設定します 参照-スタイルの設定 選択した段落に見出しを設定します 参照 -フォーマットの設定 11
フォント 選択した文字の種類を変更します サイズ 選択した文字の大きさを変更します テキスト色 背景色 最大化 選択した文字の色を変更します 文字を選択した状態でアイコンをクリックすると カラーパレットが表示され 文字の背景に好きな色を設定できます アイコンをクリックすると 内容のコマンド欄と入力欄がブラウザ全体に表示されます 12
段落番号の設定 1. 書式を設定したい文字列をドラッグで範囲選択 2. [ 段落番号 ] をクリック (2) (1) 段落番号を解除する場合は もう一度 [ 段落番号 ] をクリックしてください [Enter] と [Shift]+[Enter] の違い Enter の場合 段落番号を設定した文末で [Enter] を押すと 次の行に番号が挿入されます この位置で [Enter] Shift + Enter の場合 段落番号を設定した文末で [Shift]+[Enter] を押すと 次の行にカーソルが移動しますが 番号は挿入されません この位置で [Shift]+[Enter] 13
プレビュー表示 14
箇条書きの設定 1. 書式を設定したい文字列をドラッグで範囲選択 2. [ 箇条書き ] をクリック (2) (1) 箇条書きを解除する場合は もう一度 [ 段落番号 ] をクリックしてください [Enter] と [Shift]+[Enter] の違い Enter の場合箇条書きを設定した文末で [Enter] を押すと 次の行に番号が挿入されます この位置で [Enter] Shift + Enter の場合段落番号を設定した文末で [Shift]+[Enter] を押すと 次の行にカーソルが移動しますが 番号は挿入されません この位置で [Shift]+[Enter] 15
プレビュー表示 16
リンクの設定 1. リンクを設定したい部分をドラッグで範囲選択 2. [ リンク挿入 / 編集 ] をクリック (2) (1) 3. URL にサイト URL http://www.city.meguro.tokyo.jp/ と入力 4. [OK] をクリック (3) http:// は [ プロトコル ] で 選択するので 含まない (4) 17
外部サイトのリンクについて 外部サイトにリンクする場合は アクセスした際 閲覧しているウィンドウ ( タブ ) とは別に新しいウィンドウ ( タブ ) を開いて外部サイトを表示しましょう [ ターゲット ] タブの ターゲット の をクリックし ドロップダウンリストから [ 新しいウィンドウ (_ 空白 )] を選択 18
プレビュー表示 クリッククリック 外部サイトは 新しいウィンドウ ( タブ ) に表示 19
スタイルの設定 1. 書式を設定したい文字列をドラッグで範囲選択 2. [ スタイル ] の をクリック (2) (1) 3. ドロップダウンリストから該当する書式を選択 (3) ブロックスタイル は 段落全体(<p>~</p>) に書式が設定されます インラインスタイル は ドラッグで選択した文字列に書式が設定されます 20
フォーマットの設定 1. 書式を設定したい文字列をドラッグで範囲選択 2. [ 標準 ( フォーマット )] の をクリック (2) (1) 3. ドロップダウンリストから該当する書式を選択 (3) 21
プレビュー表示 22
表の作成 1. 挿入したい場所にクリックでカーソルを置き [ テーブル ] をクリック (1) クリック 2. [ テーブルプロパティ ] タブの 行 列 を入力 3. [ テーブルの概要 ] を入力し 幅 の値を削除 4. [OK] をクリック (2) (3) (3) テーブルの概要( サマリー ) とは 表の情報を要約したもので 表のタイトルのようなものです (4) 5. 挿入された表に 文字を入力 (5) 23
セルの結合 1. 結合したいセルをドラッグで範囲選択 (1) 2. 範囲選択したセルの上で右クリックし [ セル ] [ セルの結合 ] をクリック 右クリック (2) 24
ヘッダの設定 1. ヘッダの設定をする表内で右クリックし [ セル ] [ テーブルプロパティ ] をクリック 右クリックの位置は 表内ならどこでも構いません 右クリック (1) 2. [ テーブルプロパティ ] タブの テーブルヘッダ (th) の をクリックし ドロップダウンリストから [ 初めの列のみ ] を選択 3. [OK] をクリック (2) (3) 25
ファイルの管理ファイルのアップロード 記事に挿入する画像ファイルや PDF ファイル等は ファイル管理へアップロードする必要があります 1. [ 開く ] をクリック (1) 2. ファイル の [ 参照 ] をクリック (2) 3. アップロードするファイルを選択し [ 開く ] をクリック (3) 26
4. 表示ファイル名 に日本語でファイルの名前を入力 5. [ アップロード ] をクリック (4) (5) 下部にファイルがアップロードされます ファイルの貼付 添付 6. ファイルを挿入したい場所をクリック (6) 7. アップロードしたファイルの [ 貼付 ] または [ 添付 ] をクリック 画像を挿入する場合は [ 貼付 ] PDF などのファイルを挿入する場合は [ 添付 ] をクリックします (7) (7) 27
ファイルが挿入されます [ 貼付 ] をクリックした場合 [ 添付 ] をクリックした場合 画像のサイズ変更 マウスポインターを使う方法 ハンドル 挿入した画像をクリックすると 画像の周囲八箇所に白い ( ハンドル ) が表示されます このハンドルにマウスポインターを合わせると マウスポインターが双方向矢印に変わります 双方向矢印の状態でドラッグすると サイズが変更できます 角のハンドルを使用すると 縦横比が変わりません 28
ダイアログボックスを使う方法 クリック 編集したい画像を選択し [ イメージ ] をクリックします このダイアログボックスでも サイズの変更ができます そのほか 代替テキストの変更 配置 枠線 リンクの設定ができます 幅 高さ の値を変更します 大きな画像はあらかじめ縮小するデジタルカメラ等で撮影された写真のサイズは 数千ピクセルの大きさになる場合があります このような大きな画像ファイルをアップロードするとサーバのディスク容量を圧迫し システムトラブルの原因ともなります めやすとして幅 700 ピクセルを超えるものはあらかじめリサイズしてからアップロードしてください 小さな画像を拡大しない古い携帯電話等で撮影された写真は パソコンの画面では非常に小さく見えます こうした小さな画像を編集画面で引き伸ばすと非常に粗い画像となりますのでご注意ください 29
記事設定 地域の項目は使用しません 分野を設定する 1. 分野 の をクリックし ドロップダウンリストから該当する項目を選択 (1) 属性を設定する 2. 属性 の をクリックし ドロップダウンリストから該当する項目を選択 (2) 新着記事表示 3. 新着記事一覧 (P.4 の枠内 ) での表示設定をします この項目を 非表示 に設定した場合でも 通常の記事一覧ページには表示されます 記事一覧表示 4. 記事一覧ページでの表示設定をします 上記 3. の手順で 表示 に設定した場合でも この項目を 非表示 にすると新着記事一覧を含む全ての記事一覧ページで非表示となります ただし イベントカレンダーの一覧は除く 30
イベントカレンダーを設定する イベント情報記事 のみ 5. [ イベントカレンダー表示 ] の [ 表示 ] を選択 6. [ イベント日付 ] のテキストボックスをクリックし イベントの日付を選択 クリック 7. 選択した日付が挿入されます 8. 記事公開後 自動的にイベントカレンダーに表示されます 31
関連ワードを設定する 9. 入力フォームをクリックし 文字を入力 (9) 関連ワードは 3 つまで入力できます 関連ワードを設定する場合は 後に検索するために統一した表記で登録してください 例 ) [ 子ども こども ] [ 障がい 障害 ] など 関連記事を設定する 10. 関連記事 の をクリックし ドロップダウンリストから該当する項目を選択 (10) 表示端末を設定する 11. 該当する項目をクリック (11) 基本的には 全てに表示 を選択してください 32
地図を表示する 表示中のマップ情報 1. 地名で検索 に 地名 または 住所 を入力し 検索 をクリック 検索 をクリックすると 検索した位置がマップの中央に移動します 1 2. マップから目的の位置を確認し クリック クリックした位置に 水色のマーカーが付きます 2 クリック 33
マーカーの設定 3. マーカーの位置を確認し [ クリックした座標を設定する] をクリック クリックすると マーカーの色が赤くなり 座標が設定されます 4. マーカーの設定の 名称 を入力 (3) 座標が設定されます (4) 2 つ以上のマーカーを設定する場合は 再度 2.~4. の手順を繰り返します マップの設定 5. マップ名 を入力 (5) 34
6. マップの 座標 と 縮尺 を調整 座標( 表示位置 ) はマップ上をドラッグで調整します 縮尺はマップ左上のボタンで調整します (6) 7. [ 現在の座標と縮尺を設定する ] をクリック (7) 座標 縮尺が設定されます 35
公開日時設定表示日時 表示日時 をクリックすると カレンダーが表示されるので 記事作成日を設定 新着記事一覧等では 日付が新しいもの程 上部に表示されます クリック 公開開始日時 公開終了日時記事の公開期間を設定することができます [ 公開開始日時 ] 設定した日時になると 自動的に記事が公開状態になります ただし 設定された記事の状態が 公開待ち になっている必要があります [ 公開終了日時 ] 設定した日時になると自動的に記事が非公開状態になります 公開開始日時 公開終了日時 ともに 表示日時 と操作手順は同じです 必要に応じて設定してください 36
承認設定承認者 1. 承認者をクリックで選択 2. [ 追加 ] をクリック (1) (2) クリック 承認者を解除する場合は 右フォームに表示されている 承認者 を選択し [ 除外 ] をクリックします 記事を登録する下書き保存 [ 下書き保存 ] は WEB ページに公開されません 保留の記事や 作成途中の記事は下書き保存にしましょう 承認待ち [ 承認待ち ] は 承認者が設定されている場合のみ使用できます 承認待ちにした記事は 設定した承認者から承認されないと WEB へ公開できません 37
プレビュー画面の確認 実際に WEB ページに表示される画面の確認を行います 1. 登録した記事を確認 (1) 2. プレビュー の [PC] をクリック 3. プレビュー画面を確認 38
登録した記事の編集 1. 編集したい記事の [ 詳細 ] をクリック 編集できる記事は ログインしているアカウントと同じ所属のものに限ります (1) 2. [ 編集 ] をクリック (2) 3. 記事を編集 新規作成の画面と編集画面は画面構成 作業手順ともに同じです 39
フォトコーナーの更新 赤枠で囲んだ箇所を編集します 画像ファイルのアップロード 新規作成 1. コンセプトを トップページ に変更 2. [ データ ] をクリック (1) (2) 40
3. [ ファイル ] をクリック 4. [ 新規作成 ] をクリック (3) (4) 画像ファイルの登録 フォルダ 1. フォルダ の をクリックし ドロップダウンリストから [album: 今月のめぐろ すくナビアルバム ] を選択 (1) 41
ファイル アップロードする画像ファイルの横幅は 180px 以内にリサイズしてください 2. ファイル の [ 参照 ] をクリック (2) 3. アップロードするファイルを選択し [ 開く ] をクリック (3) 4. 表示ファイル名 に日本語でファイルの名前を入力 5. [ 登録する ] をクリック (4) (5) 6. 一覧に画像ファイルが追加されたことを確認 (6) 42
登録した画像ファイルの編集 削除 1. 編集または削除したい画像ファイルの [ 詳細 ] をクリック (1) 編集 [ 編集 ] をクリックすると 画像ファイルの登録画面とほぼ同じ画面が表示されます 登録内容を修正し [ 編集する ] をクリックすると 編集が完了します 削除 [ 削除 ] をクリックすると 登録した画像ファイルが一覧から削除されます 43
アップロードした画像ファイルの追加 編集 1. コンセプトを トップページ に変更 2. [ デザイン ] をクリック (1) (2) 3. [ ピース ] をクリック 4. ピース名 子どものいる風景 の [ 詳細 ] をクリック (3) (4) 5. [ 編集 ] (5) 44
本文 の編集 本文以外は変更しないでください 1. 本文 の img[2] = '<img src="/_files/00000420/img_pict03.jpg" alt=" 写真投稿 omatu3 号 " /><br /> 写真投稿 omatsu3 号さん '; をドラッグで範囲選択し 右クリック [ コピー ] を選択 ([Ctrl]+[C]) (1) 右クリック [ コピー ] ([Ctrl]+[C]) 2. ドラッグで選択した範囲の後ろを [Enter] で改行し 右クリック [ 貼り付け ] を選択 ([Ctrl]+[V]) この位置で [Enter] 右クリック [ 貼り付け ]([Ctrl]+[V]) 45
3. 貼り付けた img[2] = '<img src="/_files/00000420/img_pict03.jpg" alt=" 写真投稿 omatu3 号 " /><br /> 写真投稿 omatu3 号さん '; の修正 img[2] img[3] omatu3 号さん sample01 さん 4. ファイル の [ 開く ] をクリック (4) 5. 一覧から追加する画像ファイルの [URL] をクリックし 右クリック [ コピー ] を選択 ([Ctrl]+[C]) (5) 6. コピーされた [URL] を img[3] = '<img src="/_files/00000420/img_pict03.jpg" alt=" 写真投稿 sample01" /><br /> 写真投稿 sample01 さん '; の /_files/00000420/img_pict03.jpg の箇所をドラッグで範囲選択し 右クリック [ 貼り付け ] を選択 ([Ctrl]+[V]) (6) 7. [ 編集する ] をクリック 上記以外の部分を修正 削除してしまった場合は [ 編集する ] をクリックせずに [ 一覧 ] をクリックして作業をやり直してください (7) 46
追加した画像ファイルは トップページの 今月のめぐろ すく ナビ にランダムで表示されます 47
今月のめぐろ すくナビバックナンバー の追加 修正 複製 ( 更新用 ) の作成 1. コンセプトを トップページ に変更 2. [ ディレクトリ ] をクリック (1) (2) 48
3. タイトル 今月のめぐろ すくナビバックナンバー のファイル名 [gallery] をクリック (3) 4. タイトル 今月のめぐろ すくナビバックナンバー の [ 詳細 ] をクリック (4) 5. [ 複製 ( 更新用 )] をクリック (5) 49
6. [OK] をクリック (6) 複製 ( 更新用 ) の編集 1. タイトル 今月のめぐろ すくナビバックナンバー ( 更新用 ) の [ 詳細 ] をクリック (1) 2. [ 編集 ] をクリック (2) 50
本文 の編集 本文以外は変更しないでください 1. 本文 の 一番上にある 月のめぐろ すくナビ の先頭で [Enter] 改行を 2 回行う (1) この位置で 2 回 [Enter] 改行 2 行の間隔を 空ける 51
2. 月のめぐろ すくナビ のテキストを範囲選択し 右クリック [ コピー ]([Ctrl]+[C]) (2) 右クリック [ コピー ]([Ctrl]+[V]) 3. 改行で空いた行の一行目に コピーしたテキストを右クリック [ 貼り付け ]([Ctrl]+[V]) で貼り付け 月 の箇所を更新時の月に変更 (3) 52
4. 2 行目の空白行にカーソルを配置し コマンドボタンの [ テーブル ] をクリック (4) 53
5. [ テーブルプロパティ ] に以下のように設定し [OK] をクリック 行 2 の倍数 ( 画像と投稿者名のため ) 最低値 2 列 最低値 1 テーブルヘッダ なし ボーダーサイズ 0 行揃え なし 上記以外は基本的に空白となります ( 初期値が入っている場合は値を削除してください ) 必要に応じて任意に調整してください (5) 54
6. ファイル の [ 開く ] をクリックし ファイルの一覧を表示 (6) 7. 一覧から該当する画像ファイルの URL をクリックし 右クリック [ コピー ]([Ctrl]+[C]) (7) 8. 5. の手順で挿入されたテーブルの上段セルにカーソルを配置し コマンドボタン [ イメージ ] をクリック (8) 上段に配置 55
9. [ イメージプロパティ ] に以下のように必要に応じて設定し [OK] をクリック URL 7. の手順でコピーした URL を右クリック [ 貼り付け ]([Ctrl]+[V]) 代替テキスト 投稿者: さん を入力 行揃え < なし > 上記以外は基本的に空白となります ( 初期値が入っている場合は値を削除してください ) 必要に応じて任意に調整してください (9) 56
10. セルの下段に 投稿者 : さん を入力 (10) 11. 投稿者 : さん をドラッグで範囲選択し [ サイズ ] から [16px] を選択 クリック 57
承設定承認者 1. 承認者をクリックで選択 2. [ 追加 ] をクリック (1) (2) クリック 承認者を解除する場合は 右フォームに表示されている 承認者 を選択し [ 除外 ] をクリックします 58
保存下書き保存 [ 下書き保存 ] は WEB ページに公開されません 保留の記事や 作成途中の記事は下書き保存にしましょう 承認待ち [ 承認待ち ] は 承認者が設定されている場合のみ使用できます 承認待ちにした記事は 設定した承認者から承認されないと WEB へ公開できません 59