Jump to content

Affichage buggé des produits phares ( selon la longueur du titre).

ToutPourLaLingerie
 Share

Recommended Posts

ToutPourLaLingerie Newbie

ToutPourLaLingerie

Posted
Posted (edited)

Bonjour,

 

je sais que ce souci est récurrent, mais les résultats de mes recherches n'ont pas résolu ce souci.

En fait, en fonction de la longueur du nom du produit, si une seconde ligne est nécessaire, alors l'affichage plante. ( je n'ai pas essayer avec les photos).

 

Ce site est une refonte de l'ancien ( je passe de Magento à PS 1.5.6.1).

Soivi son URL: www.mode-indienne.com ( voir signature)

 

Or dans la catégorie, les tritre sont bien coupés avec les "..." et là pas de souci d'affichage.

 

J'ai essayer de modifier le truncat, mais cela ne fonctionne pas.

Mon template utilise un module spécifique pour ces produits phare ( addhomefeatured).

 

Voici le code de ce module:

 

addhomefeatured.tpl

<div class="clearfix"></div>
<!-- MODULE Home Featured Products -->
<section class="addhomefeatured">
  <h4><span>{l s='Featured products' mod='addhomefeatured'}</span></h4> 
  	{if isset($products) AND $products}
         <ul class="row">
          {foreach from=$products item=product name=homeFeaturedProducts}
          <li class="ajax_block_product span3  {if $smarty.foreach.homeFeaturedProducts.iteration is div by 4} omega{/if} num-{$smarty.foreach.homeFeaturedProducts.iteration}{if $smarty.foreach.homeFeaturedProducts.iteration == 1 or $smarty.foreach.homeFeaturedProducts.iteration == 5 or $smarty.foreach.homeFeaturedProducts.iteration == 9} alpha{/if}">
                <div class="featured_li"> 
                    <a class="product_image" href="{$product.link}" title="{if $product.price_without_reduction != $product.price}{l s='Sale!' mod='addhomefeatured'}  {l s='and' mod='addhomefeatured'}  {/if}{if isset($product.new) && $product.new == 1}  {l s='Nouveau' mod='addhomefeatured'}{/if}" rel="tooltip" data-placement="bottom" data-original-title="{$product.name|truncate:15:'...'|escape:'htmlall':'UTF-8'}" > 
                              <img  src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.name|escape:html:'UTF-8'}" class="main-img"/> 
                        {foreach from=$addimages key=k item=v}
                           {if $k==$product.id_product && $v !=''}
                           		<img src="{$link->getImageLink($product.link_rewrite,$product.id_product|cat:"-"|cat:$v, 'home_default')}"  alt="{$product.legend|escape:htmlall:'UTF-8'}" style="display:none;"  class="next-img" />
                            {/if}
                        {/foreach} 
                    </a> 
                    <div>
                        <h5><a class="product_link" href="{$product.link}" title="">{$product.name|truncate:45:'...'|escape:'htmlall':'UTF-8'}</a></h5>
                            <p class="product_desc">{$product.description_short|strip_tags|truncate:65:'...'}</p>                 
                                <div class="clearfix">
                                {if $product.show_price AND !isset($restricted_country_mode) AND !$PS_CATALOG_MODE}
                                    <span class="price">
                                    {if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}
                                    </span>
                                {/if}      
         {if $product.price_without_reduction != $product.price}<span class="price-drop-feacherd">{convertPrice price=$product.price_without_reduction}</span>{/if}
         </div>
                   {if ($product.id_product_attribute == 0 OR (isset($add_prod_display) AND ($add_prod_display == 1))) AND $product.available_for_order AND !isset($restricted_country_mode) 
                    AND $product.minimal_quantity == 1 AND $product.customizable != 2 AND !$PS_CATALOG_MODE}
                    {if ($product.quantity > 0 OR $product.allow_oosp)} 
                        <a class="exclusive ajax_add_to_cart_button" rel="ajax_id_product_{$product.id_product}" href="{$link->getPageLink('cart.php')}?qty=1&id_product={$product.id_product}&token={$static_token}&add">
                        <span>{l s='Add to cart' mod='addhomefeatured'}</span>
                        </a> 
                    {else} 
                      <span class="exclusive">{l s='Add to cart' mod='addhomefeatured'}</span> {/if}
                    {/if} 
                        <a class="button" href="{$product.link}"  rel="tooltip" data-placement="bottom">{l s='View' mod='addhomefeatured'}</a>  
                      
                    </div>
                </div>
          </li>
          {/foreach}
        </ul>
  {else}
 	 <p>{l s='No featured products' mod='addhomefeatured'}</p>
  {/if} 
