写真を掲載する

gen により 2012年 5月 30日, 17:01が変更された | 履歴

    ホームページ応援団では簡単に写真を掲載することができます。

    予めサイズを変更した写真を用意する

    =media_1338393835919.png

    サイトにもよりますが、大体記事の掲載スペースの横幅は、600〜700ピクセルになります。
    ですので、記事エリアの半分くらいのスペースに写真を置きたい場合は横幅300〜350ピクセルに、
    横幅いっぱいに掲載したい場合は、横幅600〜700ピクセルくらいの幅で写真を用意する必要があります。

    写真のリサイズは、サイズを指定して写真画像を簡単にリサイズできるソフトウェアがあります。
    <リサイズ超簡単Pro>
    http://my.reset.jp/~triton/RCKP.htm

     

    写真はリサイズしたら、英語だけのファイル名にしておきます。ホームページに掲載する写真のファイル名に日本語は使えませんのでご注意ください。

    横幅いっぱいの写真を掲載する(1)

    =media_1338394086749.png

    (1) 写真を掲載したい場所に、何もない段落を一つ作り、カーソルをあわせます。
    (2) 画像ボタンを押します。

    横幅いっぱいの写真を掲載する(2)

    =media_1338394601319.png

    イメージマネージャーが起動します。
    (1)左下のフォルダから、「stories」を選択します。使用する写真はこのstories にアップロードして使用することをお勧めします。
    (2)アップロードアイコンをクリックします。
    ※)ファイルが多くなってきたらフォルダの作成でフォルダを作成して整理することもできます。

    横幅いっぱいの写真を掲載する(3)

    =media_1338395075469.png

    アップロードウインドウが出ます。
    (1) 【参照】をクリックします。
    (2) ファイルを選択します。
    (3) OKボタンなどを押します。

    横幅いっぱいの写真を掲載する(4)

    =media_1338395352152.png

    (1)アップロードウィンドウに画像名が表示されます。
    (2)【アップロード】をクリックします。
    (3)ファイル名の後ろにインジケーターが動き、ファイルがアップロードされウインドウが自動的に閉じます。

    横幅いっぱいの写真を掲載する(5)

    =media_1338395659560.png

    (1)アップロードした写真がファイルブラウザで表示されていますので、ファイル名をクリックします。
    (2)上部のURLに画像ファイル名が、代替テキストに適当な名称が入ったことを確認します。
    (3)余白を設定します。周りの文字などとくっつきすぎると見栄えがわるくなりますので、だいたい10くらいの値を入れることをおすすめします。
    (4)挿入をクリックして画像を挿入します。

    横幅いっぱいの写真を掲載する(6)

    =media_1338396035182.png

    画像が挿入されました。
    (1)中揃えなどを設定しておくと見栄えがよくなります。
    記事を保存して、表示を確認しましょう。
    完成です。

    記事の半分くらいに写真を置き文字を回り込ませる(1)

    =media_1338397197275.png

    記事の横幅半分くらいのサイズの写真を掲載し、文字を回り込ませる方法です。

    記事の半分くらいに写真を置き文字を回り込ませる(2)

    300〜350ピクセル幅の写真を用意しておきます。

    記事の半分くらいに写真を置き文字を回り込ませる(2)

    =media_1338396687532.png

    (1)写真と一緒に表示したい段落のテキストの一番頭にカーソルを合わせます。
    (2)画像ボタンをクリックします。

    記事の半分くらいに写真を置き文字を回り込ませる(2)

    横幅いっぱいの写真を掲載するの(2)〜(4)の手順を行い、画像をアップロードします。

    記事の半分くらいに写真を置き文字を回り込ませる(3)

    =media_1338396919433.png

    (1)アップロードした写真がファイルブラウザで表示されていますので、ファイル名をクリックします。
    (2)上部のURLに画像ファイル名が、代替テキストに適当な名称が入ったことを確認します。
    (3)余白を設定します。周りの文字などとくっつきすぎると見栄えがわるくなりますので、だいたい10くらいの値を入れることをおすすめします。
    (4)配置から、【左】または【右】配置の好きな方を選びます。
    (5)プレビュー部分にどういう配置かが表示されます。
    (6)挿入をクリックして写真を挿入します。

    記事の半分くらいに写真を置き文字を回り込ませる(4)

    =media_1338397114531.png

    回りこみができていることを確認します。
    記事を保存して画面を確認して完了です。

    タグ (タグ編集)
    • No tags
    ここにリンクしているページ
    ページ統計
    1286 view(s), 3 edit(s) and 6383 character(s)

    コメント

    あなたはコメントを投稿するには ログイン しなければなりません。

    添付ファイル

    添付

    ファイルサイズ日付添付したユーザ 
     media_1338393835919.png
    説明なし
    201.07 kB2012年 5月 30日, 17:00genアクション
     media_1338394086749.png
    説明なし
    53.06 kB2012年 5月 30日, 17:00genアクション
     media_1338394601319.png
    説明なし
    84.13 kB2012年 5月 30日, 17:00genアクション
     media_1338395075469.png
    説明なし
    62.18 kB2012年 5月 30日, 17:00genアクション
     media_1338395352152.png
    説明なし
    39.1 kB2012年 5月 30日, 17:00genアクション
     media_1338395659560.png
    説明なし
    97.31 kB2012年 5月 30日, 17:00genアクション
     media_1338396035182.png
    説明なし
    146.58 kB2012年 5月 30日, 17:00genアクション
     media_1338396687532.png
    説明なし
    75.48 kB2012年 5月 30日, 17:00genアクション
     media_1338396919433.png
    説明なし
    110.98 kB2012年 5月 30日, 17:00genアクション
     media_1338397114531.png
    説明なし
    166.47 kB2012年 5月 30日, 17:00genアクション
     media_1338397197275.png
    説明なし
    106.05 kB2012年 5月 30日, 17:01genアクション