Jump to content

Problème developpement page produits


Recommended Posts

Bonjour, je rencontre un problème pour le developpement de mes pages produits, je vais essayer de m'expliquer le plus clairement possible : 

Je précise que j'ai acheté un thème mais que j'ai apporté de grosse modification a ce dernier.

 

Alors, mon problème est que je suis actuellement en train de designer mes pages produits sauf que je suis "obligé" de le faire une par une (obligé entre guillemets parceque je suis sans doute nul, ce qui explique pourquoi j'ai un problème)

 

En fait, je suis obligé de le faire une par une (c'est a dire coder en commencant par .product-id-#) parceque si je le code de manière générale (par exemple commencer directement par .button : [...]) ceci ne s'applique pas correctement sur toutes les pages, par exemple sur la page produit 1 ça va être à 20centimetre du menu, sur la page produit 2 à 80cm, etc...)

Je précise que j'ai codé le positionnement avec des top, right, left , bottom, peut être etait ce mieux de le faire en margin ou en padding ?  (je suppose que c'est ça qui fait que le positionnement n'est jamais le meme selon les pages et la longueur de la description ?)

Comme je l'ai dit entre parenthèse, si je rajoute une ligne a la description du produit, l'élément dont j'ai modifié la position se décale vers le bas ou le haut, sans doute a cause du "position : relative" ?

Du coup mes questions son : est ce à cause du "position : relative" que le positionnement n'est jamais le même selon les pages ? Faut t--il donc que j'utilise des marges/padding a la place ?

J'utilisais position relative car je n'arrivais pas tout le temps à mettre mes éléments a la bonne place avec les marges/padding, mais est ce que  si je me force a les utiliser, cela pourrais régler mon problème ?

 

Désolé si ce n'est pas clair, je répondrais a vos questions s'il y en a.

Je vous met mon code CSS en piece jointe

Le site est actuellement en maintenance mais je pourrais le mettre en ligne si besoin, mais pour l'instant je voulais savoir si c'etait vraiment ma maniere de positionner les élément qui est problématique (ce qui est surement le cas)

Merci

custom.css

Share this post


Link to post
Share on other sites

  • 2 weeks later...
On 6/23/2021 at 9:11 AM, jalas8785 said:

Bonjour, je rencontre un problème pour le developpement de mes pages produits, je vais essayer de m'expliquer le plus clairement possible : 

Je précise que j'ai acheté un thème mais que j'ai apporté de grosse modification a ce dernier.

 

Alors, mon problème est que je suis actuellement en train de designer mes pages produits sauf que je suis "obligé" de le faire une par une (obligé entre guillemets parceque je suis sans doute nul, ce qui explique pourquoi j'ai un problème)

 

En fait, je suis obligé de le faire une par une (c'est a dire coder en commencant par .product-id-#) parceque si je le code de manière générale (par exemple commencer directement par .button : [...]) ceci ne s'applique pas correctement sur toutes les pages, par exemple sur la page produit 1 ça va être à 20centimetre du menu, sur la page produit 2 à 80cm, etc...)

Je précise que j'ai codé le positionnement avec des top, right, left , bottom, peut être etait ce mieux de le faire en margin ou en padding ?  (je suppose que c'est ça qui fait que le positionnement n'est jamais le meme selon les pages et la longueur de la description ?)

Comme je l'ai dit entre parenthèse, si je rajoute une ligne a la description du produit, l'élément dont j'ai modifié la position se décale vers le bas ou le haut, sans doute a cause du "position : relative" ?

Du coup mes questions son : est ce à cause du "position : relative" que le positionnement n'est jamais le même selon les pages ? Faut t--il donc que j'utilise des marges/padding a la place ?

J'utilisais position relative car je n'arrivais pas tout le temps à mettre mes éléments a la bonne place avec les marges/padding, mais est ce que  si je me force a les utiliser, cela pourrais régler mon problème ?

 

Désolé si ce n'est pas clair, je répondrais a vos questions s'il y en a.

Je vous met mon code CSS en piece jointe

Le site est actuellement en maintenance mais je pourrais le mettre en ligne si besoin, mais pour l'instant je voulais savoir si c'etait vraiment ma maniere de positionner les élément qui est problématique (ce qui est surement le cas)

Merci

custom.css 65 kB · 1 download

Bonsoir, 

C'est excessivement lourd de travailler le CSS de chaque page produit, je pense que niveau ergonomie et rapidité, c'est à l'opposé de ce qu'on cherche à faire généralement, à savoir, alléger le code au maximum.

Je pense qu'il faut surtout revoir la globalité de la structure, pour avoir quelque chose de cohérent systématiquement.

Je m'explique : dans le cas d'une position particulière pour un produit, généralement, on cherche à avoir un positionnement identique ailleurs, de ce fait, tout est identique.

Si cela concerne par contre, une description par exemple : aucun intérêt de travailler en CSS, il faut travailler en html directement, qui sera chargé avec le produit, et non dans le CSS (qui lui sera chargé systématiquement dès la page d'accueil, autant dire, beaucoup de données qui serviront pour une ou deux pages produit visitées par exemple).

Le bouton évoqué peut aussi se voir attribué un ID dans le cas ou il n'a qu'une classe, ce qui l'appliquerait à tous les boutons ayant cette classe (exemple avec un bouton standard bootstrap).

Attention aussi à la partie mobile, il faut vérifier ce que ca donne via l'outil dev de chrome par exemple, car appliquer un positionnement sur PC ne sera peut être pas du tout adapté au mobile.

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