JS

Thème sombre/clair

Résolu

Bonjour à tous !


J'ai intégré un petit bouton qui permet de changer le thème clair/sombre dans un projet. Ce dernier fonctionne très bien. Cependant quand je change de page, le thème par défaut reviens, j'aimerais que l'utilisateur qui clique sur le changement de thème garde le même et ceux même en navigant sur les différentes pages. Comment procéder ?


Mon script JS :


<script>
$("#whiteTheme").click(function(){
    if ($("body").hasClass("white")){
      $("body").removeClass("white");
    }
    else{
      $("body").addClass("white");
    }
  });
  
  $(document).ready(function () {
  });
  </script>


En fonction du clic, je vais charger la classe white (le thème par défaut est dark)


Merci !

512 vues
07 juin 2021 à 3:34 (Édité)
Cette pub permet au site de vivre ...

7 commentaires

@Space001 éh. J'y ai pas penser ! Merci pour vos solutions j'essaie ce soir. Je vous tiens au courant :D



Salut @DimitriAFC :


Pour ce faire, il va falloir rajouter une colonne dans ta table SQL 😀

Une colonne appelée par exemple "theme", quand l'utilisateur active le thème sombre tu mets 2 et le thème clair tu mets 1.

Après cela, tu n'as plus qu'a connecter ton bouton avec $_SESSION['id'] 😁

De cette manière, le thème pourra être récupéré même après déconnexion par le biais de l'identifiant de l'utilisateur et de ce fait afficher le thème auparavant sélectionné 😉


En espèrent avoir pu t'aider 😉

D'accord merci je vais essayer cette technique :).

Tu peux très bien traiter un formulaire PHP avec ton bouton de changement en JS, @DimitriAFC 😉

N'hésite pas, si besoin 😉

Salut. Merci pour ta réponse. J'avais pas penser à l'idée du Cookie je vais essayer. Sachant que mon site est en Php j'ai oublier de préciser que seul le bouton de changement du thème est en JS :)

Salut @DimitriAFC,

Je te conseille d'effectuer un enregistrement dans un cookie qui sera stocké sur l'ordinateur de l'internaute et ensuite comparer la valeur du cookie avec le thème du site

Ou alors directement enregistrer la valeur du bouton permettant de changer de thème en sql et ainsi retrouver le thème qui sera associé à l'utilisateur. L'avantage est que le thème sera permanant sur chaque navigateur 😉


Renseigne toi pour envoyer un formulaire en Ajax avec Javascript, afin d'éviter le rechargement de la page en question 😉


A +

Cette pub permet au site de vivre ...