GALLERYの編集方法
ご注意:こちらはテンプレート編集(上級者モード)のご案内になります。
GALLERYではスライダー形式で画像を表示することができます。
差し替え手順
-
差替用の画像を作成し、画像ファイル管理からファイルをアップロードします。
サンプルサイトでは画像サイズが横400px 縦は400pxです。
[ショップ作成] → [画像ファイル管理]をクリックすると、画像ファイル管理がポップアップにて表示されます。
-
作成した画像を選択し[アップロード]ボタンをクリック。
-
ファイル確認から作成した画像をクリックするとプレビュー画像と画像URLが表示されます。
プレビュー画像が作成した差替用の画像である事を確認します。
1〜3を繰り返し、必要な分だけアップロードします。
-
アップロードが完了しましたら実際に差し替えていきます。
[ショップ作成] → [デザイン]から利用中のテンプレートの[テンプレート編集]をクリックします。
-
[トップ]の[HTML・CSS編集]をクリックします。
-
下記を変更します。変更箇所はページ内に1カ所
(ページ内検索にて「ギャラリー差し替え箇所」で探すと便利です。)
変更前:最初の1つを例にします。
<div class="p-gallery-list__item">
<img src="https://img.shop-pro.jp/tmpl_img/85/gallery-sample-01.jpg" alt="1枚目の画像説明文" />
</div>
変更後:画像ファイル管理から作成した画像をクリックします。画像URLが表示されますのでコピーし、差し替えたい箇所へペーストします。
<div class="p-gallery-list__item">
<img src="こちらに画像URLをペースト" alt="1枚目の画像説明文" />
</div>
画像URL、画像の説明文もそれぞれ記入します。
-
変更しましたら、[更新]ボタンをクリック。
-
サイトにアクセスして変更が反映されている事を確認します。