Category list : la deuxieme image du produit au survol

August 20, 2012

Salut à tous,

J'ai une petite question, si je voulais afficher la deuxieme image du produit lorsque je le survole, comment je pourrais m'y prendre ?

Quelqu'un la déja fait ?

vous avez une idée du code à ajouter ?

Merci d'avance

@+

August 22, 2012

Bonjour.

C'est une modification que vous souhaitez effectuer tout le temps ou seulement sur une image en particulier ?

Après un rapide check dans le product.tpl, voici le block qui génère l'affichage des images et des miniatures (qui permettent de remplacer l'image au survol; et notamment au survol de la seconde miniature) :

 <div id="image-block">
 {if $have_image}
  <img src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large')}"
   {if $jqZoomEnabled}class="jqzoom" alt="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'thickbox')}"{else} title="{$product->name|escape:'htmlall':'UTF-8'}" alt="{$product->name|escape:'htmlall':'UTF-8'}" {/if} id="bigpic" width="{$largeSize.width}" height="{$largeSize.height}" />
 {else}
  <img src="{$img_prod_dir}{$lang_iso}-default-large.jpg" id="bigpic" alt="" title="{$cover.legend|escape:'htmlall':'UTF-8'}" width="{$largeSize.width}" height="{$largeSize.height}" />
 {/if}
 </div>
 {if isset($images) && count($images) > 0}
 <!-- thumbnails -->
 <div id="views_block" {if isset($images) && count($images) < 2}class="hidden"{/if}>
 {if isset($images) && count($images) > 3}<span class="view_scroll_spacer"><a id="view_scroll_left" class="hidden" title="{l s='Other views'}" href="javascript:{ldelim}{rdelim}">{l s='Previous'}</a></span>{/if}
 <div id="thumbs_list">
  <ul id="thumbs_list_frame">
   {if isset($images)}
 {foreach from=$images item=image name=thumbnails}
 {assign var=imageIds value="`$product->id`-`$image.id_image`"}
 <li id="thumbnail_{$image.id_image}">
  <a href="{$link->getImageLink($product->link_rewrite, $imageIds, 'thickbox')}" rel="other-views" class="thickbox {if (isset($image.cover) AND $image.cover == 1) OR (!isset($image.cover) AND $smarty.foreach.thumbnails.first)}shown{/if}" title="{$image.legend|htmlspecialchars}">
   <img id="thumb_{$image.id_image}" src="{$link->getImageLink($product->link_rewrite, $imageIds, 'medium')}" alt="{$image.legend|htmlspecialchars}" height="{$mediumSize.height}" width="{$mediumSize.width}" />
  </a>
 </li>
 {/foreach}
   {/if}
  </ul>
 </div>

Vous pouvez soit passer simplement par javascript pour ajouter un changement de src "onmouseover", en remettant l'ancienne en "onmouseout", soit le faire via le CSS, ou encore combiner avec smarty (probablement le choix le plus propre) pour effectuer un :

