immagini prodotti

[ilario]

ciao a tutti 

mi potreste dare una mano per cortesia,

nella pagina prodotti in categoria devo far in modo che le due immagini del prodotto (normal e hover) siano sempre la numero 1 e 2 del prodotto a prescindere dall'immagine di default impostato dalle  combinazioni (varianti)

dovrebbe essere questo il codice che carica le immagini delle thumb

 <div class="thumbnail product-thumbnail relative flex-container">

      {block name='product_thumbnail'}
      <a href="{$product.url}" class="relative{foreach from=$product.images item=image}{if ($image.cover != 1)} subimage-true{break}{/if}{/foreach}">
        {if $product.cover}
          {include file='catalog/_partials/product-image.tpl' image=$product.cover type=$type}
          {if Configuration::get('pm_hover_image') == true}
            {foreach from=$product.images item=image}
              {if ($image.cover != 1)}
                {include file='catalog/_partials/product-image.tpl' image=$image type=$type}
                {break}
              {/if}
            {/foreach}
          {/if}
        {else}
          <img src="{$urls.no_picture_image.bySize.large_default.url}" style="width:100%;">
        {/if}
      </a>
      {/block}

grazie mille

ilario

[marsaldev]

Ciao @ilario,

dal codice mi sembra di capire che è un template per PrestaShop 1.7.

Premettendo che non ho già la soluzione 😊, hai già provato a fare un dump dell'array delle immagini per capire come sono ordinate?

Questo dovrebbe funzionare (attiva la modalità debug se puoi)

{$product.images|dump} 

 

[ilario]

ti ringrazio per la risposta

si è un template per 1.7

nel frattempo ho letto un po in giro e sembra che prestashop carichi le immagini della combinazione di dafault e non l'immagine di copertina

{if $product.cover}
	{assign var='coverImage' value=Product::getCover($product->id)}
	{assign var='coverImageId' value="{$product->id}-{$coverImage.id_image}"}
	<a class="thumbnail product-thumbnail" href="{$product.canonical_url}">
		<img src="{$link->getImageLink($product.link_rewrite, $coverImageId)}" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}" data-full-size-image-url="{$product.cover.large.url}" />
	</a>
{else}
	<a class="thumbnail product-thumbnail" href="{$product.canonical_url}">
		<img src="{$urls.no_picture_image.bySize.home_default.url}" />
	</a>
{/if}

ho trovato questo codice che fa caricare immagine di copertina e non quella della combinazione, a parte che lo devo riadattare al mio codice, non so come fare caricare la seconda immagine per hover

 

[marsaldev]

Guarda, sembrerebbe che se il prodotto ha combinazioni vengono prese solo le immagini per quella combinazione, le altre vengono caricate in modo asincrono quando selezioni la combinazione.

La strada che posso consigliarti se vuoi ottenere questo effetto, è quella di crearti un modulo, quando sei nella pagina prodotto ti recuperi le immagini e in una variabile ti metti le prime due immagini (a prescindere se è cover o meno)

E nel template sostituisci nello script che hai postato, ma credo tu debba farlo da "zero", la variabile product.images con la tua variabile.

 

Alternativa (che sconsiglio, ma è la strada breve):

Puoi usare la classe Image e recuperare l'array delle immagini, sono già ordinate per posizione:

{Image::getImages($language.id, $product.id)}

# Per assegnarle ad una variabile e usare l'array in un ciclo
{assign var='allProductImages' value=Image::getImages($language.id, $product.id)}

Fatti un dump, dopodiché con un ciclo la storia dovrebbe essere abbastanza semplice 😊

{Image::getImages($language.id, $product.id)|dump}

 

Un caro saluto

[ilario]

grazie mille

più tardi ci provo e ti faccio sapere, però questo codice non è nella pagina prodotto ma nella pagina categorie lista prodotti

templates/catalog/_partials/miniatures/product.tpl

 

[ilario]

per il momento ho risolto semplicemente non richiamando l'altro file  catalog/_partials/product-image.tpl

ma costruendo direttamente le stringhe img  normale e hover direttamente nel product.it

{block name='product_thumbnail'}
      <a href="{$product.url}" class="relative{foreach from=$product.images item=image}{if (($image.cover != 1) && ($product.cover.id_image != $image.id_image))} subimage-true{break}{/if}{/foreach}">
        {if $product.cover}
            {assign var='coverImage' value=Product::getCover($product->id)}
	        {assign var='coverImageId' value="{$product->id}-{$coverImage.id_image}"}
		    {assign var='coverImageIdhover' value="{$coverImage.id_image + 1}"}
		
		    <img src="{$link->getImageLink($product.link_rewrite, $coverImageId)}" width="{$product.cover.bySize.$type.width}" height="{$product.cover.bySize.$type.height}" class="smooth05 cover-image" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}" data-full-size-image-url="{$product.cover.large.url}" />
 
 

		   {if Configuration::get('pm_hover_image') == true}
		 <img src="{$link->getImageLink($product.link_rewrite, $coverImageIdhover)}" width="{$product.cover.bySize.$type.width}" height="{$product.cover.bySize.$type.height}" class="smooth05 cover-image" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}" data-full-size-image-url="{$product.cover.large.url}" />
   {/if}
		  
        {else}
          <img src="{$urls.no_picture_image.bySize.large_default.url}" style="width:100%;">
        {/if}
      </a>
      {/block}

