Jump to content

Mettre une condition d'affichage dans un fichier TPL


Recommended Posts

Bonjour,
 
J'ai un fichier TPL qui gère l'affichage d'une partie de ma première page. Dans ce fichier, il y a une fonction qui gère l'affichage du nom du produit et qui la tronque à 17 caractères. C'est bien pour les petits écrans mais pour ceux qui peuvent afficher 1200px, c'est franchement dommage, je pourrait passer à 30.
 
Donc voilà ma question, elle est simple mais pour un bidouilleur pas trop mauvais mais en tout cas pas un programmeur, c'est un peu plus compliqué.
J'aimerai mettre une condition du genre si l'affichage est à 1200 => $product.name|truncate:30 et sinon $product.name|truncate:17
 
La ligne en question qui agit sur ce paramètre...
<h5><a href="{$product.link}" title="{$product.name|truncate:50:'...'|escape:'htmlall':'UTF-8'}">{$product.name|truncate:17:'...'|escape:'htmlall':'UTF-8'}</a></h5>

Merci à celui qui pourra m'aider !

 

Thierry

Share this post


Link to post
Share on other sites

Pour ça, il faudrait passer la largeur de l'écran (que tu peux avoir en JS) au tpl

 

Un autre moyen (peut-être plus propre), serait de faire ça en CSS avec du responsive :

- tu mets deux balises <a href...>, avec des id différentes, et des truncate différents

- dans ta CSS, avec les media queries, tu fais un display:none de l'id qui ne correspondant pas à ta résolution

Share this post


Link to post
Share on other sites

Merci à vous deux pour vos réponses... 

 

Ca me parrait de bonnes idéee...  :blink: ou plutôt j'en sait rien car vous me parlez chinois...   :D mais ce sont des pistes que notre amis à tous devrait m'éclaircir !

 

Merci encore !

Share this post


Link to post
Share on other sites

Je reviens vers vous...

J'ai un peu planché (juste quelques heures... ;) ) sur ce qui vous parait surement simple et j'ai finalement mis ça dans mes css en suivant la piste de coeos.pro : 

 

	overflow: hidden; 
	white-space: nowrap;
	text-overflow: ellipsis;
Ca me donne à peu de chose ce que je cherchais. Est-ce que c'est propre ? Edited by picnoc (see edit history)

Share this post


Link to post
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

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More