Poziomy widok produktów w koszyku

cleim_3103 · January 6, 2015

Witam,

Mam pytanie, bądź prośbę. Czy możecie mi powiedzieć, czy istnieje możliwość w prestashop 1.6 zrobić ułożenie produktów w pzoiomie, a nie w pionie. Standardowo jest tak, że jeżeli dodamy dwa produkty, to układają nam sie w koszyku(w opcji jedej strony składania zamówienia) jeden pod drugim co obrazuje mniej więcej załącznik nr 1. A ja bym chciał aby te produktu układały sie jeden obok drugiego(załącznik nr 2). Czy możecie mi pomóc w takim rozwiązaniu? Możecie mi powiedzieć jak mam to rozwiązać, gdzie szukać, odpowiem na wszystkie pytania. Czy takie coś jest w ogóle możliwe? Proszę o pomoc!!!

vekia · January 7, 2015

jest to możliwe jednak wymaga zmian w kodzie szablonu,

pytanie jeszcze czym jest koszyk

czy koszyk to element wyświetlający się na każdej stronie jako element do którego "lecą" produkty

czy strona składania zamówienia, krok "koszyka"

cleim_3103 · January 7, 2015

dziękuje za szybką odpowiedź. zapomniałem dodać, że jest to standardowy szablon prestashop 1.6 - bootstrap. Koszyk w sensie mam kilka produktów, następnie klikam dodaj do koszyka i przechodzę do realizacji zamówienia - przykładowy wygląd poniżej.(tylko, ze w załączniku jest opcja zamówienia - 5 kroków, a ja mam na jednej stornie). Możesz mi powiedzieć, gdzie mam to zmienic, bo jestem całkiem zielony w tej sprawie.

endriu107 · January 7, 2015

A co w momencie jak ktoś wsadzi tyle produktów że się nie pomieszczą w pionowych kolumnach? Plik to shopping-cart-product-line.tpl

cleim_3103 · January 7, 2015

Ale dlaczego w pionowych kolumnach? Potrzebowałbym takie coś aby użytkownik dodał 3 produkty i przechodzi do następnej linii. Coś takiego jak produkty są wyświetlane w kategoria. Przykład screen. Chodzi tylko o to, żeby produkty dodane do koszyka tak były ułożone. Do tej pory mam tak, że są one tak ułożone w css, ale schodzą jeden pod drugi.

endriu107 · January 7, 2015

Spoko źle zrozumiałem, zapewne przez ten obrazek co narysowałeś jako kolumny i tak to sobie z wizualizowałem

cleim_3103 · January 7, 2015

I jest szansa coś z tego zrobić?

design4VIP · January 7, 2015

nie pamietam jak jest tworzona linia produktow, ale wydaje mi sie, ze po <li> sytarczy w CSS dac temu blokowi stala szerokosc, czy po bootstrampie np. col-sm-4 (to juz w .tpl), zadac mu w stylu float:left; i zostaje tylko ostylowanie poszczegolnych elementow wewnatrz bloku. tak czy tak wymaga to dosc sporej wiedzy, przede wszystkim w stylach. (chociaz ja bym sie pokusil o ustawienia w samym bootstramp ze wzgledu na responsywnosc tych elementow)

cleim_3103 · January 7, 2015

Produkty w koszyku ustawiają się w <table> a każdy kolejny inny produkt dodany do koszyka jest kontynuacją w jednej tabeli i ewentualne znaczniki to <tr>. Wszystko jest zapętlone dlatego znaczniki tak samo się nazywają. Tak więc ciężko żeby to w stylach opisać, bo jak jedno opisze, to zaraz drugi produkt pod spodem się przemieszcza.

endriu107 · January 7, 2015

Tutaj masz częściowo zrobione teraz wystarczy przenieść opis poszczególnych elementów i ostylować wygląd na jakieś 20 minut roboty

