Titre: un bouton qui affiche une image dans une pop up
Posté par: christineParis le le 10-09-2015 a 02:28:42
Bonjour à tous !
Je lance mon business. Comme je n'ai pas de budget , je fais mon site ! je ne connaissais rien au code, mais je m'y mets ! Bon, j'utilise Woocommerce de Wordpress, c'est pas non plus très compliqué.
Mais, j'ai une question (2 en fait). Et un grand merci d'avance à la bonne âme qui voudra bien me répondre.
1) je souhaiterais faire un bouton, qui, lorsqu'on clique dessus, ouvre une petite fenêtre avec une image dedans.. Je peux intégrer du code dans wordpress, mais lequel pour ça ??
2) l'idéal, ce serait que cette image qui s'affiche, dépendent d'une autre donnée ..
je vais être plus claire :
- je voudrais simuler l'effet d'un motif sur un support : un coussin par exemple.
- mon client sera sur la fiche produit du motif
- en bas de cette fiche, il y aura les supports sur lesquels il peut être imprimé
- je lui demande de sélectionner le support qu'il a choisi (soit en cliquant sur l'image, soit via une encoche en dessous, ...enfin le plus simple pour la formule qui va suivre)
-.. et de cliquer sur un bouton pour voir la simulation du motif su le support !!
Donc, s'il a sélectionné le coussin, c'est l'image de simulation du motif sur le coussin qui doit s'afficher. S'il a sélectionné le mug, c'est l'image de simulation du motif sur le mug qui doit s'afficher, etc...
Est ce que je suis claire ?
merci en tout cas..
Christine
:-[ :-[ |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: Remi .L le le 10-09-2015 a 09:41:10
Salut à toi !
Grâce à woocommerce tu peux te servir des déclinaisons pour changer l'image en fonction de la déclinaison choisie. (Option produit variable dans la fiche du produit)
Voici une vidéo explicative qui t'aidera, c'est un peu long a expliquer comme sa :
http://www.dailymotion.com/video/x129z09_tutoriel-les-produits-variables-dans-woocommerce_tech
Tu pourras donc faire en sorte que quand la personne clique pour choisir son motif, l'image change aussi (ou en survol).
Rémi |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: christineParis le le 10-09-2015 a 11:19:15
Chèr Rémi,
Je connaissais le principe des produits variables, mais je n'avais pas du tout pensé à l'utiliser pour ça. Et je trouve que c'est une super idée !!!!! (ça resoud meme d'autres problemes que j'avais..) Tu viens donc d'illuminer ma journée !
Pour la peine, quand mon site sera lancé, je t'offrirai le produit de ton choix, et je n'ai qu'une parole ! ( je pourrai te retrouver sur ce site?)
Un grand merci à toi :D :D :D, tres bonne journee.
Christine |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: Remi .L le le 10-09-2015 a 14:51:43
Oh c'est vraiment gentil, sa sera avec grand plaisir !
Tu peux visiter mon site ( http://www.rémi.fr) pour obtenir mes coordonées au cas ou je ne suis pas ici ;D |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: christineParis le le 14-09-2015 a 16:42:36
Bonjour Rémi !
Comme tu sembles être un pro, en wordpress notamment, je me permets de te poser une autre question..
Je souhaiterais modifier l'apparence de ma page produit, ainsi que celle de ma boutique d'ailleurs.
Sur la page produit, je voudrais :
- modifier les titres (ils sont mis en h1, parfois h2, et je voudrais les mettre en h3 ou h4)
- réduire la taille des images de la galerie associée au produit, qui sont beaucoup trop grande je trouve
et sur ma page Boutique modifier la typo des noms des produits (pareil pouvoir choisir entre h4 ou h5..)
J'ai regardé sur le fichier style.css, j'ai pas trouvé :'( En meme temps, comme je te le dirais, suis pas une experte, et... il fait 3000 lignes ! D'ailleurs, je ne sais meme pas si c'est sur ce fichier qu'il faut regarder ??
Si tu pouvais m'aider, ce serait topo !
merci !
A plus,
Chrisitne |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: ordiclic le le 14-09-2015 a 17:05:49
Bonjour,
Pour modifier les fichiers afin que les titres passent automatiquement de h1/h2 en h3/h4, il faut éditer les fichiers du thèmes, cela ne se fera pas correctement en css.
En css tu pourrait réduire la taille des h1/h2, en utilisant un custom css (en plugin intégré à jetpack, entre autre) et en insérant ceci:
Code:
h1 {
font-size: xxxx px;
}
h2 {
font-size: xxxx px;
} |
|
Après il faut essayer différentes tailles "xxxx" pour voir ce qui colle avec ton style. |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: christineParis le le 15-09-2015 a 00:04:21
Merci pour ton message. Mais en fait, je ne sais pas dans quel fichier mettre ce code...
j'ai mis toutes mes typos et leur taille dans le Typekit Font dans Reglages, pour h1, h2, h3, p etc... Mais la page produit prend d'office le h1 pour le nom du produit, le h2 pour le titre description du produit, etc.. C'est ça que je voudrais changer... |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: ordiclic le le 15-09-2015 a 00:21:12
Tu installe ce plugin:
https://wordpress.org/plugins/simple-custom-css/
Après dans apparence css, tu pourras insérer le code. |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: ordiclic le le 15-09-2015 a 00:22:50
Celui là à l'air bien, mais je l'ai pas testé, a voir !
https://wordpress.org/plugins/yellow-pencil-visual-theme-customizer/ |
Titre: Re:un bouton qui affiche une image dans une pop up
Posté par: Remi .L le le 15-09-2015 a 10:05:20
Hey !
Pour insérer du code facilement tu peux te servir de l'éditeur de css présent dans wordpress.
Connecte-toi sur ton backoffice Wordpress--> Apparence--> Editeur.
A droite tu verras plusieurs fichiers notamment des .php et des .css
En général les thèmes disposent d'un fichier customs.css qui permet d'injecter du css.
Pour changer la police taille etc ... il faut donc changer les balises H1 -> H6
(Attention, il ne faut pas se servir des balises pour la taille du texte ! les balises H1 ->H3 sont des éléments clés du référencement !!) La grosse erreur de débutant et de s'en servir pour mettre en page le texte ... à ne pas faire ! Utilise les balises H1 -> H3 pour les mots et phrases importantes du site.
Pour en revenir au code, comme disait Walko29, utilise le code suivant :
Code:
h1 {
font-size: xxxx px;
}
|
|
Pour définir la taille de tes titres, cependant, il faut insérer la balise !important pour passer au-dessus du style déjà en place ex :
Code:
h1 {
font-size: 30 px !important;
}
|
|
la balise ! important permet de passer au dessus des règles existantes si il existe déjà des feuilles de style définissant la règle que tu est en train de modifier. ( meme si il me semble que ie ne la prend pas en compte)
|
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|