Jump to content

Help-Tạo Nhiều Dòng Sản Phẩm Cùng Danh Mục


Recommended Posts

Trong modun productscategory, mình muốn tạo nhiều dòng "Sản phẩm cùng danh mục-Products In The Same Category

" (Mặc định là 1 dòng) thì làm như thế nào? Mong được trợ giúp?

Ví dụ mình muốn chuyển thành 2 dòng như sau

 

XT3NAHW.jpg

Share this post


Link to post
Share on other sites

Hi,Paul Nguyen

Mình không biết code, bạn giúp giùm. File productscategory.js trong themes của mình nè, cần bỏ đoạn nào vậy bạn:

 

/*

 

* 2007-2014 PrestaShop

 

*

 

* NOTICE OF LICENSE

 

*

 

* This source file is subject to the Academic Free License (AFL 3.0)

 

* that is bundled with this package in the file LICENSE.txt.

 

* It is also available through the world-wide-web at this URL:

 

* http://opensource.org/licenses/afl-3.0.php

 

* If you did not receive a copy of the license and are unable to

 

* obtain it through the world-wide-web, please send an email

 

* to license@prestashop.com so we can send you a copy immediately.

 

*

 

* DISCLAIMER

 

*

 

* Do not edit or add to this file if you wish to upgrade PrestaShop to newer

 

* versions in the future. If you wish to customize PrestaShop for your

 

* needs please refer to http://www.prestashop.com for more information.

 

*

 

*  @author PrestaShop SA <contact@prestashop.com>

 

*  @copyright  2007-2014 PrestaShop SA

 

*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)

 

*  International Registered Trademark & Property of PrestaShop SA

 

*/

 

 

 

function pc_serialScrollFixLock(event, targeted, scrolled, items, position)

 

{

 

    var leftArrow = position == 0 ? true : false;

 

    var rightArrow = position + 4 >= $('#productscategory_list li:visible').length ? true : false;

 

    

 

    $('a#productscategory_scroll_left').css('cursor', leftArrow ? 'default' : 'pointer').fadeTo(0, leftArrow ? 0 : 1);        

 

    $('a#productscategory_scroll_right').css('cursor', rightArrow ? 'default' : 'pointer').fadeTo(0, rightArrow ? 0 : 1).css('display', rightArrow ? 'none' : 'block');

 

 

 

    return true;

 

}

 

function resizeProductitem() {

 

    var docWidth = $(document).width();

 

    if ( docWidth <= 480 ) {

 

        var docItemWidth = $('#productscategory_list').width();

 

        $('#productscategory_list_ul.product_list.grid li').css('width', docItemWidth);

 

    }else if ( docWidth <= 767 ) {

 

        var docItemWidth = Math.floor(($('#productscategory_list').width()-30)/2);

 

        $('#productscategory_list_ul.product_list.grid li').css('width', docItemWidth);

 

    }else if ( docWidth >= 768 ) {

 

        $('#productscategory_list_ul.product_list.grid li').removeAttr('style');

 

    }

 

}

 

$(document).ready(function()

 

{

 

    $('#productscategory_list').serialScroll({

 

        items: 'li',

 

        prev: 'a#productscategory_scroll_left',

 

        next: 'a#productscategory_scroll_right',

 

        axis: 'x',

 

        offset: 0,

 

        stop: true,

 

        onBefore: pc_serialScrollFixLock,

 

        duration: 400,

 

        step: 1,

 

        lazy: true,

 

        lock: false,

 

        force: false,

 

        cycle: true });

 

    $('#productscategory_list').trigger( 'goto', 0);

 

    $(window).load(resizeProductitem);

 

    $(window).resize(function(){

 

        resizeProductitem();

 

        $('#productscategory_list').trigger( 'goto', 0); }   

 

    );

 

    $(window).on( "orientationchange", function() {

 

        resizeProductitem();

 

     });

 

});

Share this post


Link to post
Share on other sites

Bạn dùng Prestashop version nào? 

sp thành 2 dòng nhưng vẫn muốn hiển thị kiểu slider như cũ hay chỉ cần list sp ra?

Nếu chỉ cần list sản phẩm ra thì comment toàn bộ JS lại là được.

Còn nếu vẫn muốn hiển thị dạng slider như cũ thì cần thay đổi tpl chút.

Bạn ko biết code nên chỉ hơi khó, nếu cần gửi link site mình view giúp.

  • Like 1

Share this post


Link to post
Share on other sites

:D bạn đang nhờ ng khác làm mà lại ngại là sao.

Mình xem link bạn gửi rồi nh bạn chưa trả lời câu hỏi trên mình hơi khó giúp:

"sp thành 2 dòng nhưng vẫn muốn hiển thị kiểu slider như cũ hay chỉ cần list sp ra?"

TH1: Nếu chỉ cần list sản phẩm ra thì comment toàn bộ JS lại là được. => bạn có thể tự làm

TH2: Còn nếu vẫn muốn hiển thị dạng slider như cũ thì cần thay đổi tpl chút. => cái này bạn ko biết code, cũng ko có link site bạn, ko có file .tpl thì ko ai giúp đc :D

 

  • Like 1

Share this post


Link to post
Share on other sites

Cảm ơn bạn, Mình muốn TH2 như bạn nói đó. Và file productscategory.tpl của mình

{if count($categoryProducts) > 0 && $categoryProducts !== false}

<section class="page-product-box blockproductscategory">

{*}<h3 class="productscategory_h3 page-product-heading">{$categoryProducts|@count} {l s='Other products in the same category:' mod='ovicproductscategory'}</h3>{*}

