AccueilAccueil  FAQFAQ   Aides  RechercherRechercher  GroupesGroupes  MembresMembres  S'enregistrerS'enregistrer  ConnexionConnexion  

Partagez | 
 

 Codage

Voir le sujet précédent Voir le sujet suivant Aller en bas 

Invité

I am
Invité



Sam 19 Avr - 21:02
Pour avoir un avatar aléatoire.



I - Première étape : Création du fichier de redirection


Pour le moment je suis sure que vous vous imaginez mal comment on va faire et vous pensez que ça va être hyper compliqué affraid Mais pas de panique c'est vraiment plus simple que ça en a l'air. Ouvrez votre éditeur de texte (bloc notes, notepad++... etc) et ouvrez un nouveau fichier vierge. Je prends quelques minutes pour vous expliquer le principe de la manoeuvre quand même Cool

En gros on va créer un fichier qui dit au navigateur, redirige-moi vers une autre page. Vous ne voyez pas l'utilité, hein, avouez ? Razz Et pourtant c'est le point important de la génération aléatoire de votre avatar Razz. Ce fichier est aussi celui qui va tirer au sort quelle image afficher et ensuite rediriger le navigateur vers l'image en question, autrement dit c'est ce fichier là qui vous servira d'avatar What a Face

Ouvrez donc l'éditeur de texte et copiez collez le code suivant :

Code:
<?php
   header('Location: http://sandy.claws.free.fr/image/mia'.mt_rand(1,3).'.png');
?>

