--年--月--日 --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

@wikiクランHPの編集方法-その3

2009年06月06日 18:17

僕が所属しているA.V.Aのクラン「戦争の犬たち」のHP@wikiへのログイン方法HPの編集方法について記します。
編集の大まかな手順は、編集可能なIDとパスでログイン後に追記・編集するページを表示し、メニュータブから「このページの編集」を指定して追記・編集する方法と、新規のページを作成する場合はメニュータブの「@wikiメニュー」から新規にページを作成し、編集する方法の2点になります。
今回は、その3です。
 
 
 
 
■リンク先のページに画像を表示させる。
ここでは、SiDOOHやSAZABI04の詳細な自己紹介ページの様に画像を表示させる方法について説明します。
簡単に説明すると以下の様な手順となります。
1.画像を表示させたいページに、表示させる画像データをアップロードし
 添付する。
2.ページの編集画面内のプラグインを利用して先ほど添付した画像デー
 タを表示させる。
それでは"TEST001"を例に説明をすすめます。

①詳細な自己紹介ページを表示し、画面上部にあるメニューから"編集"
 をクリックする。
    wied_063
               
 表示されるメニューの中から"このページにファイルをアップロード"を
 クリック。
    wied_064
               
    wied_065
               
 ページ"TEST001"へのファイルのアップロード画面が表示されます。
    wied_066
               
②"参照"をクリックしてアップロードする画像ファイルのある場所を指定
 します。
 画像ではデスクトップにある"20090601"というフォルダの中の"200
 90602_NORA_002.jpg"という画像を例としてアップロードしています。
    wied_067
               
    wied_068
               
    wied_069
               
    wied_070
               
    wied_071
               
    wied_072
               
    wied_073
               
    wied_074
               
    wied_075
               
 空白窓に画像ファイルの場所のディレクトリが表示されたら"アップロー
 ド"をクリックし、画像を表示させたいページに対して画像をアップロード
 させます。
    wied_076
               
 アップロード完了画面が表示されたら、画像のアップロードは完了です。
    wied_077
               
③アップロード完了画面から画像をアップロードしたページに戻ります。
 今回の例ではページ"TEST001"に戻ります。
    wied_078
               
 "TEST001"に戻ったところ。
    wied_079
              
 画面下のほうに先ほどアップロードし、このページに添付したファイル名
 が表示されているはずです。
    wied_080
               
④ファイル名の上にマウスカーソルを持っていき、ファイル名の先頭から
 最後までドラッグし、右クリックから"ショートカットのコピー"を選択しコ
 ピーします。
    wied_081
               
    wied_082
               
    wied_083
               
⑤次に画面上段のメニューから"編集"を選択クリックし、表示されたメ
 ニューから"このページを編集"をクリックする。
    wied_084
               
    wied_085
               
    wied_086
               
⑥編集画面が表示されたら画像を表示させる位置に入力カーソルを表
 示させ、"プラグイン"をクリックする。
    wied_087
               
    wied_088
               
 "プラグイン選択"画面が表示されたら、"画像・音声・動画"をクリック
 する。
    wied_089
               
    wied_090
               
 クリックした後、右端のスライダーを一番下まで下げる。
    wied_091
               
    wied_092
               
 "その他"の下に表示されている"・画像表示(image)"をクリックする。
    wied_093
               
 "画像表示"画面が表示されたら、"画像のURL"に先程コピーしたショー
 トカットを貼り付ける。
    wied_094
               
    wied_095
               
    wied_096
               
    wied_097
               
    wied_098
               
 貼り付けた後、"入力"をクリックする。
    wied_099
               
 編集エリアに画像表示のタグと画像URLが入力されます。
    wied_100
               
 試しにプレビューをクリックして、表示されているかどうか確認します。
    wied_101
               
    wied_102
               
⑦ちゃんと表示はされましたが画像が左に寄っているので、見栄え良く
 中央に表示するように編集します。
    wied_105

               
 タグの先頭からマウスでドラッグし反転表示させた後、右クリックで
 "切り取り"ます。
    wied_106
               
    wied_107
               
    wied_108
               
 次に"プラグイン"をクリックします。
    wied_109
               
 "プラグイン選択"が表示されたら、編集サポートをクリックし右端の
 スライダーを一番下まで下げます。
    wied_110
               
    wied_111
               
    wied_112
               
    wied_113
               
 真中やや下あたりにある"中央揃え(center)"をクリックします。
    wied_114
               
    wied_115
               
 "中央揃え"の入力窓が表示されたら、先ほど切り取った画像表示の
 タグからURLまでをそのまま貼り付けます。
    wied_116
               
    wied_117
               
    wied_118
               
    wied_119
               
    wied_120
               
 貼り付けたら"入力"をクリックします。
    wied_121
               
 編集画面の中にセンター表示タグに囲まれた画像表示タグと画像
 URLが入力されます。
    wied_123
               
 試しにプレビューで確認して、画像がセンターに揃えられた状態で表示
 されていれば成功です。
    wied_124
               
    wied_126
               
⑧ここまでで問題無ければ、"更新情報を宣伝する(Ping)"のチェックを
 外し、"タイムスタンプを更新しない"にチェックを入れて"ページ保存"
 をクリックし完成させます。
    wied_127
               
    wied_128
               
    wied_129
               
    wied_130
               
    wied_131
               
 完成時の画面です。
    wied_132
               
⑨編集が終わったら、忘れずにログアウトしましょう。
    wied_133


以上で説明を終わります。



■その他
HP内の"MEMBER'z ONLY !"を閲覧,編集する場合のID等は、今回
 説明した、編集時のログインID,パスワードと同じものです。
 ※尚、オフィサー以上は別に設定してあります。

HP内の"メンバー専用BBS"を閲覧,編集する場合のパスは、また別
 のものとなります。

③上記のを含む全てのID,パスについては、別途"メンバー専用BBS"
 内に掲示します。 

④これまで説明してきた内容を参考に、各自自己紹介の自身の箇所を
 編集してみてください。

⑤添付・表示させる画像の横幅は520px~480pxにとどめてください。

 
 
 
 
 
 
 
関連記事


コメント

    コメントの投稿

    (コメント編集・削除に必要)
    (管理者にだけ表示を許可する)

    トラックバック

    この記事のトラックバックURL
    http://2byte.blog121.fc2.com/tb.php/30-2c825475
    この記事へのトラックバック



    上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。