Changeur de style

ou styleswitcher en anglais (ca fait plus classe ^^)

en tout il y a 3 partie qui peuvent etre mise au minimum dans 2 fichier php

sur la page d'index on va vérifier si l'utilisateur a déja choisi un style ou pas.

Code:: <?php
//on récupere la variable Cookie dans style
$style = $_COOKIE["style"] ;

//si la variable n'est pas vide ca veut dire que le cookie existe
if (!empty ($style)){

//on charge alors la feuille avec le style choisi (la variable style contient en fait 1,2 ou 3)
//les feuilles de style sont appeler style1.css, style2.css etc...
echo '<style>'.
'@import url(style'.$style.'.css);'.
'</style>';

}else{

//si la variable est vide le cookie n'existe pas donc on charge la feuille de style par defaut
echo '<style>'.
'@import url(style1.css);'.
'</style>';
}

?>

ensuite cette partie sert a choisir les style on peu la mettre dans l'index, ou dans une page ailleur, il y a deux partie si l'on veut dans celle la.

- la premiere purement graphique qui permet de choisir (html classique)

Code:: <parti>
<li><a href="javascript:ecrire_cookie(1);"><img src="images/bouton/style1.gif" alt="Style N°1" height="40" width="40"></a></li>
<li><a href="javascript:ecrire_cookie(2);"><img src="images/bouton/style2.gif" alt="Style N°2" height="40" width="40"></a></li>
<li><a href="javascript:ecrire_cookie(3);"><img src="images/bouton/style3.gif" alt="Style N°3" height="40" width="40"></a></li>
</ul>

- la seconde en javascript qui permet de lancer la procedure de changement

Code:: <SCRIPT>

function ecrire_cookie(valeur) {
//la fonction concatene le page a ouvrir avec la valeur de la feuille de style pour la passer dans l'url
pup1="styleswitch.php?style="+valeur ;
//et ensuite on ouvre un popup
window.open(pup1,'Informations','width=500,height=100,left=350,top=250,screenX=10,screenY=50,toolbar=no,location=no, rectories=no,status=no,menubar=no,scrollbars=yes,copyhistory=no,resizable=no');
}

</SCRIPT>

et enfin le contenu de la page appeler par la fonction javascript qui créer le cookie.

Code:: <?php

//On test si il s'agit bien d'un numéric qui est passé en parametre dans l'url
//et on verifie que l'utilisateur ne rentre pas a la main un numéro de feuille de style qui n'existe pas.
if (is_numeric($_GET['style']) and $_GET['style'] < '4' ) {

//On met la date d'expiration du cookie - ici 1 ans (valeur toujours exprimé en seconde)
$expire = 365*24*3600;

//on créer le cookie avec : setcookie(lenom,lavaleur,ladurée); plus d'info ici http://www.php.net/setcookie
//setcookie doit etre envoyer avant tout autre envoi au navigateur (restriction http)
setcookie("style",$_GET['style'],time()+$expire);

//on met le style choisie a la page pour prévisualisé
echo '<style>'.
'@import url(style'.$_GET['style'].'.css);'.
'</style>';

//et on met un petit message a l'utilisateur
echo "Vous avez changer le style, si le changement ne s'effectue pas recharger la page. Si cela ne fonctione toujours pas c'est que vous devez avoir désactivez les cookies";
}else{

//si l'utilisateur a voulu gruger on lui affiche un message
echo "Erreur le style que vous voulez n'est pas dispo";
}

?>


<body>
</body>

vala rien de bien compliquer en fait ^^ c'est facile a implémenter. je vais voir pour faire une version sans la fenetre qui s'ouvre et qui change automatiquement le style. si ya des question n'hesitez pas ^^

yerrrr la classe halu :p

Modo Nombre de messages : 1454 Age : 44 Date d'inscription : 11/01/2006

J'y comprends rien en programmation mais merci halu ^^

j'ai fait une nouvelle version mais ca merde sous ie je sais pas pkoi :s ca marche au debut et puis il bloque sur un style et ca change pu -_-

désolé pour le double post

Nouvelle version sans popup

Dans le fichier qui fait le changement.

Code:: <?php

//On test si il s'agit bien d'un numéric qui est passé en parametre dans l'url
//et on verifie que l'utilisateur ne rentre pas a la main un numéro de feuille de style qui n'existe pas.
if (is_numeric($_GET['style']) and $_GET['style'] < '4' ) {

//On met la date d'expiration du cookie - ici 1 mois (valeur toujours exprimé en seconde)
$expire = 30*24*3600;

//on créer le cookie avec : setcookie(lenom,lavaleur,ladurée); plus d'info ici http://www.php.net/setcookie
//setcookie doit etre envoyer avant tout autre envoi au navigateur (restriction http)
setcookie("style",$_GET['style'],time()+$expire);
}

?>

ici plus besoin d'afficher des message a l'utilisateur puisqu'il n'y a plus de fenetre.

dans la page d'index

Code:: <?php
//si la variable n'est pas vide ca veut dire que le cookie existe
if (!empty ($_COOKIE['style'])){
//on charge alors la feuille avec le style choisi (la variable style contient en fait 1,2 ou 3)
//les feuilles de style sont appeler style1.css, style2.css etc...
//echo $_COOKIE['style'] ;
echo '<style>'.
'@import url(style'.$_COOKIE['style'].'.css);'.
'</style>';

}else{
//j'ai rajouter ca si on ne trouve pas le cookie on le créer
$expire = 30*24*3600;
setcookie("style","1",time()+$expire);
//si la variable est vite le cookie n'existe pas donc on charge la feuille de style par defaut
echo '<style>'.
'@import url(style1.css);'.
'</style>';
}
?>

Il faut placer se bout de code tout en haut a cause de setcookie, placé plus bas il provoque une erreur (a cause de la restriction http)

Et ici on va utiliser de l'ajax c'est a la mode en se moment alors on en profite ^^

Code:: <SCRIPT>
function ecrire_cookie(data){
var xhr_object = null;

if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return;
}

var filename = "styleswitch.php";

filename += "?style="+data;

xhr_object.open("GET", filename, true);
<alert>
xhr_object.onreadystatechange = function() {
if(xhr_object.readyState == 4) window.location.reload();
}

xhr_object.send(null);

}</SCRIPT>

la partie qui permet de faire la selection du style de change pas.

si vous voulez tester cette nouvelle formule esséyez sur mon site.

» Cydalone : plussune style
» Presentation "small Robert style"