Styliser les pages principales<\/h5>\n\n\n\n
Lorsque vous installez et activez MemberMouse sur votre site Web, vous constatez qu'un ensemble de pages est cr\u00e9\u00e9. Il s'agit des pages principales. Lisez cet article pour\u00a0en savoir plus sur les pages centrales<\/a>. les pages principales sont des pages sp\u00e9cifiques \u00e0 MemberMouse qui sont dot\u00e9es d'\u00e9l\u00e9ments utiles.\u00a0SmartTags\u2122<\/a>\u00a0pour faciliter le fonctionnement de votre site d'adh\u00e9sion.<\/p>\n\n\n\n Il y a un total de 9 pages de base que les membres utiliseront ind\u00e9pendamment des droits d'acc\u00e8s de l'utilisateur ou du produit achet\u00e9. Vous pouvez cr\u00e9er des pages de base suppl\u00e9mentaires qui peuvent \u00eatre personnalis\u00e9es pour offrir une exp\u00e9rience utilisateur dynamique \u00e0 vos membres. Un grand nombre de ces pages principales sont accompagn\u00e9es de feuilles de style sp\u00e9cifiques avec des param\u00e8tres CSS propres \u00e0 cette page. Il s'agit notamment de :<\/p>\n\n\n\n Par d\u00e9faut, dans une nouvelle installation de MemberMouse, les feuilles de style CSS des cinq pages principales \u00e9num\u00e9r\u00e9es ci-dessus sont contr\u00f4l\u00e9es automatiquement par MemberMouse.<\/p>\n\n\n\n Si l'une de ces pages centrales ne s'affiche pas correctement (par exemple, il n'y a qu'une seule colonne ou le bouton Paypal ne s'affiche pas), vous devez v\u00e9rifier que MemberMouse charge la feuille de style.<\/p>\n\n\n\n Suivez les \u00e9tapes ci-dessous pour activer ou d\u00e9sactiver l'int\u00e9gration automatique par MemberMouse des feuilles de style CSS de votre page principale :<\/p>\n\n\n\n Vous pouvez voir cette r\u00e9f\u00e9rence \u00e0 la feuille de style dans les pages principales \u00e9num\u00e9r\u00e9es ci-dessus :<\/p>\n\n\n\n Une autre option pour styliser vos pages consiste \u00e0 copier les feuilles de style CSS de MemberMouse. La derni\u00e8re section de cet article contient les liens vers les feuilles de style disponibles \u00e0 t\u00e9l\u00e9charger. Ensuite, vous pouvez modifier la r\u00e9f\u00e9rence CSS dans le code de votre page principale pour refl\u00e9ter l'emplacement de cette nouvelle feuille de style, comme ceci : Lorsque vous ouvrez l'inspecteur d'\u00e9l\u00e9ments, vous pouvez l'utiliser pour localiser les div ID ou les classes que vous voyez dans le code de votre page. Dans l'exemple ci-dessous, j'ai localis\u00e9 la div id=\"mm-account-information-section\" \u00e0 laquelle est appliqu\u00e9e la classe \"mm-checkoutInfoBlock\" : Si nous voulions appliquer une couleur d'arri\u00e8re-plan, alors dans la feuille de style mm-checkout.css, nous ajouterions simplement :<\/p>\n\n\n\n \u00e0 la feuille de style. Ce type d'\u00e9dition est disponible pour toute propri\u00e9t\u00e9 CSS que vous souhaitez appliquer. Vous pouvez \u00e9galement supprimer des classes CSS si vous le souhaitez.<\/p>\n\n\n\n Le plugin MemberMouse est con\u00e7u pour \u00eatre aussi ind\u00e9pendant que possible de votre th\u00e8me, de sorte que le passage d'un th\u00e8me \u00e0 un autre ne n\u00e9cessite que peu ou pas de mise \u00e0 jour...<\/p>","protected":false},"author":9645,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_strive_editorial_status":"not-started","_strive_copy_of":0,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"ht-kb-category":[160],"ht-kb-tag":[],"class_list":["post-8020","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-customize-mm"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/ht-kb\/8020","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/users\/9645"}],"replies":[{"embeddable":true,"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/comments?post=8020"}],"version-history":[{"count":0,"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/ht-kb\/8020\/revisions"}],"wp:attachment":[{"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/media?parent=8020"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/ht-kb-category?post=8020"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/membermouse.com\/fr\/wp-json\/wp\/v2\/ht-kb-tag?post=8020"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n<\/ul>\n\n\n\nPage principale Param\u00e8tres CSS int\u00e9gr\u00e9s<\/h6>\n\n\n\n
\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n![\"\"](\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2023\/09\/a5d8dfbb-jcrzd6nj-tmttpiug8mlcut6wfhh80hosq.png\")
<\/li>\n\n\n\nLocalisation de la r\u00e9f\u00e9rence de la feuille de style CSS<\/h5>\n\n\n\n
\n
<\/li>\n\n\n\n![\"\"](\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2023\/10\/746730b7-screen-shot-2023-10-02-at-12.37.49-pm.png\")
<\/li>\n\n\n\n![\"\"](\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2023\/10\/9cacefe3-screen-shot-2023-10-02-at-12.38.42-pm.png\")
En vertu de la\u00a0Type de page principale<\/em>\u00a0vous verrez le type de page centrale, ainsi que si la page est la page par d\u00e9faut pour tous les utilisateurs. Si l'ic\u00f4ne du drapeau appara\u00eet \u00e0 c\u00f4t\u00e9 de la page\u00a0Type de page principale<\/em>cette page est la page par d\u00e9faut. La page par d\u00e9faut sera utilis\u00e9e pour tous les membres qui n'ont pas de page principale diff\u00e9rente assign\u00e9e \u00e0 leur niveau d'adh\u00e9sion ou \u00e0 leur offre group\u00e9e de produits.
<\/li>\n\n\n\n![\"\"](\"https:\/\/s3.amazonaws.com\/cdn.freshdesk.com\/data\/helpdesk\/attachments\/production\/9064346183\/original\/7bGjCy7GVUh5qwcHIuc8ZpFl_sOA58tsQA.png?1541603890\")
<\/li>\n\n\n\n![\"\"](\"https:\/\/www.dropbox.com\/s\/zyog1pko7mse13x\/9019.png?raw=1\")
<\/li>\n\n\n\n
<link rel='stylesheet' type='text\/css' href='http:\/\/www.yourURL.com\/wp-content\/plugins\/membermouse\/resources\/css\/user\/mm-checkout.css' \/><\/li>\n<\/ol>\n\n\n\nModification de l'emplacement de la feuille de style CSS par d\u00e9faut<\/h5>\n\n\n\n
\u00a0<link rel='stylesheet' type='text\/css' href='http\/\/:www.yourURL.com\/sitespecifics\/customestylesheet.css'\/><\/p>\n\n\n\nModification des feuilles de style de MemberMouse<\/h5>\n\n\n\n
NOTE :\u00a0<\/em><\/strong>L'une des meilleures fa\u00e7ons de voir ce que ce code affiche r\u00e9ellement est d'utiliser l'inspecteur d'\u00e9l\u00e9ments dans votre navigateur. Si vous ne savez pas comment utiliser l'inspecteur d'\u00e9l\u00e9ments, lisez le document suivant\u00a0<\/em>cet article pour Google Chrome<\/em><\/a>ou\u00a0<\/em>cet article pour Firefox<\/em><\/a>.<\/em>
Vous avez toujours la possibilit\u00e9 de modifier les feuilles de style CSS fournies par MemberMouse pour les adapter \u00e0 vos besoins. Pour cet exemple, nous examinerons la feuille de style utilis\u00e9e sur la page d'accueil de\u00a0Passer \u00e0 la caisse\u00a0<\/em>page de base.
Voici une section de la\u00a0Passer \u00e0 la caisse<\/em>\u00a0code de la page :<\/p>\n\n\n\n[MM_Form_Section type='accountInfo']\n<div id="mm-account-information-section" class="mm-checkoutInfoBlock">\n<h3>Informations sur le compte<\/h3>\n<p class="mm-formField">\n <label>Prénom :<\/label>\n [MM_Form_Field type='input' name='firstName']\n<\/p><\/code><\/pre>\n\n\n\n![\"\"](\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2023\/10\/e2d9bbfa-9020.png\")
<\/p>\n\n\n\ncouleur de fond : #333 ;<\/code><\/p>\n\n\n\nUtilisation de classes personnalis\u00e9es sur les \u00e9tiquettes intelligentes<\/h5>\n\n\n\n
Si vous pr\u00e9f\u00e9rez appliquer des classes d\u00e9j\u00e0 cr\u00e9\u00e9es \u00e0 vos pages principales, vous pouvez \u00e9galement le faire. C'est une excellente option si votre th\u00e8me contient des classes CSS d\u00e9j\u00e0 pr\u00e9par\u00e9es que vous pouvez r\u00e9utiliser. NOTE :<\/em><\/strong> Si vous ne savez pas comment les classes CSS sont utilis\u00e9es en HTML, <\/em>veuillez lire cet article<\/em><\/a>.<\/em>
Pour utiliser une classe CSS personnalis\u00e9e, vous devez conna\u00eetre le nom de la classe que vous souhaitez utiliser. Pour ce faire, il vous suffit de regarder le code de votre page principale (en suivant les \u00e9tapes suivantes<\/a>) Ensuite, lorsque vous connaissez l'\u00e9l\u00e9ment que vous souhaitez modifier, il vous suffit de remplacer la classe existante :<div id="mm-account-information-section" class="mm-checkoutInfoBlock"><\/code>
avec votre nouvelle classe CSS<div id="mm-account-information-section" class="myownclass"><\/code>
<\/a><\/p>\n\n\n\nUtilisation des styles de boutons de MemberMouse<\/h5>\n\n\n\n
Lorsque MemberMouse est activ\u00e9 sur votre site Web, vous avez acc\u00e8s \u00e0 plus de 60 styles de boutons Web 2.0. Lisez cet article pour apprenez \u00e0 utiliser ces styles de boutons sur votre site<\/a>.
<\/a><\/p>\n\n\n\n
Exemples de feuilles de style CSS<\/h5>\n\n\n\n
Vous trouverez ci-dessous des liens vers les feuilles de style CSS utilis\u00e9es sur certaines pages centrales et dans le widget de contenu prot\u00e9g\u00e9 :<\/p>\n\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n