Condition média dans un fichier liquid ?

[alcwebmarket]

Bonjour, j'aimerai savoir s'il est possible d'ajouter une condition media dans un fichier liquid.

Je m'explique je n'utilise peut être pas les bons termes.

J'aimerai charger un élément sur mobile, et un autre sur pc, ou disons par exemple <767px et >767px.

Je sais le faire avec un display: none en CSS. @media (min-width ... etc.

Mais il se charge quand même il est juste "caché"

J'aimerai donc savoir s'il est possible depuis le fichier liquid de fixer cette condition pour qu'il ne charge qu'une fois l'élément concerné ?

Quelque chose du type :

{% if media < 767px %}

<div> lorem ipsum....</div>

{% else %}

<div> la div numéro 2</div>

{% endif %}

Merci de votre aide.

[Marie · Accepted solution]

Bonjour  @alcwebmarket!

Ici Marie de l’équipe de Gourous chez Shopify.

Si vous cherchez à cacher des éléments de votre boutique sur Mobile ou Desktop, se serait dans le fichier CSS de votre thème qu'il faudra faire l’ajustement du code.

Généralement, dans un thème, le fichier CSS ce nom theme.scss.liquid, mais ceci dépend du thème que vous utilisez.

Une première recommandation serait de toujours dupliquer votre thème avant de faire des modifications dans le code du thème, au cas où il y ait une erreur dans les modifications du code. Pour ce faire, vous devez suivre les étapes suivantes :

• Depuis votre interface administrateur Shopify, accédez à Boutique en ligne > Thèmes.
• Pour le thème que vous souhaitez dupliquer, cliquez sur Actions > Dupliquer.

De plus, si vous n’êtes pas confortable dans les modifications et ajouts de code HTML et CSS, je vous recommande fortement de contacter un Shopify Experts, pour qu’il vous aide dans l’intégration de code et personnalisation de votre boutique.

J’espère que ces informations vous aideront.

Cordialement,