N'ayez pas peur, c'est normal si vous ne comprenez pas ce que ça veut dire Razz (Au passage désolée pour l'URL dedans mais j'utilise mon site pour héberger l'avatar aléatoire Neutral). Je vais tout vous expliquer Razz En attendant, enregistrez le fichier sous avatar.php par exemple Razz

NB : Si vous êtes sous le bloc notes, au moment d'enregistrer le fichier, dans le menu déroulant qui vous propose les types de fichiers, mettez "Tous les types de fichiers" et dans le nom tapez entièrement "avatar.php" Wink

Code:
<?php ?>

Ce que vous voyez au-dessus ce sont les balises qui indiquent que l'on va écrire du PHP et non pas du HTML. Jusque là rien de bien difficile. Ensuite viens l'instruction header. Si vous ne comprenez pas exactement ce que c'est, ne vous inquiétez pas, il suffit juste de savoir que c'est cette ligne de code qui va rediriger le navigateur vers l'image à afficher Razz Concentrons-nous sur ce qu'il y a à l'intérieur des parenthèses Razz

Code:
Location: http://sandy.claws.free.fr/image/mia'.mt_rand(1,6).'.png

Le location indique que c'est l'adresse suivante où le navigateur doit aller Razz Ensuite vient l'URL de l'image vers laquelle il redirige le navigateur. Mais qu'est-ce que c'est que ce truc en plein milieu ? Shocked Et bien c'est la fonction qui permet de tirer au sort un nombre entre 1 et 6 Razz

Code:
mt_rand(1,6)

Si vous voulez tirer un nombre entre 1 et 6, vous n'aurez qu'à changer les nombres à l'intérieur des parenthèses (arguments de la fonction) si vous n'avez pas 6 images mais plus ou moins \o/ De la même façon l'URL sera à changer suivant l'adresse où vous avez héberger vos images.

La fonction mt_rand(1,6) sera donc remplacée par un chiffre aléatoire entre 1 et 6 Razz L'adresse vers laquelle le navigateur sera redirigée sera donc http://sandy.claws.free.fr/image/mia1.png ou encore http://sandy.claws.free.fr/image/mia2.png ... etc Razz si vous cliquez sur les liens vous verrez que vous atterrissez sur les icons de tout à l'heure *O* C'est bon, vous suivez toujours ? What a Face

II - Deuxième étape : Vos images !


Vous suivez toujours ? Courage la suite est assez simple *O* Choisissez les images que vous voulez Razz On va faire simple et on va commencer par choisir un lot d'avatar, par souci de facilité je reprends ceux que j'avais utilisé pour tester l'astuce chez moi donc désolée pour ceux qui n'aiment pas James McAvoy

Renommez vos images de manière logique, par exemple là je vais les appeler james1.png, james2.png & james3.png. Pourquoi ça ? Tout bêtement parce que la fonction mt_rand qu'on a vu tout à l'heure ne tire au sort qu'un chiffre et devinez quoi, c'est pour ça qu'on a mis des chiffres à la fin des noms de vos images \o/ Maintenant que vous avez vos trois images bien renommées et votre fichier PHP qui tire bien au sort parmi les avatars, il ne vous reste plus qu'à les héberger et là ça va devenir un peu plus touchy Laughing


/!\ Attention ! Pour l'exemple je vous ai demandé de coller le code avec mia alors il va falloir changer ça si vous voulez que ça fonctionne Laughing Ce n'est pas très compliqué, mettez "james" à la place de "mia" et changer aussi les chiffres de la fonction, mettez 3 au lieu de 6 (:
Avant les images que je tirais au sort s'appelaient mia1.png, mia2.png... etc Razz Donc là forcément il faut changer l'URL de la redirection si vous voulez qu'il vous affiche les avatars de James Razz Enfin vous ne devriez pas rencontrer de problème (:


Dernière édition par Conrad Dlack le Sam 19 Avr - 21:07, édité 1 fois
Revenir en haut Aller en bas

Invité

I am
Invité



Sam 19 Avr - 21:05
III - Troisième étape : L'hébergement


Tout ceux qui ont déjà un site web qui leur permet d'héberger des fichiers PHP peuvent passer toute cette partie là Razz Par là j'entends un site qui utilise un client FTP, du style Free Razz e-monsite par exemple, ça ne marchera pas, vous ne pouvez pas uploader vos pages PHP vous-même affraid !

NB : Pour ceux qui possèdent un forum FA, n'essayez pas d'héberger votre fichier PHP dans vos pages HTML, ça ne marchera pas Laughing Enfin si ça vous amuse, vous pouvez essayer (aa)

Alors il va falloir héberger tout ce que vous avez fait pour que ça marche tongue Tout ceux qui sont chez Free possèdent gratuitement un espace d'hébergement dont vous pouvez vous servir très facilement Razz Tout est normalement expliqué ici : http://www.free.fr/assistance/252-freebox-creer-des-pages-perso-comment-disposer-d-une-page-perso-free.html

Pour ceux qui ne sont pas chez Free, je peux vous proposer d'utiliser un autre service en ligne et gratuit, c'est juste le premier que j'ai trouvé, je l'ai testé et ça fonctionne donc je vous propose celui-là mais vous pouvez en utiliser un autre Razz Rendez-vous ici :

http://www.multimania.fr/

Créez-vous un compte et attendez le mail d'activation (il a mis quelques minutes chez moi personnellement tongue). Une fois votre compte activé, donnez un mot de passe pour votre plateforme FTP Razz Essayez de vous en souvenir vous en aurez besoin ! Rendez vous ensuite ici :

http://www.multimania.fr/build/#webftp Et cliquez sur le lien openWebFTP

Une nouvelle fenêtre s'ouvre, c'est l'interface de gestion de votre serveur FTP Razz En gros c'est grâce à ça que vous allez pouvoir héberger votre fichier PHP et vos images \o/ Sur la droite vous avez une colonne : "Charger un fichier de votre PC sur votre compte :", c'est ici que ça se passe Razz Rajoutez donc les fichiers suivants :

♦ james1.png
♦ james2.png
♦ etc... Toutes les images dont vous avez besoin en gros Wink


Vous pouvez fermer la fenêtre une fois que c'est fait tongue Revenez sur votre page multimania et récupérez l'adresse de votre site web Razz Normalement ce sera http://membres.multimania.fr/VOTREPSEUDO/
Pas la peine d'essayer d'aller visiter votre site, il sera vide, et plein de pub, bref, aucun intérêt \o/ Mais vous allez avoir besoin de l'adresse pour changer le fichier avatar.php Razz Par exemple pour moi, imaginons que mon pseudo est jane, voilà ce que devrait contenir mon fichier avatar.php

Code:
<?php
  header('Location: http://membres.multimania.fr/jane/james'.mt_rand(1,3).'.png');
?>

/!\ Pensez à héberger le avatar.php sinon ça ne marchera pas, c'est clair !

Vous devriez maintenant avoir d'hébergé (dans mon exemple) avatar.php, james1.png, james2.png & james3.png


IV - Quatrième étape : Utilisez le tout sur votre forum


Allez, courage, on arrive bientôt à la fin ! *O* Vous avez réussit toutes les étapes précédentes et maintenant vous êtes entrain de vous dire que ça n'a pas servi à grand chose, votre avatar est toujours comme avant Arrow Ne vous inquiétez pas, pendant cette dernière étape, je vais vous expliquer comment vous servir de ce que vous venez de faire sur votre forum (:

Avant d'aller plus loin, essayer déjà de faire charger la page avatar.php Razz Si je reprend mon exemple de tout à l'heure, avec ma page hébergée sur multimania et comme pseudo jane, il faudrait aller vérifier ici

Code:
http://membres.multimania.fr/jane/avatar.php

Si vous êtes chez free et que vous avez choisit comme identifiant, jane, ce sera ici :

Code:
http://jane.free.fre/avatar.php

Si vous ne voyez pas d'image affichée, que quand vous recharger plusieurs fois (essayez une petite dizaine de fois au moins ) la page avatar.php l'image chargée ne change pas ou alors que vous obtenez une erreur, ce n'est pas la peine d'aller plus loin, postez à la suite et on essaiera de voir ça ensemble I love you

Pour un avatar :


Pour changer votre avatar, allez dans votre profil et coller dans "Lier l'Avatar à partir d'un autre site :" l'URL qui mène vers votre avatar.php. Si tout se passe bien votre avatar sera à présent tiré aléatoirement I love you

Pour un header :


Pour mettre un header tiré aléatoirement, allez dans le panneau d'administration > Affichage > Gestion des images et collez l'URL vers avatar.php à la place de l'URL de votre header actuel \o/

Pour une image dans un message ou dans votre signature :


Alors là c'est un peu plus touchy Razz Il y a un code bien particulier pour pouvoir intégrer une page PHP dans votre message et le voici :

Code:
<object type="text/html" data="URLDEVOTRESITE/avatar.php" width="200px" height="320px">
</object>

Pensez à changer les dimensions dans la balise object si vous ne travaillez plus avec un avatar de taille 200*320, sinon le navigateur le redimensionnera votre image.

Ce tutoriel est largement basé sur un pour connaisseur, ici
Merci beaucoup à SpaceFox
Revenir en haut Aller en bas

Invité

I am
Invité



Lun 29 Sep - 23:04
nouveau codage pour le contexte et le reste administratif sachant que les couleurs sont modifiable

Revenir en haut Aller en bas

Invité

I am
Invité



Lun 29 Sep - 23:08
plus la présentation
Revenir en haut Aller en bas

Invité

I am
Invité



Sam 11 Oct - 9:26
J'aime bien la fiche de contexte, il faut juste qu'on l'accorde au design en cours. Je vais essayer de le faire quand elle aura tout terminé. Razz J'espère que ce sera prêt dans quelques jours; j'ai hâte. Après je relancerai toutes les pubs. ♥️ Je te laisse juste celle de PRD à remettre à jour parce que je ne peux pas le faire comme c'est toi qui l'a posté. ^^'

Je mettrai les nouvelles fiches dans les postes vacants aussi.

Sinon pour la fiche de présentation, il faudrait faire deux trois changements, je trouve qu'elle est un peu trop simple; je préfères l'ancienne. :s

Revenir en haut Aller en bas

Invité

I am
Invité



Sam 7 Fév - 9:41

ANCIEN MODELE DE FICHE DE PRESENTATION (au cas où) Wink






Prénom P² Nom


- Petite citation -


Identité


Prénom(s) : écrire ici
Nom : écrire ici
Date de naissance : écrire ici
Âge : écrire ici
Faction d'origine : écrire ici
Le Test était-il concluant? : écrire ici
Statut social : écrire ici
Orientation sexuelle : écrire ici
Groupe : écrire ici
Avatar : écrire ici




Caractère


Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé.

Anecdotes


Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes



Surnom : écrire ici
Âge : écrire ici
Comment avez vous connu le forum ? : écrire ici
Comment trouves tu le forum ? : écrire ici
Autres chose? : écrire ici


MADE BY .ANGELUS









Once upon a time


- Petite citation -



La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min.La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min.


MADE BY .ANGELUS




Code:
<link href='http://fonts.googleapis.com/css?family=Almendra+Display' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Romanesco' rel='stylesheet' type='text/css'>
<div style="width:540px; height: auto; font-size: 10px;font-family: Georgia;color: #896969;background-color:#FFF870; box-shadow: 0px 3px 8px #896969;border-radius:50px;margin: auto;">
<center>
<img src="http://cdn.makeagif.com/media/11-13-2013/2VgyOQ.gif" style="width: 500px; height:245px; border-radius: 55px; box-shadow: 0px 3px 8px #896969;" class="opacite">
<div style="font-family: 'Romanesco', georgia; font-size: 55px; color:#5B1616; text-shadow: 0px 1px 4px #000000; margin-top: -15px; text-align: center;"> Prénom P² Nom</div>
<br><div style="font-family: 'Almendra Display', georgia; font-size: 24px; color:#5B1616;margin-top: -25px; text-align: center;"> - Petite citation - </div>

<div style="font-family: 'Romanesco', georgia; font-size: 35px; color:#5B1616; text-shadow: 0px 1px 4px #000000; margin-bottom: -20px; text-align: center;"> Identité</div>
<div style="width: 460px; height: 120px; background-color:#FFF7B8; font-family: georgia;font-size:11px; color: #896969; border-radius: 10px;box-shadow: 0px 3px 8px #896969;  padding-top: 20px; padding-left: 10px; overflow: auto; text-align: justify;"><br><table><tr><td><div style="font-size:10px; width:225px; "> • [b]Prénom(s)[/b] : écrire ici <br>• [b]Nom[/b] : écrire ici <br>• [b]Date de naissance[/b] : écrire ici <br>• [b]Âge[/b] : écrire ici <br>• [b]Faction d'origine[/b] : écrire ici </div></td><td><div style="font-size:10px; width:225px;"> • [b]Le Test était-il concluant? [/b]: écrire ici <br>• [b]Statut social[/b] : écrire ici <br>•[b] Orientation sexuelle[/b] : écrire ici <br>• [b]Groupe[/b] : écrire ici <br>• [b]Avatar[/b] : écrire ici </div></td></tr></table></div>

<table><tr><td><div style="font-family: 'Romanesco', georgia; font-size: 35px; color:#5B1616; text-shadow: 0px 1px 4px #000000; margin-bottom: -30px; text-align: center;"> Caractère</div>
<div style="width: 220px; height: 280px; background-color:#FFF7B8; font-family: georgia;font-size:11px; color: #896969; border-radius: 10px;box-shadow: 0px 3px 8px #896969;  padding-top: 20px; padding-left: 10px;  text-indent: 20px; overflow: auto; text-align: justify; padding-right:10px;"><br>Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé. Décrivez votre personnages en quelques lignes, son caractère, au minimum 5 qualités et 5 défauts, développez pour que le curseur soit utilisé.
<br></div></td>

<td><div style="font-family: 'Romanesco', georgia; font-size: 35px; color:#5B1616; text-shadow: 0px 1px 4px #000000; margin-bottom: -30px; text-align: center;"> Anecdotes</div>
<div style="width: 220px; height: 280px; background-color:#FFF7B8; font-family: georgia;font-size:11px; color: #896969; border-radius: 10px;box-shadow: 0px 3px 8px #896969;  padding-top: 20px; padding-left: 10px; overflow: auto; text-align: justify;padding-right:10px;"><br><div style="font-size:10px;"> Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes ▬  Anecdotes sur votre personnage, 10 lignes ▬ Anecdotes sur votre personnage, 10 lignes<br></div></div></td></tr></table>

<br>
<span class="infobulle2"><img src="http://31.media.tumblr.com/958be47eea7f77fd887f35ed03a53d74/tumblr_mxlgmscBhh1s6cjspo5_250.gif" style="width: 280px; height:140px; border-radius: 25px; box-shadow: 0px 3px 8px #896969;"><span class="infobulle2-hidden"><div style="font-size:10px;">• [b]Surnom[/b] : écrire ici
• [b]Âge[/b] : écrire ici
• [b]Comment avez vous connu le forum ?[/b] : écrire ici
• [b]Comment trouves tu le forum ?[/b] : écrire ici
• [b]Autres chose?[/b] : écrire ici</div></span></span>

<div style="text-align:center; font-size:8px; opacity:0.6;color: #896969; ">MADE BY .ANGELUS</div>
</center>
</div>

<link href='http://fonts.googleapis.com/css?family=Almendra+Display' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Romanesco' rel='stylesheet' type='text/css'>
<div style="width:540px; height: auto; font-size: 10px;font-family: Georgia;color: #896969;background-color:#FFF870; box-shadow: 0px 3px 8px #896969;border-radius:50px;margin: auto;">
<center>
<img src="http://cdn.makeagif.com/media/11-13-2013/D5tkjl.gif" style="width: 500px; height:245px; border-radius: 55px; box-shadow: 0px 3px 8px #896969;" class="opacite">
<div style="font-family: 'Romanesco', georgia; font-size: 55px; color:#5B1616; text-shadow: 0px 1px 4px #000000; margin-top: -15px; text-align: center;"> Once upon a time</div>
<br><div style="font-family: 'Almendra Display', georgia; font-size: 24px; color:#5B1616;margin-top: -25px; text-align: center;"> - Petite citation - </div>

<div style="width: 460px; height: 400px; background-color:#FFF7B8; font-family: georgia;font-size:12px; color: #896969; border-radius: 10px;box-shadow: 0px 3px 8px #896969;  padding-top: 20px; padding-left: 10px; padding-right:10px; padding-bottom:20px; overflow: auto; text-align: justify; text-indent: 30px;"><br>La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min.La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage: histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min. La présentation du personnage : histoire, se fait soit sous forme de Rp d'un trentaine de ligne, soit sous autre forme à votre guise de 25 lignes min.</div>

<div style="text-align:center; font-size:8px; opacity:0.6;color: #896969; ">MADE BY .ANGELUS</div>
</center>
</div>

J'ai mis le nouveau en place; en mettant un couleur rose pour les filles et un bleu pour les garçons. Smile
Revenir en haut Aller en bas


I am
Contenu sponsorisé



Revenir en haut Aller en bas
 

Codage

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Petit codage pour signature
» Codage pour le RP
» [Codage] Fiche de liens et Rp - Matt MacAlister [Terminé - Louna Blake ]
» LIBRE SERVICE — codage uniquement
» Codage?

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Edge of Future :: Sujets Divers Archives-