futureshop FAQ

本サイトは、弊社サービス「futureshop」ご契約店舗様用のFAQサイトです。
お困り事やご不明点等ございましたら、お気軽にフューチャーショップサポートまでご連絡ください。

  • 電話でのお問合せ番号(平日10:00~17:00)
  • メールでのお問合せ
  • 文字サイズ変更
  • S
  • M
  • L
  • No : 2792
  • 公開日時 : 2017/10/28 17:37
  • 更新日時 : 2018/11/29 22:29
  • 印刷

画像ホスティングオプションを活用した、アパレルショップ向けリキッドレイアウト

回答

コマースクリエイター未利用店舗様専用の記事です

ウインドウの横幅に応じた商品一覧と商品詳細ページをCSSにて再現していただけます。
 
 

商品一覧ページの設定

以下のURLのページのように、ウインドウサイズに合わせて横幅いっぱいにサムネール画像を並べることが可能になります。
http://sample.future-shop.jp/fs/fs2sample/c/LF_auter


サンプルソース

サンプルソースを、オリジナルCSSに貼り付けてご利用ください。

 

.layout_menu{padding-left:10px;}
.layout_table{width:100%}
.groupLayout br{display:none;}
#FS2_itemlayout_IHL2{text-align:center; width:150px;}
.FS2_AdditionalImageEnlargementSsize_Button{text-align:right;}
	#FS2_itemlayout_IHL2.gl_Item{
	padding:10px;
	margin:3px;
	border:none;
	background:#f8f8f8;
}
.FS2_AdditionalImage_Balloon_Tip {
	width:120px;
	height:80px;
	text-align:left;
	background-image:none;
	background:#fff;
	border:1px solid #ccc;
}

 

商品詳細ページの設定

以下のURLのページのように、ウインドウサイズに合わせて横幅いっぱいにサムネール表示エリアを広げることができます。
http://sample.future-shop.jp/fs/fs2sample/LF_auter/gd37

※レイアウトスタイルの「画像ホスティング用パターン」で、「パターンIH1」を選択していただく必要があります。

 

 

 

サンプルソース

サンプルソースを、オリジナルCSSに貼り付けてご利用ください。

$fsJq(document).ready(
function(){
$fsJq('div.FS2_additional_image_itemdetail_container_right').insertAfter('div.FS2_additional_image_itemdetail_container_left');
$fsJq('div.FS2_additional_image_container').insertAfter('div.FS2_additional_image_btn_thumbnail_container');
$fsJq('div.FS2_additional_image_container').width($fsJq('#FS2_itemlayout_IH1').width()-$fsJq('.FS2_additional_image_btn_thumbnail_container').outerWidth(true));
$fsJq('div.FS2_additional_image_container').width($fsJq('div.FS2_additional_image_container').width()-(Number($fsJq('div.FS2_additional_image_container').css('padding-left').replace( /[^-0-9\s]+/g, '' ).split( /\s+/ ))+Number($fsJq('div.FS2_additional_image_container').css('padding-right').replace( /[^-0-9\s]+/g, '' ).split( /\s+/ ))));
});

スムーズに解決できなかった場合、記事改善のため解決できなかった理由をお聞かせください。

ご意見・ご感想をお寄せください お問い合わせを入力されましてもご返信はいたしかねます

フューチャーショップサポート

「虎の巻」でお悩みが解決できない場合や、ご不明点等がございましたらお気軽にご連絡ください。

  • お電話でのお問い合わせ(平日10:00~17:00)お電話でのお問い合わせ(平日10:00~17:30)
  • メールフォームをご利用くださいお問い合わせフォーム

※弊社サービスと類似した名称の通販サイトとの問い合わせ先間違いが増えております。
 弊社では通販サイトの運営は一切行っておりません。

ページ
トップへ