操作マニュアル

画像やPDFなど各種ファイルの管理

画像やPDFなど、各種ファイルは“サーバーブラウザ”で管理しており、サイトで使用する画像や各種ファイルは、このサーバーブラウザにアップロードする必要があります。

アップできる拡張子とサイズの上限

画像
拡張子 3fr、ai、arw、bmp、cr2、crw、dcs、dcr、dng、eps、erf、gif、heic、jpg、jpeg、kdc、mef、mos、mrw、nef、nrw、orf、pef、png、psd、r3d、raf、rw2、rwl、sketch、sr2、xd、svg、svgz、tif、tiff、x3f、3gp、3gpp、3gpp2、asf、avi、dv、flv、m2t、m4v、mkv、mov、mp4、mpeg、mpg、mts、oggtheora、ogv、rm、ts、vob、webm、wmv、swf、jpg、gif、jpeg、png、tiff、tif、swf、fla、flv、zip、txt
上限 32MB
ファイル
拡張子 csv、doc、csv、doc、docm、docx、ods、odt、otf、pdf、ps、rtf、ttf、xls、xlsm、xlsx、odp、pps、ppsm、ppsx、ppt、pptm、pptx、3fr、ai、arw、bmp、cr2、crw、dcs、dcr、dng、eps、erf、gif、heic、jpg、jpeg、kdc、mef、mos、mrw、nef、nrw、orf、pef、png、psd、r3d、raf、rw2、rwl、sketch、sr2、xd、svg、svgz、tif、tiff、x3f、3gp、3gpp、3gpp2、asf、avi、dv、flv、m2t、m4v、mkv、mov、mp4、mpeg、mpg、mts、oggtheora、ogv、rm、ts、vob、webm、wmv、swf、aac、m4a、mp3、oga、wav、as、as3、asm、cpp、cs、css、cxx、diff、erb、erl、groovy、gvy、h、haml、hh、hxx、js、json、jsx、less、lst、markdown、md、mdown、mkdn、ml、mm、out、plist、properties、sass、scm、script、scss、sml、sql、txt、vb、vi、vim、xhtml、xml、xsd、xsl、yaml、yml、htm、html、lzh、zip、tar、gz、7z、rar
上限 32MB

※index.htmlという名称のファイルにつきましては、プログラムの仕様上、再構築時にファイルが削除されます。
別の名称にリネームしていただくか、拡張子を.htmに変更してアップしてください。

