Paramètre d'un site changeable par visiteur

[Victor46542]

Bonjour à tous,

j'ai une petite question. Je ne sais pas trop ou la mettre.
Je suis en train de réaliser moi même un site web, SANS utiliser de CMS (Wordpress...)

il faut que le visteur puisse modifier certains aspects du site si il en a envie (comme si il était sur un ordinateur), changer le fond d'écran parmi une selection proposée ou changer la typo des textes, l'apparence des fenêtres, l'image qui représente le curseur (a chaque fois avec un choix donné)

ces options seront dispo à part dans un onglet du site


Je pense que je dois faire appelle à un javascript ou du css ? mais quoi exactement ?

Suis-je clair dans mes explications ?
je n'arrive pas ce que je veux sur le web car il n'est pas simple de décrire en quelques mots ce que je recherche

[ludojojo]

Bonjour,

Pas sur de comprendre l'origine de ton blocage, est-ce le stockage de l'information ou le code en lui-même ?

Personnellement, je stocke l'information concernant la feuille de style choisi par l'utilisateur dans la base de données, ensuite avec du JS je swap le CSS en fonction de l'information récupérée.

[Victor46542]

Merci beaucoup pour ta réponse ça m'éclaire un peu

c'est plutot le code, je me débrouille assez bien en CSS mais je débute vraiment en JS et surtout au niveau des bases de données... par exemple, je ne serais que faire de mes différents codes CSS et où les placer exactement

Mais aussi la meilleure manière de faire car je suppose qu'il a différente façon de faire et que certaine ne sont pas bien (pour diverse raison)

[ludojojo]