$link->getImageLink($product->link_rewrite, $imageIds.........[/code au survol de la première image, si jamais la seconde existe.

Vous pouvez vous inspirer du code ci-dessous pour trouver les variables dont vous avez besoin, ainsi que la syntaxe correcte.

August 23, 2012

Merci pour votre réponse, à présent aiguiller je vais faire des tests.

encore merci !

August 23, 2012

Avec plaisir.

Pensez à indiquer ici votre solution lorsque vous aurez trouvé votre bonheur.

Cordialement.

August 24, 2012

Je n'y manquerais pas, je suis dessus ce week end !

September 24, 2012

Des news svp ? Ca m'intéresse beaucoup merci

September 25, 2012

Le template pour afficher les produits dans les catégories est : product-list.tpl.

il vas falloir etendre la classe Category, methode getProducts (ligne 553)

la requete SQL retourne id_image qui correspond à la premiere image du produit.

Il faut donc charger une deuxieme image.

Puis dans la classe Product, methode getProductProperties ligne 3509

dupliquer : $row['id_image'] = Product::defineProductImage($row, $id_lang); et creer une deuxieme fonction pour l'aimge 2

Si l'image 2 n'existe pas, je vous conseil de faire $row['id_image_over'] = $row['id_image'] afin d'afficher la premiere image.

September 26, 2012

Des news svp ? Ca m'intéresse beaucoup merci

En fait j'avoue que moi j'avais abanadonné, je suis passé à une autre solution, mais j'aurais surement besoin dy revenir, merci webaide pour ces infos !

October 14, 2012

Le template pour afficher les produits dans les catégories est : product-list.tpl.

il vas falloir etendre la classe Category, methode getProducts (ligne 553)

la requete SQL retourne id_image qui correspond à la premiere image du produit.

Il faut donc charger une deuxieme image.

Puis dans la classe Product, methode getProductProperties ligne 3509

dupliquer : $row['id_image'] = Product::defineProductImage($row, $id_lang); et creer une deuxieme fonction pour l'aimge 2

Si l'image 2 n'existe pas, je vous conseil de faire $row['id_image_over'] = $row['id_image'] afin d'afficher la premiere image.

J'ai compris le raisonnement mais ne sait pas le mettre en code pouvez-vous m'aider svp ?

J'ai créé i.id_image2 et dans la classes product j'ai créé :

$row['id_image2'] = Product::defineProductImage2($row, $id_lang);

et ensuite la fonction

public static function defineProductImage2($row, $id_lang)

mais ne sait pas quoi mettre dedans .. ?

Merci

January 4, 2013

Ca m'intéresse aussi ce sujet. Comment on peut vérifier si l'image2 existe et on va mettre quoi dans la fonction getImage2?

February 16, 2013

Bonjour,

ça m'intéresse aussi,

si quelqu'un nous donne une solution !

March 1, 2013

très intérésant y a t'il du nouveau pour la solution ?

March 4, 2013

Salut à tous,

grace aux pistes de travail proposées par webaide, j'ai trouvé une solution qui m'a permis de récupérer une image supplementaire du produit dans la product-list :

Je ne sais pas si c'est très propre mais ça fonctionne chez moi (prestashop 1.5.3)

Tout d'abord j'ai ajouté une fonction à l'override de la classe Category.php .

Cette fonction permet d'aller chercher la deuxième image d'un produit (celle en position 2)

override/classes/Category.php

// récupère l'image en position 2
public function getProductsImgSupp($product_id)
{
$sql = '
	SELECT id_image, id_product from `'._DB_PREFIX_.'image`
	WHERE id_product="'.$product_id.'"
	ORDER BY `position` ASC
	LIMIT 1,1
	';
	$result = Db::getInstance()->ExecuteS($sql);
return $result[0]['id_product'].'-'.$result[0]['id_image'];
}

Ensuite, j'ai fait un override de la fonction getProductProperties dans la classe Product.php pour y inclure le nom de l'image supplémentaire récupéré par la fonction précédente.

c'est juste une ligne à ajouter :

$row['id_image2'] = Category::getProductsImgSupp((int)$row['id_product']);

Voilà ce que donne la fonction

override/classes/Product.php

public static function getProductProperties($id_lang, $row, Context $context = null)
{
	if (!$row['id_product'])
		return false;
	if ($context == null)
		$context = Context::getContext();
	// Product::getDefaultAttribute is only called if id_product_attribute is missing from the SQL query at the origin of it:
	// consider adding it in order to avoid unnecessary queries
	$row['allow_oosp'] = Product::isAvailableWhenOutOfStock($row['out_of_stock']);
	if (Combination::isFeatureActive() && (!isset($row['id_product_attribute']) || !$row['id_product_attribute'])
		&& ((isset($row['cache_default_attribute']) && ($ipa_default = $row['cache_default_attribute']) !== null)
			|| ($ipa_default = Product::getDefaultAttribute($row['id_product'], !$row['allow_oosp']))))
		$row['id_product_attribute'] = $ipa_default;
	if (!Combination::isFeatureActive() || !isset($row['id_product_attribute']))
		$row['id_product_attribute'] = 0;
	// Tax
	$usetax = Tax::excludeTaxeOption();
	$cache_key = $row['id_product'].'-'.$row['id_product_attribute'].'-'.$id_lang.'-'.(int)$usetax;
	if (isset($row['id_product_pack']))
		$cache_key .= '-pack'.$row['id_product_pack'];
	if (isset(self::$producPropertiesCache[$cache_key]))
		return array_merge($row, self::$producPropertiesCache[$cache_key]);
	// Datas
	$row['category'] = Category::getLinkRewrite((int)$row['id_category_default'], (int)$id_lang);
	$row['link'] = $context->link->getProductLink((int)$row['id_product'], $row['link_rewrite'], $row['category'], $row['ean13']);
	$row['attribute_price'] = 0;
	if (isset($row['id_product_attribute']) && $row['id_product_attribute'])
		$row['attribute_price'] = (float)Product::getProductAttributePrice($row['id_product_attribute']);
	$row['price_tax_exc'] = Product::getPriceStatic(
		(int)$row['id_product'],
		false,
		((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
		(self::$_taxCalculationMethod == PS_TAX_EXC ? 2 : 6)
	);
	if (self::$_taxCalculationMethod == PS_TAX_EXC)
	{
		$row['price_tax_exc'] = Tools::ps_round($row['price_tax_exc'], 2);
		$row['price'] = Product::getPriceStatic(
			(int)$row['id_product'],
			true,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			6
		);
		$row['price_without_reduction'] = Product::getPriceStatic(
			(int)$row['id_product'],
			false,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			2,
			null,
			false,
			false
		);
	}
	else
	{
		$row['price'] = Tools::ps_round(
			Product::getPriceStatic(
				(int)$row['id_product'],
				true,
				((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
				2
			),
			2
		);
		$row['price_without_reduction'] = Product::getPriceStatic(
			(int)$row['id_product'],
			true,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			6,
			null,
			false,
			false
		);
	}
	$row['reduction'] = Product::getPriceStatic(
		(int)$row['id_product'],
		(bool)$usetax,
		(int)$row['id_product_attribute'],
		6,
		null,
		true,
		true,
		1,
		true,
		null,
		null,
		null,
		$specific_prices
	);
	$row['specific_prices'] = $specific_prices;
	if ($row['id_product_attribute'])
		$row['quantity_all_versions'] = Product::getQuantity(
			(int)$row['id_product'],
			0,
			isset($row['cache_is_pack']) ? $row['cache_is_pack'] : null
		);
	else
		$row['quantity'] = Product::getQuantity((int)$row['id_product']);
	$row['id_image'] = Product::defineProductImage($row, $id_lang);


	$row['id_image2'] = Category::getProductsImgSupp((int)$row['id_product']);	// image supplémentaire

	$row['features'] = Product::getFrontFeaturesStatic((int)$id_lang, $row['id_product']);
	$row['attachments'] = array();
	if (!isset($row['cache_has_attachments']) || $row['cache_has_attachments'])
		$row['attachments'] = Product::getAttachmentsStatic((int)$id_lang, $row['id_product']);
	$row['virtual'] = ((!isset($row['is_virtual']) || $row['is_virtual']) ? 1 : 0);
	// Pack management
	$row['pack'] = (!isset($row['cache_is_pack']) ? Pack::isPack($row['id_product']) : (int)$row['cache_is_pack']);
	$row['packItems'] = $row['pack'] ? Pack::getItemTable($row['id_product'], $id_lang) : array();
	$row['nopackprice'] = $row['pack'] ? Pack::noPackPrice($row['id_product']) : 0;
	if ($row['pack'] && !Pack::isInStock($row['id_product']))
		$row['quantity'] = 0;
	$row = Product::getTaxesInformations($row, $context);
	self::$producPropertiesCache[$cache_key] = $row;
	return self::$producPropertiesCache[$cache_key];
}

Maintenant, on peut utiliser cette image supplementaire dans le fichier product-list.tpl

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image2, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />

N'hésitez pas à proposer des améliorations

Pour ma part, je ne voulais pas la deuxième image mais la dernière :

override/classes/Category.php

public function getProductsImgSupp($product_id) //Récupère la dernière image
{
$sql = '
 SELECT id_image, id_product from `'._DB_PREFIX_.'image`
 WHERE id_product="'.$product_id.'"
 ORDER BY `position` DESC
 LIMIT 0,1
 ';
	$result = Db::getInstance()->ExecuteS($sql);
return $result[0]['id_product'].'-'.$result[0]['id_image'];
}

En espérant que ça aidera

April 22, 2013

Salut à tous,

grace aux pistes de travail proposées par webaide, j'ai trouvé une solution qui m'a permis de récupérer une image supplementaire du produit dans la product-list :

Je ne sais pas si c'est très propre mais ça fonctionne chez moi (prestashop 1.5.3)

Tout d'abord j'ai ajouté une fonction à l'override de la classe Category.php .

Cette fonction permet d'aller chercher la deuxième image d'un produit (celle en position 2)

override/classes/Category.php

// récupère l'image en position 2
public function getProductsImgSupp($product_id)
{
$sql = '
	SELECT id_image, id_product from `'._DB_PREFIX_.'image`
	WHERE id_product="'.$product_id.'"
	ORDER BY `position` ASC
	LIMIT 1,1
	';
	$result = Db::getInstance()->ExecuteS($sql);
return $result[0]['id_product'].'-'.$result[0]['id_image'];
}

Ensuite, j'ai fait un override de la fonction getProductProperties dans la classe Product.php pour y inclure le nom de l'image supplémentaire récupéré par la fonction précédente.

c'est juste une ligne à ajouter :

$row['id_image2'] = Category::getProductsImgSupp((int)$row['id_product']);

Voilà ce que donne la fonction

override/classes/Product.php

public static function getProductProperties($id_lang, $row, Context $context = null)
{
	if (!$row['id_product'])
		return false;
	if ($context == null)
		$context = Context::getContext();
	// Product::getDefaultAttribute is only called if id_product_attribute is missing from the SQL query at the origin of it:
	// consider adding it in order to avoid unnecessary queries
	$row['allow_oosp'] = Product::isAvailableWhenOutOfStock($row['out_of_stock']);
	if (Combination::isFeatureActive() && (!isset($row['id_product_attribute']) || !$row['id_product_attribute'])
		&& ((isset($row['cache_default_attribute']) && ($ipa_default = $row['cache_default_attribute']) !== null)
			|| ($ipa_default = Product::getDefaultAttribute($row['id_product'], !$row['allow_oosp']))))
		$row['id_product_attribute'] = $ipa_default;
	if (!Combination::isFeatureActive() || !isset($row['id_product_attribute']))
		$row['id_product_attribute'] = 0;
	// Tax
	$usetax = Tax::excludeTaxeOption();
	$cache_key = $row['id_product'].'-'.$row['id_product_attribute'].'-'.$id_lang.'-'.(int)$usetax;
	if (isset($row['id_product_pack']))
		$cache_key .= '-pack'.$row['id_product_pack'];
	if (isset(self::$producPropertiesCache[$cache_key]))
		return array_merge($row, self::$producPropertiesCache[$cache_key]);
	// Datas
	$row['category'] = Category::getLinkRewrite((int)$row['id_category_default'], (int)$id_lang);
	$row['link'] = $context->link->getProductLink((int)$row['id_product'], $row['link_rewrite'], $row['category'], $row['ean13']);
	$row['attribute_price'] = 0;
	if (isset($row['id_product_attribute']) && $row['id_product_attribute'])
		$row['attribute_price'] = (float)Product::getProductAttributePrice($row['id_product_attribute']);
	$row['price_tax_exc'] = Product::getPriceStatic(
		(int)$row['id_product'],
		false,
		((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
		(self::$_taxCalculationMethod == PS_TAX_EXC ? 2 : 6)
	);
	if (self::$_taxCalculationMethod == PS_TAX_EXC)
	{
		$row['price_tax_exc'] = Tools::ps_round($row['price_tax_exc'], 2);
		$row['price'] = Product::getPriceStatic(
			(int)$row['id_product'],
			true,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			6
		);
		$row['price_without_reduction'] = Product::getPriceStatic(
			(int)$row['id_product'],
			false,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			2,
			null,
			false,
			false
		);
	}
	else
	{
		$row['price'] = Tools::ps_round(
			Product::getPriceStatic(
				(int)$row['id_product'],
				true,
				((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
				2
			),
			2
		);
		$row['price_without_reduction'] = Product::getPriceStatic(
			(int)$row['id_product'],
			true,
			((isset($row['id_product_attribute']) && !empty($row['id_product_attribute'])) ? (int)$row['id_product_attribute'] : null),
			6,
			null,
			false,
			false
		);
	}
	$row['reduction'] = Product::getPriceStatic(
		(int)$row['id_product'],
		(bool)$usetax,
		(int)$row['id_product_attribute'],
		6,
		null,
		true,
		true,
		1,
		true,
		null,
		null,
		null,
		$specific_prices
	);
	$row['specific_prices'] = $specific_prices;
	if ($row['id_product_attribute'])
		$row['quantity_all_versions'] = Product::getQuantity(
			(int)$row['id_product'],
			0,
			isset($row['cache_is_pack']) ? $row['cache_is_pack'] : null
		);
	else
		$row['quantity'] = Product::getQuantity((int)$row['id_product']);
	$row['id_image'] = Product::defineProductImage($row, $id_lang);


	$row['id_image2'] = Category::getProductsImgSupp((int)$row['id_product']);	// image supplémentaire

	$row['features'] = Product::getFrontFeaturesStatic((int)$id_lang, $row['id_product']);
	$row['attachments'] = array();
	if (!isset($row['cache_has_attachments']) || $row['cache_has_attachments'])
		$row['attachments'] = Product::getAttachmentsStatic((int)$id_lang, $row['id_product']);
	$row['virtual'] = ((!isset($row['is_virtual']) || $row['is_virtual']) ? 1 : 0);
	// Pack management
	$row['pack'] = (!isset($row['cache_is_pack']) ? Pack::isPack($row['id_product']) : (int)$row['cache_is_pack']);
	$row['packItems'] = $row['pack'] ? Pack::getItemTable($row['id_product'], $id_lang) : array();
	$row['nopackprice'] = $row['pack'] ? Pack::noPackPrice($row['id_product']) : 0;
	if ($row['pack'] && !Pack::isInStock($row['id_product']))
		$row['quantity'] = 0;
	$row = Product::getTaxesInformations($row, $context);
	self::$producPropertiesCache[$cache_key] = $row;
	return self::$producPropertiesCache[$cache_key];
}

Maintenant, on peut utiliser cette image supplementaire dans le fichier product-list.tpl

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image2, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />

N'hésitez pas à proposer des améliorations

Pour ma part, je ne voulais pas la deuxième image mais la dernière :

override/classes/Category.php

public function getProductsImgSupp($product_id) //Récupère la dernière image
{
$sql = '
 SELECT id_image, id_product from `'._DB_PREFIX_.'image`
 WHERE id_product="'.$product_id.'"
 ORDER BY `position` DESC
 LIMIT 0,1
 ';
	$result = Db::getInstance()->ExecuteS($sql);
return $result[0]['id_product'].'-'.$result[0]['id_image'];
}

En espérant que ça aidera

Hello Albikom,

Sorry for not speaking french first. I am trying to implement your code but I don't know what to put on product-list.tpl because I am not getting any image loaded. If there any way you could guide me on this one?

July 22, 2013

Merci beaucoup Albikom pour ces fonctions, ça marche très bien sous 1.5.4.1.

Juste une chose à préciser, bien entendu si vous overridez les fichiers classes, n'oubliez pas de mettre les bonnes déclarations d'usage :

class Product extends ProductCore
{
public static function getProductProperties($id_lang, $row, Context $context = null)
{
....
	 }
}

Pour Product.php et pour Category.php :

class Category extends CategoryCore
{
public function getProductsImgSupp($product_id)
    {
	  .....
    }
}

July 28, 2013

Bonjour,

quelqu'un aurait t-il l'adresse d'une boutique ou cette astuce a été mise en place, afin que je puisse réellement voir le rendu?

Merci.

Tchupa.

May 13, 2014

salut albikom

pour ma part je cherche a recuperer la première image. (trop long a expliquer pouquoi )

une idée du code à mettre?

j'ai changé le code $row['id_image2'] …..

par $row['id_image1'] =…

rien à faire. toujours la deuxième image affichée.

May 13, 2014

Re

tout compte fait trouvé grâce à ton dernier code.

autre question, comment afficher sur la page product.tpl? le smarty est "cover' au lieu de product du coup ça ne passe pas

Category list : la deuxieme image du produit au survol

Recommended Posts

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Important Information