</section>
 <script>
 	$(document).ready(function() {
$(this).find(".addhomefeatured ul li .main-img").mouseover(function () { 
   $(this).next(".addhomefeatured ul li .next-img").stop(true, true).fadeIn(600, 'linear'); 
  });  
  $(".addhomefeatured ul li .next-img").mouseleave(function () { 
      $(".addhomefeatured ul li .next-img").stop(true, true).fadeOut(600, 'linear');
  });
});
 </script>
<!-- /MODULE Home Featured Products -->

addhomefeatured.php

<?php
if (!defined('_PS_VERSION_'))
	exit;

class AddHomeFeatured extends Module
{
	private $_html = '';
	private $_postErrors = array();

	function __construct()
	{
		$this->name = 'addhomefeatured';
		$this->tab = 'front_office_features';
		$this->version = '1.0';
		$this->author = 'Custom';
		$this->need_instance = 0;
		parent::__construct();
		$this->displayName = $this->l('Add Featured Products on the homepage');
		$this->description = $this->l('Displays Featured Products in the middle of your homepage.');
	}

	function install()
	{
		if (!Configuration::updateValue('HOME_FEATURED_NBR', 8) || !parent::install() || !$this->registerHook('displayHome') || !$this->registerHook('displayHeader'))
			return false;
		return true;
	}

	public function getContent()
	{
		$output = '<h2>'.$this->displayName.'</h2>';
		if (Tools::isSubmit('submitAddHomeFeatured'))
		{
			$nbr = (int)(Tools::getValue('nbr'));
			if (!$nbr OR $nbr <= 0 OR !Validate::isInt($nbr))
				$errors[] = $this->l('Invalid number of products');
			else
				Configuration::updateValue('HOME_FEATURED_NBR', (int)($nbr));
			if (isset($errors) AND sizeof($errors))
				$output .= $this->displayError(implode('<br />', $errors));
			else
				$output .= $this->displayConfirmation($this->l('Settings updated'));
		}
		return $output.$this->displayForm();
	}

	public function displayForm()
	{
		$output = '
		<div class="clearfix"></div>
		<form action="'.Tools::safeOutput($_SERVER['REQUEST_URI']).'" method="post">
			<fieldset><legend>'.$this->l('Settings').'</legend>
				<p>'.$this->l('In order to add products to your homepage, just add them to the "home" category.').'</p><br />
				<label>'.$this->l('Number of products displayed').'</label>
				<div class="margin-form">
					<input type="text" size="5" name="nbr" value="'.Tools::safeOutput(Tools::getValue('nbr', (int)(Configuration::get('HOME_FEATURED_NBR')))).'" />
					<p class="clear">'.$this->l('The number of products displayed on homepage (default: 10).').'</p>

				</div>
				<center><input type="submit" name="submitAddHomeFeatured" value="'.$this->l('Save').'" class="button" /></center>
			</fieldset>
		</form>';
		return $output;
	}
		function hookHeader($params)
	{
		$this->context->controller->addCSS($this->_path.'css/addhomefeatured.css');
	}

	public function hookDisplayHome($params)
	{
		$category = new Category(Context::getContext()->shop->getCategory(), Configuration::get('PS_LANG_DEFAULT'));
		$nb = (int)(Configuration::get('HOME_FEATURED_NBR'));


$products = $category->getProducts($params['cookie']->id_lang, 1, ($nb ? $nb : 10));
$p=array();
for($i=0;$i<count($products);$i++){
$product=$products[$i];
unset ($pid);
$pid=$product['id_product'];
$sql= "SELECT * FROM `"._DB_PREFIX_."image` WHERE `id_product` = '{$pid}' AND cover = '0' ORDER BY `id_image` ";
$results = Db::getInstance()->ExecuteS($sql);
@$result=$results['0'];
$p[$pid]=$result['id_image'];
}
$this->smarty->assign('addimages',$p);

		$this->smarty->assign(array(
			'products' => $products,
			'add_prod_display' => Configuration::get('PS_ATTRIBUTE_CATEGORY_DISPLAY'),
			'homeSize' => Image::getSize('home'),
		));

		return $this->display(__FILE__, 'addhomefeatured.tpl');
	}
}

addhomefeatured.css