Voila ce que je te propose de mettre en place.
Tu créés un dossier avec les différents fichiers CSS correspondants aux différentes masterpages. (Pour éviter les répétitions de code, utilise les @import)
Ensuite dans ta base de données, tu créés un nouvelle table comprenant les informations utilisateurs de ton site, (le pseudo, l'email... tu rajoutes un élément "style")
Ensuite dans ton code source, en PHP tu récupère l'information, voici un exemple :

Code :

1
2
3
4
5
6
7
8
9
10
11
$conn_string = "host=monhost port=monport dbname=maDB user=user password=pwd";
$dbconn = pg_connect($conn_string)
   or die("Connexion impossible");
$result = pg_query($dbconn, "SELECT * FROM MaTableUser WHERE pseudo = ".$NomDeMonUser);
if (!$result) 
{
	echo "Une erreur s'est produite : Requete.\n";
	die("Error in SQL query: " . pg_last_error());
	exit;
}

Ensuite tu rajoutes ton JS :

Code :

echo 'document.getElementById("stylesheet").href = $donnees["style"]';

Bon je n'ai pas de quoi le tester sous la main, mais c'est quelque chose de ce style. Est ce que mon raisonnement te convient ?

[Victor46542]

merci, pour ta réponse
je regarde le code en détail dès demain matin car là je n'ai pas trop le temps de vraiment m'y pencher et te dis si ton raisonnement me convient !

[Victor46542]

Euh... je suis vraiment débutant...

Pour être plus clair et mieux y voir, par exemple pour le fond d'écran, j'ai une page a part dans laquelle on voit des petits carrés représentant les fond d'écran dispo... Ce que je cherche à faire c'est dès qu'on clique sur l'un, le fond d'écran change...


Je me rend compte que je galère un peu avec les bases de donné

[Vil'Coyote]

la base de données va te permettre de stocker l'info sinon à chaque déconnexion / reconnexion les choix de ton utilisateurs seront perdus.

sinon, utilisation d'une style.php contenant les données de ton css y compris ton background lorsque tu clic sur ton carré soir passage de paramètre via l'url soit utilisation d'ajax a toi de voir et ce paramètre permet alors de changer la valeur de ton image dans ton style.php.

[ludojojo]

Envoyé par Victor46542

Euh... je suis vraiment débutant...

Pour être plus clair et mieux y voir, par exemple pour le fond d'écran, j'ai une page a part dans laquelle on voit des petits carrés représentant les fond d'écran dispo... Ce que je cherche à faire c'est dès qu'on clique sur l'un, le fond d'écran change...


Je me rend compte que je galère un peu avec les bases de donné

Coté JS, pour la réactivité et l'application de l'information, tu peux utiliser ça :

Code :

document.getElementById('body').style.backgroundImage = "url(MonImage.png)";

Envoyé par Vil'Coyote

la base de données va te permettre de stocker l'info sinon à chaque déconnexion / reconnexion les choix de ton utilisateurs seront perdus.

+1
Je pensais avoir été explicite à ce propos, apparemment pas...

[Victor46542]

Merci beaucoup de votre aide. Ça fait extrêmement plaisir !!!!!!
si si tu as été très clair, j'ai bien compris a quoi sert une base de donné

mais c'est plus moi qui ne semble être pas très clair c'est plus au niveau du code que je bloque ou de la façon dont je dois remplir la base de donné sous MAMP puis après que faire ? Et comment intégrer le code qui doit s'appliquer pour lorsqu'on clique sur un de mes carrés de couleurs on change instantané de couleurs de fond et que le fond reste même si on change de page...

voici le code HTML que j'ai pour la fonction qui change les couleurs (qui sont sur une page PHP)
je ne mets pas ici le footer et le header qui sont sur des pages à part

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="blue">

			     <link rel="stylesheet" type="text/css" media="screen" href="Bonne3.css" />

			
			<div class="blue">	
		    <a href="#"><span><img src="dossier/couleurs/gris5.png" alt="Gris 5" /></span></a>
			</div>
			<div class="blue">		
		    <a href="#"><span><img src="dossier/couleurs/jaune.png" alt="jaune" /></span></a>
			</div>

[... [et ainsi de suite j'ai 10 couleurs de plus soit 12 au total, je ne vais pas tout écrire car c'est 10 fois la même chose après...]]	
	
		</div>

j'ai donc un renvoie a ma page CSS "bonne3.css" puis mes div, pour être clair je ne serais que faire après...

je suis désolé mais je débute dans ce cas précis...

je ne serais pas vraiment ou mettre le code
document.getElementById('body').style.backgroundImage = "url(MonImage.png)"; et si je dois le recopier autant de fois que j'ai de fond d'écran différent en changeant bien sur le nom de l'image

[Victor46542]

Un ami m'a proposé ce code mais il n'a pas compris ce que je lui demandais... Car son code marche bien lorsque l'on clique sur un carré la couleur se met en fond d'écran MAIS si rafraichit la page ou change de page, ça reviens comme avant...

le script JS

Code :

1
2
3
4
5
6
7
8
		<script type="text/javascript">

		function changeBackground(llama)
		{
		body = document.getElementsByTagName('body').item('0')
		body.style.background = llama;
		}
		</script>

et ce que l'on doit mettre autour du code de chacun de mes carrés de couleurs:

Code :

1
2
3
4
5
6
7
8
9

			<span onclick="changeBackground('grey')"><div class="blue">	
		    <a href="#"> <img src="dossier/couleurs/gris5.png" alt="Gris 5" /></span></a>
			</div></span>

			<span onclick="changeBackground('yellow')"><div class="blue">		
		    <a href="#"><span><img src="dossier/couleurs/jaune.png" alt="jaune" /></span></a>
			</div> </span>

(Ici je n'en met que 2 sur les 12 couleurs dispos car c'est la même chose à chaque fois !)

On m'a conseillé d'utiliser les cookies du navigateurs, est-ce bien ?

[ludojojo]

Envoyé par Victor46542

Un ami m'a proposé ce code mais il n'a pas compris ce que je lui demandais... Car son code marche bien lorsque l'on clique sur un carré la couleur se met en fond d'écran MAIS si rafraichit la page ou change de page, ça reviens comme avant...

Voila tout l'intérêt de la base de données

Envoyé par Victor46542

On m'a conseillé d'utiliser les cookies du navigateurs, est-ce bien ?

Oui, c'est une solution, mais si l'utilisateur vide ses cookies ou change de PC, sont interface ne sera plus personnalisée...
Voici la démarche qu'il faut que tu suives :

1. Créer une table permettant le stockage des utilisateurs (pseudo + mdp)
2. Créer une table pour stocker la personnalisation (style) lié à la précédente
3. Demander une authentification pour accéder à ton site
4. Mettre en place une interface avec le javascript présent dans les précédents posts.
5. Au moment du click il faut que tu appels un script php pour effectuer l'enregistrement de l'information choisie par l'utilisateur dans ta base.
6. Mettre en place un script générique (à incorporé dans chaque page de ton site) pour récupérer l'information stockée dans la base de données.
7. Choisir le fichier CSS qui correspond à l'utilisateur.

Il s'agit de développement Web avec langage serveur. Si tu ne maîtrise pas du tout cet aspect, je t'invite fortement à consulter les tutos et la FAQ de DVP.

[Victor46542]

demander un pseudo et un Mot de passe, euh... je ne suis pas sur que ce soit bien pour moi, puisqu'il s'agit simplement de mon site perso et demander un pseudo et mot de passe risque un peu d'embeter les gens qui visite mon site perso et qui veulent voir mes réalisations et créations et mon travail...

Mais je vais regarder tous quand même merci beaucoup de l'aide !

[ludojojo]

Envoyé par Victor46542

demander un pseudo et un Mot de passe, euh... je ne suis pas sur que ce soit bien pour moi

Je n'ai jamais dit que c'était une obligation !
C'est un choix que tu proposes aux utilisateurs, si ils veulent avoir une interface personnalisée alors ils doivent s'authentifier. Dans le cas contraire ce n'est pas possible. C'est logique, enfin il me semble.
Sinon tu peux en effet utiliser les cookies, mais sache que tu n'es pas propriétaire de l'information et que l'utilisateur peut la supprimer à tout moment.

[Victor46542]

non, non je le sais bien ! J'ai peur que s'identifier les fasse fuir plus qu'autre chose... Je ne sais pas mais tu visites le site perso de quelqu'un et tu es obligé de t'inscrire...
J'ai très bien compris que pour que les changement reste de façon définitive, il faut faire une inscription

En faite si je souhaite personnalisé le site c'est simplement faire un peu comme si on était sur un ordinateur où l'on peut changer certaines fonctions.

Oui, les cookies l'utilisateurs peut les supprimer, changer d'ordinateur... Mais ce n'est pas très grave.



Ce que je veux juste que pendant la visite de mon site les changements effectués par l'utilisateurs reste mais après si la personne reviens un mois plus tard sur le site et que les changements effectués par l'utilisateur ne soit plus activé franchement ce n'est absolument pas important... je pense que les cookies sont pour moi la meilleure solution, non ??

[ludojojo]

Envoyé par Victor46542

non, non je le sais bien ! J'ai peur que s'identifier les fasse fuir plus qu'autre chose... Je ne sais pas mais tu visites le site perso de quelqu'un et tu es obligé de t'inscrire...

Encore une fois, pas d'obligation...

Envoyé par Victor46542

J'ai très bien compris que pour que les changement reste de façon définitive, il faut faire une inscription

On est OK.

Envoyé par Victor46542

Ce que je veux juste que pendant la visite de mon site les changements effectués par l'utilisateurs reste mais après si la personne reviens un mois plus tard sur le site et que les changements effectués par l'utilisateur ne soit plus activé franchement ce n'est absolument pas important... je pense que les cookies sont pour moi la meilleure solution, non ??

Oui c'est une solution. Tu peux également utiliser les variables de sessions. Il s'agit de données présentes tant que le navigateur est ouvert (enfin celon un certain delais quand même...) L'avantage c'est que si l'utilisateur désactive ses cookies sur son navigateur, ta fonctionnalité fonctionnera quand même

Donc pour ton besoin, session ou cookie.

[Victor46542]

Envoyé par ludojojo

Donc pour ton besoin, session ou cookie.

ok, super merci merci merci merci beaucoup ! je vais regarder tous ça !

[Victor46542]

oui, les sessions dure environs 30 minutes mais cela dépend du serveur. Je trouve pas mal de chose à ce sujet, mais trop peu ce que je veux précisément mais je vais chercher encore !

[ludojojo]

Envoyé par Victor46542

oui, les sessions dure environs 30 minutes mais cela dépend du serveur. Je trouve pas mal de chose à ce sujet, mais trop peu ce que je veux précisément mais je vais chercher encore !

http://www.php.net

[tho.feron]

Bonjour,

Oui c'est une solution. Tu peux également utiliser les variables de sessions. Il s'agit de données présentes tant que le navigateur est ouvert (enfin celon un certain delais quand même...) L'avantage c'est que si l'utilisateur désactive ses cookies sur son navigateur, ta fonctionnalité fonctionnera quand même

oui, les sessions dure environs 30 minutes

Je pense que quelques précisions s'imposent. Les sessions sont stockées côté serveur pour un temps choisi par celui-ci. Ce dernier récupère les données de session correspondant au visiteur grâce à l'identifiant de session stocké dans un cookie (ou dans une variable GET SESSION_ID si les cookies sont bloqués dans le cas de PHP). La durée de vie de ce cookie peut être déterminée par le serveur même si c'est évidemment sans aucune garantie.

Des variables de session peuvent donc rester sur de longues périodes et même après la fermeture du navigateur/redémarrage de l'ordinateur.

Pour illustrer, les cases à cocher du type "retenir mon mot de passe" pour ne pas devoir retaper ses identifiants à chaque fois qu'on visite ce site correspondent en fait à prolonger la validité de la session et du cookie. Le navigateur ne stocke donc pas vos identifiants (l'expression "retenir mon mot de passe" est donc un abus de langage) mais bien un identifiant de session dans un cookie.

Cordialement,
Thomas Feron.

[Victor46542]

d'abord merci por le lien, il est super

et puis merci pour les précisions !