10 July WCEX Mobile トップページの新着ボックスを複数設置する welcart 有料拡張プラグインWCEX Mobileで、トップページにあるスライドボックスを さらに増やしたいときのやり方。 「再入荷商品」として新たに設置したい。 前提条件:再入荷商品のカテゴリーを作成し、商品を登録しておく 1、新着商品<div id="home_new">のdivを丸ごとコピーして表示させたい場所に置く。 2、コピーした <div id="home_new"> のid名を変更→ <div id="sainyuka"> 3、コピーした <div id="home_new"> 内の <span><a href="<?php wcmb_get_category_link_by_slug( 'itemnew' ); ?>"><?php _e('list', 'usces'); ?> »</a></span> のスラッグ名を再入荷商品のスラッグ名に変更 <?php $reco_ob = new wp_query(array('category_name'=>'itemnew', 'posts_per_page'=>12, 'post_status'=>'publish')); ?> のカテゴリー名を再入荷商品のカテゴリー名に変更変更 4、style.css内を「home_new」で検索して、出てきた箇所全てに「sainyuka」も加える これで見た目は完成。 しかし次へ前へのボタンをおしてもスライドしない! Rotoというjqueryを使って動いていました。 これの設定の仕方は非常に簡単なのでありがたいです。 http://www.skuare.net/2011/09/roto.html 5、コピーした <div id="home_new"> 内の <div id="listbox" class="roto"> の id名を変更します→ <div id="listbox2" class="roto"> 6、コピーした <div id="home_new"> 内の <button id="listbox-prev"><button id="listbox-next"> の id名を先ほど変更したid名と同じにします → <button id="listbox2-prev"><button id="listbox2-next"> 7、footer.phpを開き、</body>直前にあるScriptに $("#listbox2").roto({ direction: "v" }); と書き足します。 完成です! おすすめ商品のほうのスライドボックスを増やしたいときは、<div id="home_recommend"> のdivをコピペして上記と同じことをしてください。スライドのScriptは、おすすめ商品で 使われているid名のものをコピペしてid名を変えてください。 縦スライド、横スライドで指定の仕方が違います。 コピペ元→ $("#carousel").roto({ snap: false }); PR