はじめに
スタートアップ
ホーム
編集-編集
編集-登録
編集-ツール
ブロック
コーナー
アプリケーション
設定-管理
設定-サイト
設定-システム
設定-その他
保守ツール
マルチサイト
SDEditor
プラグイン
オプション
Tips
リリースノート
よくある質問
権限と承認
用語集

通常ブロックには、文章だけでなく画像を載せることもできます。ここでは、画像の挿入方法をご説明します。練習のために、好きな画像をひとつ用意しておいてください(形式はJPEG、GIF、PNGのいずれかをご用意ください)。

SITE PUBLIS に画像を載せるにはいくつかの方法がありますが、ここでは「ライブラリ」という機能を使ったやり方を見ていきます。「ライブラリ」とは、画像などを貯めておく倉庫のような場所です。いったんライブラリに画像を置き、次に通常ブロックでライブラリの画像を読み込む、という手順を踏みます。

ライブラリに画像をアップロードする

ライブラリの中をのぞいてみましょう。編集画面上部のメガメニュー「編集」>「登録」>「ライブラリファイル」をクリックしてください。

img_insert01.png

クリックすると、「ライブラリファイル登録」のウインドウが開きます。

img_insert02.png

「ファイルの追加」のボタンを押すと、「ファイル追加」ウインドウが開きます。

img_insert03.png

「ファイルを選択」ボタンをクリックし、あなたの PC から画像を選択してください。ここでは「img_publis.png」という画像を選択しました。選択し終わったら、「保存」をクリックしてください。

img_insert04.png

「保存」をクリックすると、「ライブラリファイル登録」のウインドウに戻ります。「現在のフォルダ」に「img_publis.png」が追加されていることが確認できます。

img_insert05.png

ファイル名をクリックすると、右側に画像がプレビュー表示されます。

「閉じる」ボタンを押すことで、ライブラリへの画像の登録は完了です。

ライブラリに置いたファイルは、URLが分かれば一般のウェブ閲覧者が閲覧できてしまいます。 閲覧されても問題の無いファイルを使用してください。

通常ブロックに画像を追加する

通常ブロックに戻って、メニューバー内「画像の挿入・編集」html_006.gif をクリックします。

img_insert06.png

「画像選択」の画面が開きます。

img_insert07.png

上の画像の赤枠で囲まれている「サーバーのライブラリから選択」を選択し、画像のファイル名 img_publis.png をクリックし、「保存」をクリックすると、通常ブロックに画像が追加されます。

img_insert08.png

画像の大きさが大きすぎる・小さすぎるという場合には、調整しましょう。画像をクリックすると青く反転し、選択されます。この状態でマウスのカーソルを画像の右下隅に移動すると、カーソルのアイコンが両方向矢印に変化します。

img_insert09.png

そのまま左上方向にドラッグすると、画像を縮小することができます。

img_insert10.png

画像の縮小ができました。

img_insert11.png

 

ここで紹介した画像の大きさの調整方法は、画像の「見た目の大きさ」を変更するものであり、画像の「実体サイズ」を変更するものではありません。実体サイズを変えずに見た目の大きさを変更することには、次のような問題があります。

  • サイズが小さな画像を登録して、見た目の大きさを大きくした場合、画質が粗く見える
  • サイズが極端に大きな画像を登録して、見た目の大きさを縮小して表示している場合、画像の読み込みに時間がかかるように感じられる
  • 見た目の大きさの変更は、実際には閲覧者側のブラウザが行うため、閲覧者の環境に処理負荷がかかる

上記の問題は、ファイルの実体サイズを予め調整しておき、見た目の大きさの変更をしないことで避けることができます。実体サイズの変更は、次の方法で行えます。

  • 画像編集ソフトで実体サイズを変更し、保存する
  • SITE PUBLIS に画像を登録する際、「画像サイズを変換する」で実体サイズを変更する

チャレンジ!

「ライブラリ」内は、フォルダを作成することができます。フォルダを1つ作成し、フォルダ内に画像を保存してみてください。なお、作成したフォルダの中に入るには、フォルダ名をダブルクリックします。

PAGE TOP

© 2017 SITE PUBLIS CO.,Ltd All rights reserved.

このサイトはCMS SITE PUBLISを利用して構築・運営されています。

Copyright(C) 1998-2014, MICS Network Inc. All rights reserved.

このサイトはCMS SITE PUBLISを利用して構築・運営されています。