<h3 class="productscategory_h3 page-product-heading">{l s='Products In The Same Category' mod='productscategory'}</h3>

<div id="productscategory_list" class="clearfix">

{include file="$tpl_dir./product-list.tpl" products=$categoryProducts id='productscategory_list_ul'}

</div>

{if count($categoryProducts) > 4}<a id="productscategory_scroll_right" class="next_slide navigation_btn" title="{l s='Next' mod='ovicproductscategory'}" href="javascript:{ldelim}{rdelim}">{l s='Next' mod='ovicproductscategory'}</a>{/if}

{if count($categoryProducts) > 4}<a id="productscategory_scroll_left" class="prev_slide navigation_btn" title="{l s='Previous' mod='ovicproductscategory'}" href="javascript:{ldelim}{rdelim}">{l s='Previous' mod='ovicproductscategory'}</a>{/if}

</section>

{/if}

Share this post


Link to post
Share on other sites

{include file="$tpl_dir./product-list.tpl" products=$categoryProducts id='productscategory_list_ul'}

 

Ban tiep tuc can sua trong file /product-list.tpl, nhung sua file nay se anh huong den page category

  • Like 1

Share this post


Link to post
Share on other sites

"sp thành 2 dòng nhưng vẫn muốn hiển thị kiểu slider như cũ hay chỉ cần list sp ra?"

TH1: Nếu chỉ cần list sản phẩm ra thì comment toàn bộ JS lại là được. => bạn có thể tự làm

TH2: Còn nếu vẫn muốn hiển thị dạng slider như cũ thì cần thay đổi tpl chút. => cái này bạn ko biết code, cũng ko có link site bạn, ko có file .tpl thì ko ai giúp đc

 

Cảm ơn bạn, Mình muốn TH2 như bạn nói đó.

 

 

Hi,

Mình không hiểu là vừa muốn slider như cũ, vừa nhiều dòng tức là thế nào.

Hoặc là slider và 1 dòng.

Hoặc là không slider và nhiều dòng.

 

Bạn check lại xem nhu cầu thực sự của mình là gì nhé.

Thân!

  • Like 1

Share this post


Link to post
Share on other sites

Hi, mình muốn tạo: 3 sản phẩm cùng danh mục => hiển thị thành 1 dòng, 6 sản phẩm => 2 dòng và nếu lớn hơn 6 sản phẩm nó hiển thị dấu mũi tên "kế tiếp". ( Vì theo mặc định nó chỉ hiển thị sản phẩm trên 1 dòng và nếu lớn hơn 3 nó hiện mũi tên "kế tiếp"

Mong bạn giúp đở.

Share this post


Link to post
Share on other sites

Mình nghĩ, đây có thể là câu trả lời cho bạn:

http://stackoverflow.com/questions/22545466/how-can-i-create-a-carousel-with-multiple-rows

 

Tuy nhiên, nếu bạn không biết code thì xem ra cũng không đơn giản lắm.

Bạn nên thuê một ai đó làm giúp bạn. 

 

Bạn thử contact với bạn Kiên này xem sao:

https://www.prestashop.com/forums/user/305665-designworldinfo/

Share this post


Link to post
Share on other sites

Cảm ơn các bạn. Nếu mình biết code thì mình tự làm rùi.

 

Here's the relevant code for a 2x2 grid:

 

HTML

<div class="slider">

 

<!-- This will be considered one slide -->

<div>

<div class="grandchild">

<img src="" />

</div>

<div class="grandchild">

<img src="" />

</div>

 

<br class="clearboth">

 

<div class="grandchild">

<img src="" />

</div>

<div class="grandchild">

<img src="" />

</div>

</div>

 

<!-- The second slide -->

<div>

<div class="grandchild">

<img src="" />

</div>

...

</div>

</div>

 

CSS

.grandchild {

float: left;

}

.clearboth {

clear: both;

}

 

JS

 

$(document).ready(function() {

$('.slider').slick({

slidesToShow: 1,

slidesToScroll: 1

});

});

Mình xin hỏi 3 câu.

 

1. Để tạo 2 dòng như code trên mình phải chỉnh sửa đồng thời 3 file như trên phải phải không? hoặc một trong 3 file đó.

2. Hơn nữa đối với prestashop mình thấy file HTML nó nằm ở đâu?

3. Mình thấy file css của mình:

float: left;

 

clear: none!important;

Nhưng theo hướng dẫn.

.grandchild {

float: left;

}

.clearboth {

clear: both;

}

Vậy nó khác nhau chỗ nào?

Mong các bạn giúp đở.

Edited by thanhnga (see edit history)

Share this post


Link to post
Share on other sites

Ở PrestaShop, muốn tìm HTML, bạn phải tìm file có phần mở rộng là *.tpl.

Mình rất muốn giúp bạn ở đây, nhưng vì bạn chưa nắm được cách làm việc của PrestaShop thì thực sự là không biết giúp thế nào :)

 

Chúc bạn sớm giải quyết được vấn đề!

  • Like 1

Share this post


Link to post
Share on other sites

Rất cảm ơn bạn.

Đoạn: float: left;

}

.clearboth {

clear: both;

}

Mình thay both thành none thì sản phẩm sẽ hiển thị ra hết. Tuy nhiên, mình muốn hiển thị nếu sản phẩm lớn hơn 6 thì hiện dấu mũi tên. Như vậy nó liên quan đến code nào?

Vì mình không biết code nên cũng khó. Mong bạn gợi ý mình sẽ cố gắng tìm hiểu hoặc bạn gợi ý giùm code của prestashop.

Edited by thanhnga (see edit history)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More