Dimensione immagine in 'Descrizione' prodotto per tablet e cellulare

[m.vicovanu]

Buongiorno,

 

controllando le immagini inserire nella Descrizione di ogni prodotto su cellulare e tablet, ho notato che l'immagine ( nel mio caso si tratta di immagini di tabelle ) non vengono addattate al formato necessario e non si ha nemmeno la possibilità di rimpicciolire manualmente. Esiste un format massimo consigliato? Qualcuno mi può dare un consiglio? Allego screenshot.

 

Grazie

 

[ThemeBooster.com]

Qualora il tema che utilizzi sia basato sul framework Bootstrap, potrebbe essere sufficiente:

1. Editare il prodotto o la pagina dove, nel contenuto, inserisci l'immagine
2. Utilizzare il tasto "Codice Sorgente" (</>) dell'editor
3. Aggiungere all'interno del tag img la classe img-responsive
   Esempio:
   

   <img class="img-responsive" src="http://www.tuosito/percorso/tua-immagine.png" alt="" height="xxx" width="yyy" />
   

Oppure, potresti automatizzare il tutto imponendo, all'interno del file global.css una regola per le immagini che si trovino contenute in una particolare porzione del template.

Per la pagina prodotto, potresti provare ad inserire alla fine del file global.css la seguente regola:
 

div.rte .img-responsive {
  display: inline-block;
  height: auto;
  max-width: 100%;
}

 

[m.vicovanu]

Grazie per la tua risposta. Per automatizzare tutto cosa devo inserire nel global.css? Proverò ad inserire alla fine il codice da te indicato per la pagina prodotto e ti farò sapere.

[ThemeBooster.com]

Nel file global.css (alla fine):

div.rte img {
  display: inline-block;
  height: auto;
  max-width: 100%;
}

Edited August 6, 2016 by ThemeBooster (see edit history)

[m.vicovanu]

Ok. Pensavo che servisse altro. Ci proverò non appena torna il collegamento al hosting, colpa dei temporali. Ti terrò aggiornato.

Grazie.

 

PS. Mi potresti aiutare anche con l'altro post in cui mi avevi risposto?

[ThemeBooster.com]

A meno di problemi di specificità di regole CSS, dovrebbe bastare quella regola.

Appena risposto all'altra discussione.

[m.vicovanu]

Ho appena inserito il codice e controllando sul cellulare, l'immagine inserita risulta ancora grande e si vede tutta la tabella. Non vedo alcun cambiamento

[ThemeBooster.com]

Purtroppo il sito è in manutenzione e non visualizzabile.
 

Potrebbe essere anche un problema di cache sul cellulare...

[m.vicovanu]

Ho pulito la cache del cellulare e non appena torna il collegamento al hosting ( è caduto nuovamente ) vedrò se cambia qualcosa o no. Ti terrò aggiornato.

[m.vicovanu]

Va bene cosi? Vedi allegato

global.css

[ThemeBooster.com]

Scusa, errore mio.
Ecco il codice da aggiungere al posto del precedente:

div.rte img {
  display: inline-block;
  height: auto;
  max-width: 100%;
}

 

[m.vicovanu]

Non fa niente. Ho sostituito il codice con quest'ultimo e non cambia nulla.

[m.vicovanu]

Per cortesia mi puoi aiutare per trovare una soluzione per caricare le mie tabelle? Al momento le immagini non si adattano al cellulare e tablet, e non si ha nemmeno la possibilità di spostarle o rimpicciolirle. Ci sarà un'altra soluzione ma che a me non viene in mente in questo momento?

[ThemeBooster.com]

Ciao,
puoi indicare la URl di una pagina in cui hai inserito un'immagine di tabella?

[m.vicovanu]

http://www.interfer.it/36-gsn

 

99% dei prodotti hanno immagini di tabelle.

Grazie

Edited August 8, 2016 by m.vicovanu (see edit history)

[ThemeBooster.com]

Controllando l'output della pagina ed il file global.css, sembra che in esso vi sia ancora la vecchia regola:
 

div.rte .img-responsive {
  display: inline-block;
  height: auto;
  max-width: 100%;
}

che invece deve essere modificata in:
 

div.rte img {
  display: inline-block;
  height: auto;
  max-width: 100%;
}

[m.vicovanu]

Hai ragione,on avevo caricato il file modificato.  Purtroppo, anche con ill file modificato, non funziona lo stesso. Cosa ne pensi?

[ThemeBooster.com]

La regola sembrerebbe funzionare: ridimensionando un browser da desktop l'immagine si autoadatta in maniera proporzionale.
 

Ciò non accade da dispositivo mobile: controlla che in Preferenze > Temi: tab MOBILE, sia disattivata l'opzione "Attiva tema mobile" ma
potrebbe essere dovuto all'utilizzo delle tab o a qualche regola css del tema utilizzato...

[m.vicovanu]

Tab mobile era attivo. Una volta disattivato funziona tutto correttamente. Problema risolto.

Bravissimo e ancora una volta abbiamo risolto un mio problema insieme. Grazie di cuore

[ThemeBooster.com]

Perfetto.
Buon continuo allora.

[Tony M.]

Salve,

mi unisco anch'io alla discussione perchè ho un problema di formattazione delle foto, video e tabelle quando quest'ultime vengono visualizzate da palmare. In pratica non vengono adattate allo schermo del palmare. C'e' qualche soluzione?

Prestashop 1.7.6 e tema basato su LeoTheme (Kinzy)

 

Saluti e grazie.

Tony - B2B DRONE - www.b2bonline.it

 

 

Edited April 27, 2021 by Tony M. (see edit history)