Jump to content

Adaptation product-list


Recommended Posts

Bonjour à tous,

 

J'ai cherché à intégrer deux modules sur la colonne de gauche de la product-list,

 

Une fois fait, je me retrouve avec les modules au dessus, et non à gauche de la list.

 

J'ai tenté de corriger ça avec des margin et des float, cependant une fois fait les liens ne sont plus cliquables .

 

Auriez-vous une solution à ça ?

 

Voici le site : www.simplenet.fr

 

Merci pour l'aide ! :)

 

Link to comment
Share on other sites

Tout d'abord merci de ton aide, mais je dois avouer que je ne vois pas l'erreur,

 

J'avais deux </span> en trop, mais ce n'est pas suffisant,

 

Voici mon code product-list.tpl :

{if isset($products)}
	<!-- Products list -->
	<ul id="product_list" class="clear">
	{foreach from=$products item=product name=products}
		<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
 			<div class="left_block">
				{if isset($comparator_max_item) && $comparator_max_item}
					<p class="compare">
						<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} /> 
						<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
					</p>
				{/if}
			</div>
			<div class="center_block">
				<a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">
					<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
					{if isset($product.new) && $product.new == 1}<span class="new">{l s='New'}</span>{/if}
				</a>
				<h3><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</a></h3>
				<p class="product_desc">{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</p>
				<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='Product Detail'}">{l s='Détails'}</a>		
			</div>
			<div class="right_block">
				{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>
				{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Reduced price!'}</span>{/if}
				{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
				<div class="content_price">
					{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}{l s=' HT'}</span><br />{/if}
					{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}
				</div>
				{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Online only!'}</span>{/if}
				{/if}
				{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
					{if ($product.allow_oosp || $product.quantity > 0)}
						{if isset($static_token)}
							<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&id_product={$product.id_product|intval}&token={$static_token}", false)}" title="{l s='Add to cart'}">{l s='Add to cart'}</a>
						{else}
							<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&id_product={$product.id_product|intval}", false)} title="{l s='Add to cart'}">{l s='Add to cart'}</a>
						{/if}						
					{else}
						<span class="exclusive">{l s='Add to cart'}</span><br />
					{/if}
				{/if}				
			</div>
		</li>
	{/foreach}
	</ul>
	<!-- /Products list -->
{/if}
Edited by Dittrio (see edit history)
Link to comment
Share on other sites

Je ne vois pas d'erreur par contre dans celui-ci...

 

category.tpl :

{*
* 2007-2012 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-2012 PrestaShop SA
*  @version  Release: $Revision: 6844 $
*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*}

{include file="$tpl_dir./breadcrumb.tpl"}
{include file="$tpl_dir./errors.tpl"}

{if isset($category)}
	{if $category->id AND $category->active}
		<h1>
			{strip}
				{$category->name|escape:'htmlall':'UTF-8'}
				{if isset($categoryNameComplement)}
					{$categoryNameComplement|escape:'htmlall':'UTF-8'}
				{/if}
			{/strip}
		</h1>
		
		<!-- <div class="resumecat category-product-count">
			{include file="$tpl_dir./category-count.tpl"}
		</div> -->
		
		<!-- {if $scenes || $category->description || $category->id_image}
		<div class="content_scene_cat">
			{if $scenes}
				
				{include file="$tpl_dir./scenes.tpl" scenes=$scenes}
			{else}
				
				{if $category->id_image}
				<div class="align_center">
					<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />
				</div>
				{/if}
			{/if}

			{if $category->description}
				<div class="cat_desc">
				{if strlen($category->description) > 120}
					<p id="category_description_short">{$category->description|truncate:120}</p>
					<p id="category_description_full" style="display:none">{$category->description}</p>
					<a href="#" onclick="$('#category_description_short').hide(); $('#category_description_full').show(); $(this).hide(); return false;" class="lnk_more">{l s='More'}</a>
				{else}
					<p>{$category->description}</p>
				{/if}
				</div>
			{/if}
		</div> 
		{/if}
		{if isset($subcategories)}
		<!-- Subcategories 
		<!-- <div id="subcategories">
			<h3>{l s='Subcategories'}</h3>
			<ul class="inline_list">
			{foreach from=$subcategories item=subcategory}
				<li class="clearfix">
					<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}" class="img">
						{if $subcategory.id_image}
							<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium_default')}" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />
						{else}
							<img src="{$img_cat_dir}default-medium_default.jpg" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />
						{/if}
					</a>
					<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" class="cat_name">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>
					{if $subcategory.description}
						<p class="cat_desc">{$subcategory.description}</p>
					{/if}
				</li>
			{/foreach}
			</ul>
			<br class="clear"/>
		</div>
		{/if} -->

		{if $products}
			
				<div class="sortPagiBar clearfix">
					{include file="./product-sort.tpl"}
				</div>
			{include file="./product-list.tpl" products=$products}
			<div class="content_sortPagiBar clearfix">
				{include file="./pagination.tpl"}
			</div>
		{/if}
	{elseif $category->id}
		<p class="warning">{l s='This category is currently unavailable.'}</p>
	{/if}
{/if}

Link to comment
Share on other sites

Coucou

 

celui la aussi est bon on va remonter plus haut dans le header.tpl tu doit avoir a la fin

<div id="center_column" class="center_column col-xs-12 col-sm-{12 - $left_column_size - $right_column_size}">
{/if}

sans de </div> pour la center column

 

@++

 

Loulolu66

Link to comment
Share on other sites

<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div id="columns" class="{$tpl_params->column_layout} grid_9 alpha omega clearfix {if $page_name =='index'}ot-index{else}ot-subpage{/if}"  >
				<!-- Left -->
				{if $tpl_params->column_layout != "contentRight"}
					<div id="left_column" class="column grid_2 alpha" >
						{$HOOK_LEFT_COLUMN}
					</div>
				{/if}				
				<!-- Center -->
				<div id="center_column" class=" grid_5"></div>
				
				<!-- Right -->
				{if $page_name = 'index'}
				<div id="right_column" class="column grid_2 omega">
					{$HOOK_RIGHT_COLUMN}
				</div>
				{/if}
				<!-- Right -->
				
				{if $page_name != 'index'} 
					</section>
				{/if}
	{/if}

Non la div est bien fermé, cependant je n'ai pas la même classe. Logiquement ça ne doit pas venir de ça, c'est influer par le thème non ?

Link to comment
Share on other sites

coucou

 

 donc oui le thème que tu utilises n'as pas un bon header d’après ce que tu as poster en #7 normalement le header comprend: 

 

le header+ le colonne de gauche +le début  de la colonne centrale

ensuite selon les pages s'affiche les différent tpl

puis on a le footer qui comprend la fin de la colonne centrale + la colonne de droite + le footer

 

regardes le thème par défaut  

 

@++ 

 

Loulou66

Link to comment
Share on other sites

Voici mon header.tpl :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{$lang_iso}">
	<head>
		<title>{$meta_title|escape:'htmlall':'UTF-8'}</title>
{if isset($meta_description) AND $meta_description}
		<meta name="description" content="{$meta_description|escape:html:'UTF-8'}" />
{/if}
{if isset($meta_keywords) AND $meta_keywords}
		<meta name="keywords" content="{$meta_keywords|escape:html:'UTF-8'}" />
{/if}
		<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
		<meta http-equiv="content-language" content="{$meta_language}" />
		<meta name="generator" content="PrestaShop" />
		<meta name="robots" content="{if isset($nobots)}no{/if}index,{if isset($nofollow) && $nofollow}no{/if}follow" />
		<link rel="icon" type="image/vnd.microsoft.icon" href="{$favicon_url}?{$img_update_time}" />
		<link rel="shortcut icon" type="image/x-icon" href="{$favicon_url}?{$img_update_time}" />
		<script type="text/javascript">
			var baseDir = '{$content_dir}';
			var baseUri = '{$base_uri}';
			var static_token = '{$static_token}';
			var token = '{$token}';
			var priceDisplayPrecision = {$priceDisplayPrecision*$currency->decimals};
			var priceDisplayMethod = {$priceDisplay};
			var roundMode = {$roundMode};
		</script>
{if isset($css_files)}
	{foreach from=$css_files key=css_uri item=media}
	<link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
	{/foreach}
{/if}
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
{if isset($js_files)}
	{foreach from=$js_files item=js_uri}
	<script type="text/javascript" src="{$js_uri}"></script>
	{/foreach}
{/if}
		{$HOOK_HEADER}
	</head>
	
	<body {if isset($page_name)}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if} class="{if $hide_left_column}hide-left-column{/if} {if $hide_right_column}hide-right-column{/if}">
	{if !$content_only}
		{if isset($restricted_country_mode) && $restricted_country_mode}
		<div id="restricted-country">
			<p>{l s='You cannot place a new order from your country.'} <span class="bold">{$geolocation_country}</span></p>
		</div>
		{/if}
		<div id="page" class="container_9 clearfix" {if $tpl_params->width}style="width:{$tpl_params->width}"{/if}>

			<!-- Header -->
			<div id="header" class="grid_9 alpha omega">
					<div id="top-header">
						{$HOOK_TOP}
					</div>
					<!-------logo-------->
					{if $page_name == "index"}
						<h1 class="Ot-logo">
							<a href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
								<span>{$shop_name|escape:'htmlall':'UTF-8'}</span>
							</a>
						</h1>
					{else}
						<h2 class="Ot-logo">
							<a href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
								<span>{$shop_name|escape:'htmlall':'UTF-8'}</span>
							</a>
						</h2>
					{/if}
					<!--------------End logo---------->
			</div>
			
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div class="clear"></div>
			<div id="ot-menuBar">
				{$HOOK_MENUBAR}
			</div>
			<!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div class="clear"></div>
			<div id="topbox">
				{$HOOK_TOPBOX}
			</div>
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			{if $page_name=='index'}
				<div class="clear"></div>
				<div id="ot-banner-slideshow" >
					{$HOOK_BANNER}
				</div>
				<div class="clear"></div>
				<div id="ot-top-content">
					{$HOOK_TOPCONTENT}
				</div>
			{/if}
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div id="columns" class="{$tpl_params->column_layout} grid_9 alpha omega clearfix {if $page_name =='index'}ot-index{else}ot-subpage{/if}"  >
				<!-- Left -->
				{if $tpl_params->column_layout != "contentRight"}
					<div id="left_column" class="column grid_2 alpha" >
						{$HOOK_LEFT_COLUMN}
					</div>
				{/if}				
				<!-- Center -->
				<div id="center_column" class=" grid_5"></div>
				
				<!-- Right -->
				{if $page_name = 'index'}
					<div id="right_column" class="col-xs-12 col-sm-{$right_column_size|intval} column">
						{$HOOK_RIGHT_COLUMN}
					</div>
				{/if}
				<!-- Right -->
				{if $page_name != 'index'} 
					</section>
				{/if}
	{/if}

Et mon footer.tpl :

	
		{if !$content_only}
			{if $page_name != 'index'}
			</div>
		{/if}
		</div>
	</div>
			<div id="ot-bottom-content">
				{$HOOK_BOTTOMCONTENT}
			</div>
			<div id="ot-bottom">
				{$HOOK_BOTTOM}
			</div>
<!-- Footer -->
			<div id="footer" class="grid_9 alpha omega clearfix">
				<div class="footer-i">
					<div class="footer-ii">
					{$HOOK_FOOTER}
					<!--{if $PS_ALLOW_MOBILE_DEVICE}
						<p class="center clearBoth"><a href="{$link->getPageLink('index', true)}?mobile_theme_ok">{l s='Browse the mobile site'}</a></p>
					{/if} -->
					
					</div>
				</div>
			</div>
		</div>
	{/if}
	</body>
</html>

Est ce que tu peux m'aider pour être sûr que ça passe ?

Link to comment
Share on other sites

coucou

 

ca devrait être plutot pour le header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{$lang_iso}">
	<head>
		<title>{$meta_title|escape:'htmlall':'UTF-8'}</title>
{if isset($meta_description) AND $meta_description}
		<meta name="description" content="{$meta_description|escape:html:'UTF-8'}" />
{/if}
{if isset($meta_keywords) AND $meta_keywords}
		<meta name="keywords" content="{$meta_keywords|escape:html:'UTF-8'}" />
{/if}
		<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
		<meta http-equiv="content-language" content="{$meta_language}" />
		<meta name="generator" content="PrestaShop" />
		<meta name="robots" content="{if isset($nobots)}no{/if}index,{if isset($nofollow) && $nofollow}no{/if}follow" />
		<link rel="icon" type="image/vnd.microsoft.icon" href="{$favicon_url}?{$img_update_time}" />
		<link rel="shortcut icon" type="image/x-icon" href="{$favicon_url}?{$img_update_time}" />
		<script type="text/javascript">
			var baseDir = '{$content_dir}';
			var baseUri = '{$base_uri}';
			var static_token = '{$static_token}';
			var token = '{$token}';
			var priceDisplayPrecision = {$priceDisplayPrecision*$currency->decimals};
			var priceDisplayMethod = {$priceDisplay};
			var roundMode = {$roundMode};
		</script>
{if isset($css_files)}
	{foreach from=$css_files key=css_uri item=media}
	<link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
	{/foreach}
{/if}
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
{if isset($js_files)}
	{foreach from=$js_files item=js_uri}
	<script type="text/javascript" src="{$js_uri}"></script>
	{/foreach}
{/if}
		{$HOOK_HEADER}
	</head>
	
	<body {if isset($page_name)}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if} class="{if $hide_left_column}hide-left-column{/if} {if $hide_right_column}hide-right-column{/if}">
	{if !$content_only}
		{if isset($restricted_country_mode) && $restricted_country_mode}
		<div id="restricted-country">
			<p>{l s='You cannot place a new order from your country.'} <span class="bold">{$geolocation_country}</span></p>
		</div>
		{/if}
		<div id="page" class="container_9 clearfix" {if $tpl_params->width}style="width:{$tpl_params->width}"{/if}>

			<!-- Header -->
			<div id="header" class="grid_9 alpha omega">
					<div id="top-header">
						{$HOOK_TOP}
					</div>
					<!-------logo-------->
					{if $page_name == "index"}
						<h1 class="Ot-logo">
							<a href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
								<span>{$shop_name|escape:'htmlall':'UTF-8'}</span>
							</a>
						</h1>
					{else}
						<h2 class="Ot-logo">
							<a href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
								<span>{$shop_name|escape:'htmlall':'UTF-8'}</span>
							</a>
						</h2>
					{/if}
					<!--------------End logo---------->
			</div>
			
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div class="clear"></div>
			<div id="ot-menuBar">
				{$HOOK_MENUBAR}
			</div>
			<!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div class="clear"></div>
			<div id="topbox">
				{$HOOK_TOPBOX}
			</div>
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			{if $page_name=='index'}
				<div class="clear"></div>
				<div id="ot-banner-slideshow" >
					{$HOOK_BANNER}
				</div>
				<div class="clear"></div>
				<div id="ot-top-content">
					{$HOOK_TOPCONTENT}
				</div>
			{/if}
			<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			<div id="columns" class="{$tpl_params->column_layout} grid_9 alpha omega clearfix {if $page_name =='index'}ot-index{else}ot-subpage{/if}"  >
				<!-- Left -->
				{if $tpl_params->column_layout != "contentRight"}
					<div id="left_column" class="column grid_2 alpha" >
						{$HOOK_LEFT_COLUMN}
					</div>
				{/if}				
				<!-- Center -->
				<div id="center_column" class=" grid_5">
	{/if}

et pour le footer

        {if !$content_only}
                </div>                
                <!-- Right -->
                {if $page_name = 'index'}
                    <div id="right_column" class="col-xs-12 col-sm-{$right_column_size|intval} column">
                        {$HOOK_RIGHT_COLUMN}
                    </div>
                {/if}
                <!-- Right -->
                {if $page_name != 'index'}
                    </section>
                {/if}
	        {if $page_name != 'index'}
		         </div>
	            {/if}
	      </div>
	</div>
			<div id="ot-bottom-content">
				{$HOOK_BOTTOMCONTENT}
			</div>
			<div id="ot-bottom">
				{$HOOK_BOTTOM}
			</div>
<!-- Footer -->
			<div id="footer" class="grid_9 alpha omega clearfix">
	<div class="footer-i">
					<div class="footer-ii">
					{$HOOK_FOOTER}
					<!--{if $PS_ALLOW_MOBILE_DEVICE}
						<p class="center clearBoth"><a href="{$link->getPageLink('index', true)}?mobile_theme_ok">{l s='Browse the mobile site'}</a></p>
					{/if} -->
					
					</div>
				</div>
			</div>
		</div>
	{/if}
	</body>
</html>

enfin quelque chose comme ça

 

@++

 

Loulou66

Link to comment
Share on other sites

En faîtes cela ne peut pas être corriger par le CSS ...

Quand je retire tout les modules de la center, la right column peut alors remonter.

Une idée pour que la center column ne prenne pas toute la largeur ?

Link to comment
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...