{*
* 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 [email protected] 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 <[email protected]>
*  @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
*}
<div class="col-md-3" id="product_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}{if !empty($product.gift)}_gift{/if}" class="cart_item{if isset($productLast) && $productLast && (!isset($ignoreProductLast) || !$ignoreProductLast)} last_item{/if}{if isset($productFirst) && $productFirst} first_item{/if}{if isset($customizedDatas.$productId.$productAttributeId) AND $quantityDisplayed == 0} alternate_item{/if} address_{$product.id_address_delivery|intval} {if $odd}odd{else}even{/if}">
	<p class="cart_product">
		<a href="{$link->getProductLink($product.id_product, $product.link_rewrite, $product.category, null, null, $product.id_shop, $product.id_product_attribute)|escape:'html':'UTF-8'}"><img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'small_default')|escape:'html':'UTF-8'}" alt="{$product.name|escape:'html':'UTF-8'}" {if isset($smallSize)}width="{$smallSize.width}" height="{$smallSize.height}" {/if} /></a>
	</p>
	<p class="cart_description">
    <p class="cart_product first_item">{l s='Produkt:'}</p>
		<p class="product-name"><a href="{$link->getProductLink($product.id_product, $product.link_rewrite, $product.category, null, null, $product.id_shop, $product.id_product_attribute)|escape:'html':'UTF-8'}">{$product.name|escape:'html':'UTF-8'}</a></p>
        {if $product.reference}<small class="cart_ref">{l s='SKU'} : {$product.reference|escape:'html':'UTF-8'}</small>{/if}
		{if isset($product.attributes) && $product.attributes}<small><a href="{$link->getProductLink($product.id_product, $product.link_rewrite, $product.category, null, null, $product.id_shop, $product.id_product_attribute)|escape:'html':'UTF-8'}">{$product.attributes|escape:'html':'UTF-8'}</a></small>{/if}
	</p>
	{if $PS_STOCK_MANAGEMENT}
		<p class="cart_avail"><span class="{if $product.quantity_available <= 0 && !$product.allow_oosp}label label-available_later{else}label label-success{/if}">{if $product.quantity_available <= 0}{if $product.allow_oosp}{if isset($product.available_later) && $product.available_later}{$product.available_later}{else}{l s='In Stock'}{/if}{else}{l s='Out of stock'}{/if}{else}{if isset($product.available_now) && $product.available_now}{$product.available_now}{else}{l s='In Stock'}{/if}{/if}</span>{hook h="displayProductDeliveryTime" product=$product}</p>
	{/if}
	<p class="cart_unit" data-title="{l s='Unit price'}">
		<span class="price" id="product_price_{$product.id_product}_{$product.id_product_attribute}{if $quantityDisplayed > 0}_nocustom{/if}_{$product.id_address_delivery|intval}{if !empty($product.gift)}_gift{/if}">
			{if !empty($product.gift)}
				<span class="gift-icon">{l s='Gift!'}</span>
			{else}
            	{if !$priceDisplay}
					<span class="price{if isset($product.is_discounted) && $product.is_discounted} special-price{/if}">{l s='Cena: '} {convertPrice price=$product.price_wt}</span>
				{else}
               	 	<span class="price{if isset($product.is_discounted) && $product.is_discounted} special-price{/if}">{l s='Cena: '} {convertPrice price=$product.price}</span>
				{/if}
				{if isset($product.is_discounted) && $product.is_discounted}
                	<span class="price-percent-reduction small">
            			{if !$priceDisplay}
            				{if isset($product.reduction_type) && $product.reduction_type == 'amount'}
                    			{assign var='priceReduction' value=($product.price_wt - $product.price_without_specific_price)}
                    			{assign var='symbol' value=$currency->sign}
                    		{else}
                    			{assign var='priceReduction' value=(($product.price_without_specific_price - $product.price_wt)/$product.price_without_specific_price) * 100 * -1}
                    			{assign var='symbol' value='%'}
                    		{/if}
						{else}
							{if isset($product.reduction_type) && $product.reduction_type == 'amount'}
								{assign var='priceReduction' value=($product.price - $product.price_without_specific_price)}
								{assign var='symbol' value=$currency->sign}
                    		{else}
                    			{assign var='priceReduction' value=(($product.price_without_specific_price - $product.price)/$product.price_without_specific_price) * 100 * -1}
                    			{assign var='symbol' value='%'}
                    		{/if}
						{/if}
						{if $symbol == '%'}
							 {$priceReduction|round|string_format:"%d"}{$symbol} 
						{else}
							 {$priceReduction|string_format:"%.2f"}{$symbol} 
						{/if}
                    </span>
					<span class="old-price">{convertPrice price=$product.price_without_specific_price}</span>
				{/if}
			{/if}
		</span>
	</p>

	<p class="cart_quantity">
		{if isset($cannotModify) AND $cannotModify == 1}
			<span>
				{if $quantityDisplayed == 0 AND isset($customizedDatas.$productId.$productAttributeId)}
					{l s='Ilość: '} {$product.customizationQuantityTotal}
				{else}
					{l s='Ilość: '} {$product.cart_quantity-$quantityDisplayed}
				{/if}
			</span>
		{else}
			{if isset($customizedDatas.$productId.$productAttributeId) AND $quantityDisplayed == 0}
				<span id="cart_quantity_custom_{$product.id_product}_{$product.id_product_attribute}_{$product.id_address_delivery|intval}" >{$product.customizationQuantityTotal}</span>
			{/if}
			{if !isset($customizedDatas.$productId.$productAttributeId) OR $quantityDisplayed > 0}

				<input type="hidden" value="{if $quantityDisplayed == 0 AND isset($customizedDatas.$productId.$productAttributeId)}{$customizedDatas.$productId.$productAttributeId|@count}{else}{$product.cart_quantity-$quantityDisplayed}{/if}" name="quantity_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}_hidden" />
				<input size="2" type="text" autocomplete="off" class="cart_quantity_input form-control grey" value="{if $quantityDisplayed == 0 AND isset($customizedDatas.$productId.$productAttributeId)}{$customizedDatas.$productId.$productAttributeId|@count}{else}{$product.cart_quantity-$quantityDisplayed}{/if}"  name="quantity_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}" />
				<div class="cart_quantity_button clearfix">
				{if $product.minimal_quantity < ($product.cart_quantity-$quantityDisplayed) OR $product.minimal_quantity <= 1}
					<a rel="nofollow" class="cart_quantity_down btn btn-default button-minus" id="cart_quantity_down_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}" href="{$link->getPageLink('cart', true, NULL, "add=1&id_product={$product.id_product|intval}&ipa={$product.id_product_attribute|intval}&id_address_delivery={$product.id_address_delivery|intval}&op=down&token={$token_cart}")|escape:'html':'UTF-8'}" title="{l s='Subtract'}">
				<span><i class="icon-minus"></i></span>
				</a>
				{else}
					<a class="cart_quantity_down btn btn-default button-minus disabled" href="#" id="cart_quantity_down_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}" title="{l s='You must purchase a minimum of %d of this product.' sprintf=$product.minimal_quantity}">
					<span><i class="icon-minus"></i></span>
				</a>
				{/if}
                	<a rel="nofollow" class="cart_quantity_up btn btn-default button-plus" id="cart_quantity_up_{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}" href="{$link->getPageLink('cart', true, NULL, "add=1&id_product={$product.id_product|intval}&ipa={$product.id_product_attribute|intval}&id_address_delivery={$product.id_address_delivery|intval}&token={$token_cart}")|escape:'html':'UTF-8'}" title="{l s='Add'}"><span><i class="icon-plus"></i></span></a>
				</div>
			{/if}
		{/if}
	</p>
	<p class="cart_total" data-title="{l s='Total'}">
		<span class="price" id="total_product_price_{$product.id_product}_{$product.id_product_attribute}{if $quantityDisplayed > 0}_nocustom{/if}_{$product.id_address_delivery|intval}{if !empty($product.gift)}_gift{/if}">
			{if !empty($product.gift)}
				<span class="gift-icon">{l s='Gift!'}</span>
			{else}
				{if $quantityDisplayed == 0 AND isset($customizedDatas.$productId.$productAttributeId)}
					{if !$priceDisplay}{l s='Łącznie: '} {displayPrice price=$product.total_customization_wt}{else}{l s='Łącznie: '} {displayPrice price=$product.total_customization}{/if}
				{else}
					{if !$priceDisplay}{l s='Łącznie: '} {displayPrice price=$product.total_wt}{else}{l s='Łącznie: '} {displayPrice price=$product.total}{/if}
				{/if}
			{/if}
		</span>
	</p>
	{if !isset($noDeleteButton) || !$noDeleteButton}
		<p class="cart_delete text-center" data-title="Delete">
		{if (!isset($customizedDatas.$productId.$productAttributeId) OR $quantityDisplayed > 0) && empty($product.gift)}
			<div>
				<a rel="nofollow" title="{l s='Delete'}" class="cart_quantity_delete" id="{$product.id_product}_{$product.id_product_attribute}_{if $quantityDisplayed > 0}nocustom{else}0{/if}_{$product.id_address_delivery|intval}" href="{$link->getPageLink('cart', true, NULL, "delete=1&id_product={$product.id_product|intval}&ipa={$product.id_product_attribute|intval}&id_address_delivery={$product.id_address_delivery|intval}&token={$token_cart}")|escape:'html':'UTF-8'}"><i class="icon-trash"></i></a>
			</div>
		{else}

		{/if}
		</p>
	{/if}
</div>

Edited January 7, 2015 by endriu107 (see edit history)

endriu107 · January 7, 2015

Zaktualizowałem powyższy kod dodatkowo podpowiem że musisz edytować order-payment.tpl, linie 52 - 63 do usunięcia i pozostała Ci zabawa z poprawą wyglądu ewentualnie poprawki w powyższym kodzie

Tak to wygląda przy większej ilości produktów:

Wystarczy dodać tło i będzie ok.

Edited January 7, 2015 by endriu107 (see edit history)

cleim_3103 · January 7, 2015

Dziękuje mistrzu, o to mi chodziło!!!!

cleim_3103 · January 8, 2015

a wiecie może Panowie jak zrobić, żeby po zalogowaniu przenosiło mnie na stronę główną, a nie do ustawień konta?

Poziomy widok produktów w koszyku

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in