ricavo id dell'immagine di copertina e non quella della combinazione e per l'hover gli sommo uno che è la seconda immagine in sequenza e trovo il link

ma mi chiedevo per non stravolgere del tutto il codice non c'è modo di passare immagine di copertina vera e non quella di combinazione?

 {include file='catalog/_partials/product-image.tpl' image=$coverImage type=$type}

ho provato a sostituire $product.cover con  $coverImage ma non funziona 

 

[marsaldev]

Scusami, ma non credo sia l'approccio corretto.

Può funzionare fintanto che le immagini vengono caricate in sequenza sullo stesso prodotto, ma se vengono caricate in momenti diversi il progressivo "salta" e con esso la visualizzazione corretta delle immagini 😊

Puoi passare informazioni ai tpl che includi, la sintassi è quella, però ti conviene prendere le immagini come ti ho scritto prima.

Nel template recente non trovo il file product-image.tpl, il file che viene utilizzato nel listato prodotti è questo:

catalog/_partials/miniatures/product.tpl

Lascia perdere quel codice, devi cambiarlo 'radicalmente', devi prenderti tutte le immagini con la classe Image, controllare che ce n'è siano altrimenti mostrare l'immagine di default, dopodiché prenderti la prima e se presente la seconda, a prescindere dalla cover.

[ilario]

ti ringrazio del controllo , effettivamente  non va bene, pensavo che andasse a prendere le immagini in sequenza che vedo nella scheda  prodotto in B.O. e le avevo messe prima e seconda e caricate di seguito, ma se cambio immagine aggiungendone una nuova non va più bene

 

so di chiederti tanto, ma riusciresti a crearmi per cortesia il ciclo, riesco a capirlo il codice , ma non sono abbastanza competente nel crearlo da zero

 

grazie mille

ilario

[ilario]

sono riuscito piu tardi metto il codice  usando $image

grazie mille

 

[ilario]

{block name='product_thumbnail'}
      <a href="{$product.url}" class="relative{foreach from=$product.images item=image}{if (($image.cover != 1) && ($product.cover.id_image != $image.id_image))} subimage-true{break}{/if}{/foreach}">
        
		{assign var='allProductImages' value=Image::getImages($language.id, $product.id)}
		
		{if  isset($allProductImages[0])}
           
		    <img src="{$link->getImageLink($product.link_rewrite, $product.id_product|cat:"-"|cat:$allProductImages[0].id_image)}" width="{$product.cover.bySize.$type.width}" height="{$product.cover.bySize.$type.height}" class="smooth05 cover-image" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}" data-full-size-image-url="{$product.cover.large.url}" />
 
		   {if Configuration::get('pm_hover_image') == true}
		 <img src="{$link->getImageLink($product.link_rewrite, $product.id_product|cat:"-"|cat:$allProductImages[1].id_image)}" width="{$product.cover.bySize.$type.width}" height="{$product.cover.bySize.$type.height}" class="smooth05 cover-image" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}" data-full-size-image-url="{$product.cover.large.url}" />
    {/if}
		  
        {else}
          <img src="{$urls.no_picture_image.bySize.large_default.url}" style="width:100%;">
        {/if}
      </a>
      {/block}

sicuramente è migliorabile ma adesso funziona nel modo corretto , infatti se provo a cambiare la sequenza delle immagini nel prodotto mi prende sempre la 1 e la secondo come nella scheda prodotto

 

grazie mille

Ilario

[marsaldev]

Ciao @ilario,

perfetto! Scusami, purtroppo non riesco ad essere tempestivo nel rispondere 😊

Io aggiungerei:

{if Configuration::get('pm_hover_image') == true AND isset($allProductImages[1])}

Così controlli se effettivamente c'è una seconda immagine caricata

 

[ilario]

<perfetto! Scusami, purtroppo non riesco ad essere tempestivo nel rispondere 😊

 

figurati anzi sei stato gentilissimo a suggerirmi tutto

inserisco anche il controllo grazie mille

Ilario

[marsaldev]

1 hour ago, ilario said:

figurati anzi sei stato gentilissimo a suggerirmi tutto

inserisco anche il controllo grazie mille

Ilario