- 追加された行はこの色です。
- 削除された行はこの色です。
---------------------------------------------------------
注）このページは未だ書きかけです。追々充実させて行きます。
---------------------------------------------------------
*目次 [#i28cf468]
#contents
*イナズマWebの基本的な使い方 [#s858329e]
**管理画面の主な名称 [#je691c4f]
&attachref(layout.jpg,zoom,400x400);~
~
***�．瓮ぅ鵐淵咼押璽轡腑� [#dc194d2c]
~
メインナビゲーションには次のセクションが含まれています：~
~
メイン - ダッシュボード（管理画面トップページ）へのリンク、Webページのプレレビュー、リソースの作成、ウェブリンクの作成。~
エレメント - チャンクとアップロードしたファイルなど、システムのコンテンツ。~
モジュール - システム内部の設定用メニューです。~
ユーザー - 機能を限定して複数人でご利用いただくためのユーザー管理メニューです。~
ツール とインポート/エクスポートのHTMLファイルのバックアップ-コントロール。~
レポート -提供統計とログ。~
~
***�▲汽屮淵咼押璽轡腑� [#obc2599c]
メインが選択されて表示されるさまざまなオプションです。~
~
***��サイトツリー [#k904bfba]
ウェブページのコンテンツを階層型ツリー構造で表示しています。コンテクスト・メニュー(右クリックで表示)により、カテゴリを指定したページの作成や、編集画面への移動が素早く行えます。~
~
サイトツリーのアイコンの種類~
~
| &attachref(tenkai.jpg); | サイトツリーを全て展開します。 | &attachref(shukusho.jpg); | サイトツリーを最小に折りたたみます。 |
| &attachref(sakusei.jpg); | 一番上の階層にリソースを新規作成します。 | &attachref(weblink.jpg); | 一番上の階層にウェブリンクを作成します。 |
| &attachref(reload.jpg); | サイトツリーを再読み込みします。 | &attachref(sort.jpg); | サイトツリーをタイトル、ID、作成日時、編集日時、ディレクトリ、メニューオーダ順に並び替えることが出来ます。 |
| &attachref(trash1.jpg); | リソースを削除するとリソースタイトルに傍線が引かれ、アイコンが&attachref(trash2.jpg);に替わります。クリックするとリソースを完全に削除します。&br;&attachref(delete.jpg); | &attachref(close.jpg); | サイトツリーを閉じます。表示アイコンをクリックすると閉じたサイトツリーが再び開きます。&br;&attachref(open.jpg); |
| &attachref(context.jpg); | クリックでコンテクスト・メニューを表示し、リソースの新規作成、ウェブリンクの新規作成、リソースの削除、編集ができます。&br;&attachref(context_menu_0.jpg); | | |
~
~
***�ぅ灰鵐謄鵐張Ε�ンドウ [#v8b8e2a5]
ウェブページやサイトの設定に使われます。~
~
***�ゥ罅璽挟浜�バー [#r5d60725]
ログアウトすることができます。現在のパスワードを変更、ユーザまたは、確認のメッセージは、ヘルプファイルへのアクセス、。また、MODxのバージョンをを表示します。~
~
**管理画面ログイン方法 [#la9ae545]
弊社の提供するURLにアクセスします。~
~
&attachref(login.png);~
&attachref(loginnew.png,zoom,400x400);~
~
ログイン画面にアクセスし、弊社の提供するユーザー名、パスワードを入力し、ログインボタンをクリック。~
**編集の方法 [#qe1a34b9]
編集画面にアクセスする方法は2通りあります。
***管理画面から [#z75923d6]
&attachref(admin_edit.jpg,zoom,600x600);~
***その１：管理画面から [#z75923d6]
&attachref(admin_edit.jpg,zoom,400x400);~
~
管理画面左側のリンクから編集したいページを探します。~
編集したいページタイトルをクリックすると、画面右側が選択したページの編集画面に切り替わります。~
タイトルの並びはツリー構造になっています。下層ページを編集したい場合は、タイトル左側の「+」をクリックすると展開し、展開している状態を元に戻したい場合は「-」をクリックすると戻ります。~
***プレビュー画面から [#w523a6cb]
***その２：プレビュー画面から [#w523a6cb]
&attachref(admin_preview.jpg,zoom,600x600);~
&attachref(admin_preview.jpg,zoom,400x400);~
~
画面左上の「プレビュー」リンクから表示用のページへ移動~
~
&attachref(prevew_edit.jpg,zoom,600x600);~
&attachref(prevew_edit.jpg,zoom,400x400);~
~
マウスカーソルをプレビュー画面上部に移動させると、「編集」ボタンが現れます。~
クリックするとプレビュー画面上に編集画面が現れます。~
~
&attachref(preview_edit02.jpg,zoom,600x600);~
&attachref(preview_edit02.jpg,zoom,400x400);~
**基本的なページの増やし方 [#ye364466]
&attachref(page_insert01.jpg,zoom,600x600);~
&attachref(page_insert01.jpg,zoom,400x400);~
~
&attachref(page_insert02.jpg,zoom,600x600);~
&attachref(page_insert02.jpg,zoom,400x400);~
~
&attachref(page_insert03.jpg,zoom,600x600);~
&attachref(page_insert03.jpg,zoom,400x400);~
~
&attachref(page_insert01a.jpg,zoom,600x600);~
&attachref(page_insert01a.jpg,zoom,400x400);~
~
リソース名を右クリックして追加する事もできます。~
クリックしたりソースのサブリソースとしてページが追加されます。~
**メニューへの表示・非表示 [#m697d567]
&attachref(menu.jpg,zoom,600x600);~
&attachref(menu2.jpg,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(menu.jpg,zoom,400x400);~
「メニューに表示する」にチェックを入れると、メニューボタンにマウスポインターが触れると下層ページへのメニューが現れます。~
~
&attachref(menu2.jpg,zoom,400x400);~
~
**ウェブリンクについて [#ua487a7d]
&attachref(linnk_insert01.jpg,zoom,600x600);~
&attachref(linnk_insert01.jpg,zoom,400x400);~
~
&attachref(link_insert02.jpg,zoom,600x600);~
&attachref(linnk_insert02.jpg,zoom,400x400);~
リソース名を右クリックして追加する事もできます。~
クリックしたりソースのサブリソースとしてリンクが追加されます。~
~
&attachref(link_insert03.jpg,zoom,600x600);~
&attachref(link_insert02.jpg,zoom,400x400);~
~
&attachref(link_insert03.jpg,zoom,400x400);~
~
*イナズマWebの使い方（その1：ページ生成） [#s858329e]
**階層型のページの保持 [#z63c306d]
&attachref(0006.jpg,zoom,400x400);~
~
&attachref(0008.jpg,zoom,400x400);~
~
�＿質悒據璽弧召鯑�力。~
�▲據璽呼睛討鯑�力。~
��メニューに表示するかどうかでチェックを入れる。~
�な歛献椒織鵑鬟�リック。~
~
&attachref(0009.jpg,zoom,400x400);~
~
「メニューに表示する」にチェックを入れると、メニューボタンにマウスポインターが触れると下層ページへのメニューが現れます。~
~
**一覧ページの生成 [#z279b1c8]
*イナズマWebの使い方（その2：画像） [#s858329e]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
***親ページの作成 [#a147cad3]
&attachref(0002.jpg,zoom,400x400);~
~
&attachref(0003.png,zoom,400x400);~
~
使用テンプレートを変更すると上のような警告が出ますが「OK」をクリック。~
~
***下層ページの作成 [#w6c12b58]
&attachref(0006.jpg,zoom,400x400);~
~
下層ページを新規作成します。~
~
&attachref(0010.jpg,zoom,400x400);~
~
�＿質悒據璽弧召鯑�力します。~
�▲據璽呼睛討鯑�力します。~
��使用テンプレートを「詳細ページ」に。~
~
&attachref(0003.png,zoom,400x400);~
~
使用テンプレートを変更すると上のような警告が出ますが「OK」をクリック。~
~
�ぅ瓮縫紂爾防充┐垢襪�どうかでチェックを入れる。~
�ァ岼賤�用項目」タブをクリック。~
~
***一覧用項目の設定 [#l01f3f23]
&attachref(0007.jpg,zoom,400x400);~
~
�Α岼賤�用写真」を選択。~
�А岼賤�用コメント」を入力。~
��保存ボタンをクリック。~
~
&attachref(0011.jpg,zoom,400x400);~
親ページに下層ページ一覧が追加されます。~
~
*イナズマWebの使い方（その2：画像・ファイル） [#w9dd6890]
~
**画像の入れ方 [#se8ecdf2]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(gazo_sonyu.png,zoom,400x400);~
A・・・使用したい画像URLをそのまま指定できます。~
~
B・・・PC上の任意の画像をアップロードして使用できます。~
~
Bを押すとFile Browserが立ち上がります。~
&attachref(filebrowser.jpg,zoom,400x400);~
�＿菫�を選択~
�▲機璽弌爾縫▲奪廛蹇璽�~
~
フォルダを新規作成する場合は、�．椒織鷁�の”Create New Folder”を押してください。~
~
&attachref(file_select.png,zoom,400x400); &color(#FF0000,#FFFF00){&size(40){⇒};}; &attachref(gazofinish_0.png,zoom,400x400);~
表示された画像をクリックすると記事に挿入されます。~
~
&attachref(delete_0.jpg);・・・画像の削除~
&attachref(namechange.jpg);・・・名前の変更~
&attachref(gazoueditor.jpg);・・・オンライン画像編集（切り抜きやサイズ変更など簡単な編集のみ。PC上で予め編集してからのアップロードをおすすめします。）~
~
~
**画像と文字の位置関係 [#ee00b51c]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
~
記事内で画像を回りこんで文字をレイアウトできます。~
~
&attachref(hyoujitab.png,zoom,400x400); &color(#FF0000,#FFFF00){&size(40){⇒};}; &attachref(hyoujitab2.png,zoom,400x400);~
~
よく使う配置設定~
-Left・・・画像は左に配置され、画像より後ろにあるテキストは画像の右に回り込みます。
-Right・・・画像は右に配置され、画像より後ろにあるテキストは画像の左に回り込みます。
~
~
|>|BGCOLOR(yellow):左の小窓に変更サンプルが表示されます|
|配置・・・|未設定&br;Baseline&br;Top&br;Middle&br;Bottom&br;Text Top&br;Text Bottom&br;&color(#FF0000,#FFFF00){Left&br;Right};|
|サイズ・・・|ピクセルで指定|
|上下余白・・・|ピクセルで指定|
|左右余白・・・|ピクセルで指定|
|枠線・・・|ピクセルで指定|
|クラス属性・・・|ピクセルで指定|
|style属性・・・|CSSを直接書き込めます|
~
~
**PDFファイルの入れ方 [#a7c12827]
~
この機能を使うとPDFファイルだけではなく、色んなファイルをアップすることが出来ます。~
~
&attachref(pdfup.png,zoom,400x400);~
リンクさせたいテキスト、および画像などをハイライトさせて、リンクを挿入ボタンを押します。~
~
&attachref(pdfup2.png,zoom,400x400);~
リンクURLに直接ファイルへのリンクを貼るか、参照ボタンを押してFile Browserよりファイルをアップロードしてください。~
（File Browserについては、&aname(se8ecdf2){画像の入れ方};をごらんください。）~
~
~
*イナズマWebの使い方（その3：表） [#df632828]
**表の入れ方 [#j14bad03]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(table02.png,zoom,300x300);~
~
テーブルは一般に表形式のデータを表示するのに使われます。テーブルは縦横に複数のマスで構成されています。1マスを「セル」といい、横のセルの集合を「行」、縦のセルの集合を「列」といいます。~
~
セルには、データを記入するデータセルと、見出しを記入するヘッダセルの2種類があります。~
~
&attachref(hyousounyu.png,zoom,400x400);~
~
&attachref(hyousounyu2.png,zoom,400x400);~
-「列」と「行」の数を設定する。
-「Cellpadding」「Cellspaceing」の値を0にする。
-表に外枠が必要な場合は「枠線」に1以上の数値を入力。数値が大きいほど線の幅が太くなる。枠線が必要ない場合は0にする。
-「幅」と「高さ」を設定する（整数を入力）。空欄にすると自動的にデータの文字数に合わせる。
-表の上にタイトルを付けたい場合は「表に見出しを付ける」にチェックを入れる。
~
~
|列・・・|列数|
|行・・・|行数|
|Cellpadding・・・|セル内の余白|
|Cellspacing・・・|セルの間隔|
|配置・・・|中央揃え&br;左揃え&br;右揃え|
|枠線・・・|ピクセルで指定|
|幅・・・|ピクセルで指定|
|高さ・・・|ピクセルで指定|
|表に見出しを付ける・・・|タイトル表示|
~
**ちょっと凝った表の作り方 [#w40039b4]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
~
上級者タブで、より高度な表を作成できます。
~
~
&attachref(hyoupro.png,zoom,400x400);~
-「スタイル」に数値が入力されている場合はそのままにしておく。
-表に外枠を設定したい場合は「枠線の色」のカラーをクリックして色を選択する。
-設定が完了したら「挿入」ボタンをクリックする。
~
~
*イナズマWebの使い方（その4：新着情報） [#b4342a88]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
イナズマWebには、ページごとに公開(またはページを非公開にする)日時を設定することができます。新着情報についても同様に、一定の日時に成った時点で、表示される機能を実現するために、新着情報を個別のリソースとして登録する仕様となっています。
**新着情報の新規作成 [#r9d9db11]
新着情報のリソースアイコンを右クリック~
~
&attachref(whatsnew_icon.jpg);~
~
「ここに新規作成」を選択~
~
&attachref(whatsnew_here.jpg,zoom);~
~
タイトルと内容を入力し、保存します。~
~
&attachref(whatsnew_nyuryoku.jpg,zoom,400x400);~
~
**新着情報の管理方法について [#h4973483]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
***編集日（表示日時）の変更 [#ld7a8b38]
&attachref(date001.jpg);~
~
�ヾ浜�画面から日付を変更したい新着情報のリソースの編集画面へ移動します。~
~
�◆嵎埆呼�設定」タブ内の編集日設定のプルダウン項目から「Manual」を選択します。~
~
&attachref(date002.jpg,zoom,400x400);~
~
�Ｊ埆呼�付の入力欄の中をクリックするとカレンダーが表示されるので、~
上段のプルダウン項目から月と年を選択し、~
中断から変更したい日付の数字をクリックすると、~
入力欄に変更された日付が表示されます。~
~
&attachref(date003.jpg,zoom,400x400);~
~
�ぁ嵎歛検廛椒織鵑鬟�リックし、変更完了。~
~
*イナズマWebの使い方（その5：レイアウト方法） [#hca61e16]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
~
**テンプレートの使用方法 [#e91b7401]
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
&attachref(,zoom,600x600);~
~
テンプレートを使用することで、予め用意された定型文を挿入できます。挿入後は、テキストをサイトに合ったものに変更してください。
~
&attachref(template.png,zoom,400x400);~
~
&attachref(template2.png,zoom,400x400);~
プルダウンよりテンプレートを選んでください。表示例が出ます。
~
|Layout Left・・・|画像左回りこみ|
|Layout Right・・・|画像右回りこみ|
|Color Table・・・|会社概要などに使える表|
|CSS Button・・・|各種色のお問い合わせボタン|
~
**サイドメニューの文字インデント [#v328092e]
�．據璽犬魍稜�~
&attachref(001.jpg,zoom,200x200);~
~
��管理画面にログイン~
~
��リソース「サイト設定」をクリック~
~
&attachref(002.jpg,zoom,200x200);~
~
�ぁ屮汽ぅ廟瀋蝓廛織屬鬟�リック~
~
&attachref(003.jpg,zoom,200x200);~
~
�ァ屮汽ぅ疋瓮縫紂爾離ぅ鵐妊鵐函廚旅猝椶凌�値を変更する~
~
&attachref(004.jpg,zoom,400x400);~
~
�Δ匹譴世臼Δ砲困蕕靴燭い�をピクセル単位で設定します。~
~
&attachref(005.jpg,zoom,200x200);~
~
��保存ボタンをクリック。~
~
&attachref(006.jpg);~
~
�┘廛譽咼紂爾燃稜А�~
~
&attachref(007.jpg,zoom,200x200);~
~
��〜�┐魴�り返し調整します。~
*ページの一括非公開設定 [#t7eaec5a]
**手順 [#uad2ee51]
�．皀献紂璽襯瓮縫紂滋�Doc Manager画面→「その他」タブへ移動~
~
�▲螢宗璽垢粒銅鐇瀋�~
変更対象の設定プルダウンを「公開/非公開」に~
ラジオボタンを「非公開」に~
~
�Ａ犧鄲仂�(操作元)のリソースIDを指定項目~
下記指定方法を参考に
トップページ、ヘッダーメニュー、サイドメニュー（下層ページを含む）を非公開にする場合は
「1**,14**,15**」~
と入力し、適用ボタンで完了~
~
&attachref(hikoukai.jpg,zoom,400x400);~
~
**指定方法 [#q6a6d13a]
-n* - その親リソース(コンテナ)と直下のサブリソースを意味する指定
-n** - その親リソース(コンテナ)と配下の子、孫など全てのリソースを意味する指定
-n-m - n から m までのIDの範囲を意味る指定。n、m を含みます
-n - IDがnの1つのリソースを意味する指定
-例：1*,4**,2-20,25 - この指定では、1、1のサブリソース、4、4の全配下リソース、 2から20までの19個のリソース及び25 の各IDのリソースが指定されています。
~
~
*ページエディタの使用方法 [#mf24af64]
コンテンツウィンドウ内のページ内容編集エリアについての説明です。
**各機能と名称 [#kaec6390]
~
| &attachref(code_icon.jpg); | htmlをソースコートで編集する | &attachref(css_icon.jpg); | 選択部分のスタイルの編集 |
| &attachref(bold_icon.jpg); | 選択テキストを太字にする | &attachref(italic_icon.jpg); | 選択テキストをイタリックにする |
| &attachref(underline_icon.jpg); | 選択テキストを下線にする | &attachref(strike_icon.jpg); | 選択テキストを打消にする |
| &attachref(txtcolor_icon.jpg); | 文字色の選択する | &attachref(bgcolor_icon.jpg); | 背景色の選択する |
| &attachref(); | classを選択する | &attachref(format_select_icon.jpg); | 書式を選択する |
| &attachref(fontsize_select_icon.jpg); | フォントサイズを選択する | &attachref(code_format_icon.jpg); | コードの整理をする |
| &attachref(format_clear_icon.jpg); | 書式を削除する | &attachref(sub_icon.jpg); | 下付文字を挿入する |
| &attachref(sup_icon.jpg); | 上付文字を挿入する | &attachref(undo_icon.jpg); | 元に戻す |
| &attachref(redo_icon.jpg); | 一段階進む | &attachref(justifyleft_icon.jpg); | 選択テキストを左揃え |
| &attachref(justifycenter_icon.jpg); | 選択テキストを中央揃え | &attachref(justifyright_icon.jpg); | 選択テキストを右揃え |
| &attachref(justifyfull_icon.jpg); | 選択テキストを両端揃え | &attachref(blockquote_icon.jpg); | 選択テキストを引用文にする |
| &attachref(list_icon.jpg); | 黒点リストを作る | &attachref(list_number_icon.jpg); | 数字のリストを作る |
| &attachref(indent_off_icon.jpg); | 選択したテキストエリアを１タブ分左にずらす | &attachref(indent_icon.jpg); | 選択したテキストエリアを１タブ分右にずらす |
| &attachref(link_icon.jpg); | 選択テキストのリンクを追加または編集する | &attachref(clear_link_icon.jpg); | 選択テキストのリンクを削除する |
| &attachref(anchor_icon.jpg); | アンカーを追加または編集する | &attachref(paste_txt_icon.jpg); | 書式なしで貼り付け |
| &attachref(paste_word_icon.jpg); | ワードからの貼り付け | &attachref(search_icon.jpg); | テキストを検索する |
| &attachref(replace_icon.jpg); | テキストを検索/置換する | &attachref(table_create_icon.jpg); | 表の挿入・編集 |
| &attachref(tbl_property_line_icon.jpg); | 行の編集 | &attachref(tbl_property_cell_icon.jpg); | セルの編集 |
| &attachref(tbl_insert_row_above_icon_i.jpg); | 上に行を挿入 | &attachref(tbl_insert_row_down_icon.jpg); | 下に行を挿入 |
| &attachref(tbl_delete_row_icon.jpg); | 行を削除 | &attachref(tbl_insert_clm_left_icon.jpg); | 前に列を挿入 |
| &attachref(tbl_insert_clm_right_icon.jpg); | 後に列を挿入 | &attachref(tbl_delete_clm_icon.jpg); | 列を削除 |
| &attachref(clear_cell_binding_icon.jpg); | セルの分割 | &attachref(cell_binding_icon.jpg); | セルの合体 |
| &attachref(hr_icon.jpg); | 罫線の挿入 | &attachref(strange_char_icon.jpg); | 特殊文字の挿入 |
| &attachref(picture_icon.jpg); | 画像を挿入または編集する | &attachref(media_icon.jpg); | メディアを挿入または編集する |
| &attachref(template_icon.jpg); | テンプレートの挿入 | &attachref(select_all_icon.jpg); | 全てを選択する |
| &attachref(fullscreen_icon.jpg); | フルスクリーンモードに切り替える | &attachref(help_icon.jpg); | ヘルプを表示する |
~
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