/* ————— homefeatured.tpl ————— */
.addhomefeatured {}
.addhomefeatured h4 {font-size:17px; line-height:1.2em;color:#1c1c1c;font-weight:bold; text-transform:uppercase; padding:26px 0px 8px 0px; margin:0 0 30px 0; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; border-bottom:3px solid #000000;}
.addhomefeatured ul { list-style:none;}
.addhomefeatured ul li { text-align:center; margin-bottom:30px; /*float:left*/ height: 340;position:relative; }
.addhomefeatured ul .featured_li{text-align:center; padding:30px;}
.addhomefeatured ul li a{ position:relative;}
.addhomefeatured ul li img.next-img{ z-index:9; width:370px; position:relative; top:0; left:0;}
.addhomefeatured ul li img{display:block; overflow:hidden;}
.addhomefeatured ul li img.main-img{ display:block;}
.addhomefeatured ul li .product_image{ width:100%;display:block; padding-bottom:0px; overflow:hidden; position:relative;}
.addhomefeatured ul li .featured_li{border:1px solid #cccccc}
.addhomefeatured ul li div { text-align:left;}
.addhomefeatured ul li h5 {padding:15px 0 0 0;}
.addhomefeatured ul li p.product_desc {padding:3px 0 0 0; display:none;}
.addhomefeatured ul li span.price {display: block;padding:0px 0 0px 0; font-size:17px;}
.addhomefeatured .price-drop-feacherd{ text-decoration:line-through; margin-left:7px;}
.addhomefeatured ul li .button,.addhomefeatured ul li .exclusive{ display:none;}
.addhomefeatured ul li a.exclusive{ border:1px solid #464646; border-right:1px solid #262626; border-bottom:1px solid #262626; color:#fff; margin-right:2px; display:none;
background: rgb(70,70,70); /* Old browsers */
background: -moz-linear-gradient(top, rgba(70,70,70,1) 0%, rgba(38,38,38,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(70,70,70,1)), color-stop(100%,rgba(38,38,38,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(70,70,70,1) 0%,rgba(38,38,38,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(70,70,70,1) 0%,rgba(38,38,38,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(70,70,70,1) 0%,rgba(38,38,38,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(70,70,70,1) 0%,rgba(38,38,38,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#464646', endColorstr='#262626',GradientType=0 ); /* IE6-9 */
}
.addhomefeatured ul li a.exclusive  span{background:url(../img/btn-marker.png) left  top  no-repeat; line-height:18px;padding:2px 0 2px 20px;}
.addhomefeatured ul li a.exclusive:hover{ border:1px solid #FF553D; border-right:1px solid #FF553D; border-bottom:1px solid #FF553D;
background:#FF553D
}
@media only screen and (min-width: 768px) and (max-width: 979px) {	
.addhomefeatured ul li span.exclusive{ padding-left:30px; padding-right:30px;}
.addhomefeatured ul li .exclusive{ margin-bottom:10px;}
.addhomefeatured ul .featured_li{ padding:15px;}
.addhomefeatured h4{ padding-top:6px; margin-bottom:20px;}
.addhomefeatured ul li{ margin-bottom:20px;}
}
@media only screen and (max-width: 767px) {
.addhomefeatured h4 {font-size: 17px;padding:10px 11px 10px 0px;margin-bottom:20px}
.addhomefeatured ul .featured_li{ padding:0;}
.addhomefeatured ul li div {text-align: left;}
.addhomefeatured ul li {float: left; margin:0 0 20px 0;border:1px solid #cccccc; padding:16px 20px 20px 20px;}
.addhomefeatured ul li:first-child{}
.addhomefeatured ul li:first-child .featured_li {padding-top:0;}
.addhomefeatured ul li h5 {padding:0px 0 7px 0;}
.addhomefeatured ul li .product_image.feat-mobile {display: inline-block;float:left; margin-right:10px; height:181px;padding-bottom: 0;text-align: center;width:118px;}
.addhomefeatured ul li .product_image{ width:118px; float:left; margin-right:20px; margin-bottom:0px; margin-top:4px;}
.addhomefeatured ul li span.price{ padding:12px 0 4px 0; font-size:24px; display:block;}
.addhomefeatured ul li img{ width:118px; height:181px;}
.addhomefeatured ul li.num-1 .featured_li, .addhomefeatured ul li.num-2 .featured_li, .addhomefeatured ul li.num-3 .featured_li, .addhomefeatured ul li.num-4 .featured_li{ border:none;}
.addhomefeatured ul li .button{ display: inline-block;margin:20px 0 0 0;}
.addhomefeatured ul li .exclusive,.addhomefeatured ul li a.exclusive{ display: inline-block; margin:20px 16px 0 0;}
.addhomefeatured ul li p.product_desc{ display:inline-block; margin:0; }
.addhomefeatured .price-drop-feacherd{margin-left:0px;}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
.addhomefeatured ul li .exclusive{margin-right:8px;}
.addhomefeatured ul li span.price{ display:inline-block; margin-right:10px;}
}

Un grand merci pour votre aide préciseuse, je galère deuis ce midi.

Edited by juninho (see edit history)
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
 Share
Go to topic listing
×
×
  • Create New...