メイクショップ　スマートフォンCSS設定の件

Question

前回、メイクショップのスマートフォン用トップページの、「TREND ITEM」
の画像3個並びを2個にするのを教えて頂きましたが、
2個並びにはなっているのですが、
2個並びのあとが1個になってしまって、どうしていいか判りません。
2個、1個、2個、1個になってしまいます。
宜しくお願い致します。
HP https://jolielle.jp/

※元々のメイクショップのTREND ITEMの表示は、
3個並びを何列にするかの設定になっております。

Answer

ECマスターズの田中です。

「NEW ITEM」部分のソースを確認したところ、
添付画像のように、
３商品ごとに異なるタグに属する書き方がされておりました。

ul・liタグによる段組みの利点は、
tableタグによるものと異なり、
途中の差込や削除などの編集がかんたんにできるところにあります。

今回のように、同じ意味を持つ区間内で区切りを作ってしまうと、
編集しやすくなるメリットがなくなってしまいますので、
可能であれば最後のも含め、
同じ意味を持つ区間内にて、一つのulタグに統一していただきますよう
お願いいたします。###HR######IMG086ecb3b6ffa92654acf488b137b858a8.pngIMG0######BR###

Answer

ご連絡ありがとうございます。

タグの件ですが、メイクショップの基本テンプレートで下記のタグが入っています。
NEW ITEMもTREND ITEMも商品登録時に設定したものが、
勝手に入力されるようになっています。



	



    




    NEWS
    
        
        
            
            
            
            
        
		
    



    
        NEW ITEM
        
    




    
        TREND ITEM
        
    








	
    	ITEM RANKING
        
            
            
            	  
                    
                    	
                    	
                    
                    
                    円
                
            
            
        

	





	
        REVIEW
		
	




    
        CATEGORY

Answer

ECマスターズの田中です。

ソースおよびメイクショップの仕組みを確認したところ、
新商品は必ず横３個で表示する仕組みになっていることがわかりました。
https://ms-manual.makeshop.jp/s_shopsetting/

どうしても横２個で表示させたい場合は、
JavaScriptを利用して、liタグを最初のulタグ内に集めてしまう、
という方法がございます。

下記タグをページ内に記載、もしくは
タグの中身を既存のタグや外部JSファイルに組み込んでいただきますよう
お願いします。

$(function(){
$('section.indexSection.indexNew ul:nth-of-type(n+2) > li').each(function(){
 $(this).appendTo('section.indexSection.indexNew ul:first-of-type');
});
});

Answer

ご連絡ありがとうございます。
修正できました。
ありがとうございました。

メイクショップ スマートフォンCSS設定の件

メイクショップ　スマートフォンCSS設定の件