Rendre personalisable le fond pour internaute

adamadu10 Messages postés 71 Statut Membre -  
adamadu10 Messages postés 71 Statut Membre -
Bonjour,
j'aimerai un code pour rendre personnalisable le fond de mon site web pour le internaute.
il faudrait qu'ils choisissent entre plusieurs fond.
merci.

pour plus d'info faite le moi savoir


1 réponse

avion-f16 Messages postés 20367 Statut Contributeur 4 509
 
Salut,

Je ne te donnerai pas de code déjà fait.
Par contre, je peux te guider.

Sur une page listant les thèmes disponibles, tu crées pour chaque thème un bouton (ou un lien).
Au clic (onclick), tu fais appel à une fonction Javascript en passant le nom du fichier CSS en arguement.
Il faut également déclarer cette fonction, et utilise la valeur indiquée en argument pour écrire un cookie.

Dans chaque page, tu vérifies si le cookie existe : si oui, tu utilises le fichier CSS indiqué, sinon, tu utilises celui par défaut.

Par "utilises", il faut en réalité créer la balise <link /> par Javascript (DOM - DHTML) et l'inclure (append) à la balise <head>.

Bonne recherche :)
1
adamadu10 Messages postés 71 Statut Membre 5
 
vous pouvez meme pas mettre genre <link> javascript=imagede votre chois<link
stp
0
avion-f16 Messages postés 20367 Statut Contributeur 4 509
 
Non, on invente pas son propre langage.
Tu as encore beaucoup de chemin à faire pour ça.

Ce que tu montres, ça ressemble à rien.
C'est <link /> ou <link> seul, pas <link>{quelque-chose}</link>
0
adamadu10 Messages postés 71 Statut Membre 5
 
je c mais donne un exemple si tu ve bien bien sur
0
avion-f16 Messages postés 20367 Statut Contributeur 4 509
 
Le HTML, sur la page de sélection :
<div class="bg_group">
    <img src="img/bg1_thumb.png" alt="Fond 1">
    <a href="#" onclick="choose('style1.css');">Choisir</a>
</div>

<div class="bg_group">
    <img src="img/bg2_thumb.png" alt="Fond 2">
    <a href="#" onclick="choose('style2.css');">Choisir</a>
</div>


La fonction choose() (avant </head>, sur la page de sélection) :
<script type="text/javascript">
function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function choose(css_filename) {
    createCookie('cssfilename', css_filename, 365);
}
</script>


Et sur toutes les pages, avant </head> :
<script type="text/javascript">
function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

window.onload = function() {
    css_file = readCookie('cssfilename');
    if(css_file != null) {
        var linktag = document.createElement('link');
        linktag.setAttribute('rel','stylesheet');
        linktag.setAttribute('media','screen');
        linktag.setAttribute('href',css_file);
        linktag.setAttribute('type','text/css');

        document.head.append(linktag);
    }
};
</script>
Je l'ai directement codé dans le formulaire, il peut y avoir des erreurs de frappe.
0
adamadu10 Messages postés 71 Statut Membre 5
 
merci beaucoup
0