サーバーブラウザの操作

  1. コントロールパネルの[editor][素材][画像]もしくは[ファイル]をクリックします。
  2. サーバーブラウザが別ウィンドウ、もしくは別タブで立ち上がります。

    項目 機能
    (a)
    ファイルタイプ 画像のサーバーブラウザが立ち上がると「Image」、ファイルのサーバーブラウザが立ち上がると「File」と表示されます。
    (b)
    並び替え 選択した並び替え順に並び替えします。
    【選択肢】名前順、日付順、サイズ順
    素材 素材サイトへのリンクが立ち上がり、素材サイトを選択することができます。
    【選択肢】pixabay、Unsplash、fotolia
    ※無料素材サイト「pixabay」「Unsplash」は直接ダウンロードすることができます。
    →素材サイトからの直接ダウンロードする方法
    最適化チェック 表示されているフォルダ内の画像(JPEG形式、PNG形式、GIF形式)を最適化(ロスレス圧縮)します。
    (c)
    クリックすると上の階層を表示します。
    (フォルダ表示) 現在のフォルダ内のフォルダリストを表示します。フォルダ名をクリックすると、そのフォルダ内の画像やファイル、フォルダを表示します。
    フォルダの新規作成 フォルダを作成することができます。先に各ページごとのフォルダを作成し、そのフォルダの中に画像やファイルをアップロードすると、管理がしやすくなります。
    (詳しくは下記の「フォルダの新規作成」をご確認ください。)
    (d)
    (フォルダ階層) 現在のフォルダ階層を表示します。
    フォルダおよびファイルのメニューを展開/縮小します。
    該当する画像やファイル、およびフォルダの名称を変更します。ファイル名およびフォルダ名は必ず半角英数字にする必要があります。
    該当する画像やファイルの説明を変更します。
    ※ファイルの説明はサーバーブラウザのサムネイル表示の下部に表示されます。未入力の場合は「無題」と表示されます。
    ※画像のコンテンツパーツにはalt属性として表示されます。
    該当する画像やファイルのサイズを変更できます。画像のアップロードサイズを任意に変更できます。(元の画像ファイルは変更されません。)
    ※ファイル用のサーバーブラウザには表示されません。
    ・縦横比固定アイコン(
    縦横比固定になっている場合は、横か縦どちらかの数値を変更すると、縦横比を維持してもう一方の数値が拡大、もしくは縮小されます。
    ・縦横比解除アイコン(
    縦横比解除になっている場合は、横と縦の幅を自由に入力することができます。
    ・画質

    JPEG形式の画像の画質を現在の画質(100%)から低画質(80%)まで下げることができます。
    ※変更前の画質100%に対して画質を下げるため、下げた画質を上げることはできません。
    ※JPEG形式以外の画像には表示されません。
    無料オンラインサービスの編集ソフト『PicMonkey』が立ち上がり、該当する画像を編集することができます。
    ※ファイル用のサーバーブラウザには表示されません。
    無料オンラインサービスの編集ソフト『Pixlr』が立ち上がり、該当する画像を編集することができます。
    ※ファイル用のサーバーブラウザには表示されません。
    [ダウンロード]ボタンです。該当する画像やファイル、およびフォルダをダウンロードします。
    ※フォルダの場合、ZIP形式でダウンロードされます。
    [削除]ボタンです。該当するフォルダや画像、およびファイルを削除します。
    [ファイルの回転]ボタンです。該当する画像を時計回りに90度回転します。
    (e)
    使用状況モード 全ファイルの使用状況を確認します。クリックすると公開サイトおよび編集サイトのいずれかに使用されている画像およびファイルをチェックし、使用されている場合はファイル表示の右上にと表示します。
    アップロード ファイルを選択し、アップロードします。
    (詳しくは下記の「サーバーブラウザへのアップロード」をご確認ください。)
    横: px 縦: px 画像のアップロードサイズを任意に変更できます。(元の画像ファイルは変更されません。)
    鍵アイコンが(縦横比固定)になっている場合、横か縦どちらかの数値を変更すると、縦横比を維持してもう一方の数値が拡大、もしくは縮小されます。鍵アイコンが(縦横比解除)になっている場合は、横と縦の幅を自由に入力することができます。
    ※ファイル用のサーバーブラウザには表示されません。
    [縦横比]ボタンです。アップロードする画像の縦横比の固定と解除を選択できます。クリックで画像の縦横比の固定、解除を設定できます。
    ※ファイル用のサーバーブラウザには表示されません。
    画像のサイズをオリジナルに戻します。横幅等の数値を変更した後で、元のサイズのままアップロードしたい場合はここをクリックすると、数値がオリジナルのものに戻ります。
    ※ファイル用のサーバーブラウザには表示されません。
    大きい画像は自動縮小する ここにチェックが入っていると、アップロードする元画像のサイズが縦横どちらかが1280pxを超える場合、縦横比を固定したまま1280px以内に自動縮小されます。チェックを外すと自動縮小されなくなります。
    ※ファイル用のサーバーブラウザには表示されません。

サーバーブラウザへのアップロード

使いたい画像やファイルはあらかじめパソコンに保存しておきます。この時、ファイル名は必ず半角英数字のものをご用意ください。

  1. 上記の1~2と同じ方法で“サーバーブラウザ”を立ち上げます。
  2. 画像、もしくはファイルをアップロードしたいフォルダを開きます。
    (フォルダの新規作成方法に関しては、下記の「フォルダの新規作成」をご確認ください。)
  3. [ファイルを選択]ボタンをクリックします。
  4. お使いのパソコンから使いたい画像、もしくはファイルを選択し、[開く]ボタンをクリックします。
  5. 横・縦のサイズ等を確認して、[アップロード]ボタンをクリックします。
  6. 選択した画像がサーバーブラウザに表示されます。
その他のアップロード方法(一部のブラウザには対応していません)
ドラッグ&ドロップ

ローカルフォルダからサーバーブラウザへ、またはウェブサイトからサーバーブラウザへ目的の画像をドラッグ&ドロップするだけで簡単にアップロードすることができます。複数枚の画像を一度にアップすることも可能です。
※縦横のサイズが大きい画像は「大きい画像は縮小する」にチェックを入れると自動縮小され、チェックを外すと自動縮小されずにアップロードされます。

フォルダの新規作成

ホームページを更新していくと、サーバーブラウザには多くの画像やファイルがアップロードされ、管理や作業が大変になってきます。そのため、各ページのフォルダを作成して、その中に画像やファイルをアップロードするなど、前もって一定のルールを決めておくと、管理や作業ががしやすくなります。

  1. 上記の1~2と同じ方法で“サーバーブラウザ”を立ち上げます。
  2. [フォルダの新規作成]ボタンをクリックします。
  3. フォルダ名を入力します。フォルダ名は必ず半角英数字で入力してください。
  4. [OK]ボタンを押して作成完了です。

※フォルダの中にフォルダを作成することも可能です。

アップロードしたファイルの移動

ファイルをドラッグすると、アップロードしたファイルを別のフォルダや階層に移動することができます。
※移動できるのはファイルのみになります。フォルダを移動することはできません。
※サイト内で移動したファイルが挿入されていたり、リンクが貼られている場合はリンク切れが発生しますのでご注意ください。

  1. ファイルを移動したいフォルダまでドラッグします。
  2. マウスをはなすとメッセージが表示されますので、内容を確認して[OK]を押します。

アップロードしたファイルを並び替える

アップロードしたファイルを、そのフォルダの中で「名前順」「日付順」「サイズ順」のいずれかに並び替えることができます。なお、並び替えは「日付順」「サイズ順」は昇順、「日付順」は降順となり、フォルダは対象外となっています。

コンテンツでアップロードした画像やファイルを使用する

各編集方法をご確認ください。

ページの先頭へ