このパーツは、画像(イメージ)をページに設置することができます。
目次
完成イメージ
画像サイズについて
●1分割の場合
横1040px(ファイル形式 jpg、png)
●2分割の場合
横510px(ファイル形式 jpg、png)
●3分割の場合
横330px(ファイル形式 jpg、png)
●4分割の場合
横244px(ファイル形式 jpg、png)
画面内項目の説明
<画像設定前>
<画像設定後>
①画像設定
クリックすると下記のような画像選択画面が表示されます。
【アップロード済み画像】
⑧新しい画像をアップロード
ferret Oneではなくお使いのパソコン上に保存してある画像を選択してアップロードします。
⑨検索
画像名で検索できます。
⑩画像
過去にアップロードした画像を使用する場合は、表示されている中から選択できます。
クリックして画像を選択します。
⑪ALTテキスト
ALTテキストを設定できます。
※ALTについて
・音声ブラウザにおいて、どんな画像であるかを音声で伝えることができます
・検索エンジンの画像検索で検索対象になります
・サイト内検索で検索対象になります
SEOの観点でも登録したほうが有利といえます。
⑫画像名
画像名が表示されます。
⑬URL
画像のURLを表示します。クリックすると画像を表示します。
⑭ファイル形式
⑮ファイルサイズ
⑯登録日
⑰この画像をページに追加
クリックで選択中の画像を編集画面に追加します。
⑱この画像を削除
アップロードから削除します。
【PIXTA】
【選択中の画像】
選択中の画像を表示します。画像名を確認することができます。
⑲パーツから削除
パーツから削除することができます。
②リンク設定
リンク設定該当の画像をクリックした際のページ内の各見出し、サイト内の別ページ、外部サイトへのリンク設定ができます。
1.「リンク設定」・・・「設定しない」「サイト内のページ・ファイル」「このページの一番上に遷移」「外部サイト」の中からリンク先を選びます。
・サイト内のページ・ファイル・・・選択すると、サイト内に存在するページと「ライブラリ > ファイル」からアップロードしたファイルから選ぶことができます。(4.の中に一覧として並びます)
・このページの一番上に遷移・・・クリックするとページの一番上のエリアに戻ることができます。別ページへの遷移はありません。
・外部サイト・・・別サイトへリンクさせたい場合に選択します。
2.「リンクに設定しているURL」・・・1.で選択したリンクのURLが表示されます。
3.「別ウィンドウで開く」・・・リンク先のページを別ウィンドウ(別タブ)で開きたい場合に使用します。
4.「リンクに設定するページ/ファイルを選択してください」・・・ページ・ファイルの中から選択できます。スクロールもしくは「全て(プルダウン)」「名前」「URL」から検索して選択します。
5.「イベント設定」・・・イメージにイベントの設定をすることができます。
■イベント設定についての詳細はこちら
>イベントを設定・確認する方法
6.「新規作成」・・・クリックすると新規イベントの入力にリンクできます。
7.「CTAのクリックイベントとして計測」・・・キャンペーン設定時に利用します。イベント設定の中でも特に指標として追いかけたい場合に設定をオススメします。
8.「決定」・・・設定の最後に押します。
③画像の大きさ
- オリジナル
画像サイズ(ピクセル数)は変わりません。 - ラージ
画像サイズ(ピクセル数)が1024×1024になります。 - ノーマル
画像サイズ(ピクセル数)が600×600になります。 - サムネイル
画像サイズ(ピクセル数)が120×120になります。
サイズについては サーバー側でできるだけ適切なファイルサイズの画像を使用できるようにするために用意しています。
④レイアウト変更(角なし・角丸・円形)
⑤画像の表示サイズ(拡大・縮小・フィット)
⑥左揃え・中央揃え・右揃え
画像の画像の位置を調整できます。
⑦画像編集
画像の「切り抜き」「サイズ変更」「回転」をすることができます。
「切り抜き」
幅、高さの指定が可能です。プルダウンからも選択できます。
「サイズ変更」
画像パーツの画像編集メニュー(左上)より数値で設定が可能です。
サイズについてはピクセル数値を入力して、幅と高さを指定できます。
(サイズ単位はピクセル(px)のみとなります。)
サイズ変更は、制限があるのでご注意ください。
(幅 1100、高さ 600まで)
「回転」
設置する方法(動画)
画像はクリックして拡大表示することができます
※動画はベースデザインなしの画面になります
リンク設定の方法(動画)
画像はクリックして拡大表示することができます
※動画はベースデザインなしの画面になります
【内部リンクの設定の場合】
【外部リンクの設定の場合】
ベースデザインありとベースデザインなしの画面比較
ベースデザインなし | ベースデザインあり |
---|---|
パーツ / メディアパーツ |
単体パーツ / 画像 |
単体パーツ / デフォルト |
ベースデザインありのデザインバリエーション
アイコン | デザイン |
---|---|
関連記事
・360ビューファイルを「gif」「swf」「html5」で出力可能なのですが、これをHPに載せる方法を教えてください。
・スマートフォンの背景を別画像にする方法
・Q.画像の推奨サイズはどのぐらいですか?