Signature "Administrateur" :)

Statut
N'est pas ouverte pour d'autres réponses.
Paul GTP

Paul GTP

Légende vivante
VIP
Inscription
15 Août 2013
Messages
6 195
Réactions
7 549
Points
27 832
RGCoins
137
Salut la communauté ! Dans ce tutoriel je vais vous apprendre à faire une image comme celle-ci:
1387029591-lol.png

A partir d'une image comme celle-là:
1387037296-lol3.png
Cliquez pour agrandir...

Pour ce faire, vous aurez besoin de:
  • Google Chrome (ou Mozila Firefox, mais il vous faudra installer le plugin
    Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
    )
  • Un cerveau :troll:

I/ Obtenir l'image de base
Alors, pour commencer, rendez-vous sur la page d'accueil de :RG: et cliquez sur votre pseudo à droite:
1387038415-acc.png


Vous devriez-donc obtenir vos statistiques qui s'affichent:
1387037740-stats.png


II/ Inspécter le quoi ?!
Vous savez sans doutes peut-être tous ce que c'est que "Inspecter l'élément", pas vrai ? Vous savez, quand vous faites un clique droit, c'est la fonction tout en bas :)
1387038104-cliquedroit.png

Cette fonction sert à modifier le code HTML de la page en temps réel... Le problème c'est qu'il n'y a que vous qui le voyez... Sinon ça serait du Hacking, et pour un plugin officiel ce serait bizarre :nrv:

Faites un clique droit sur votre pseudo, et cliquez sur "Inspecter l'élément"
Une fois ceci fait, en bas de votre navigateur il y aura pleins d'écritures bizarre. Enfaites, c'est le code HTML.

III/ Les codes à enlever et à rajouter
Cherchez une ligne de code comme celle-ci:
<div class="xenOverlay memberCard" style="position: fixed; z-index: 9999; top: 89.80000000000001px; left: 212px; display: block;"><div id="memberCard315249" class="contenuMemberCard" data-overlayclass="memberCard">
Cliquez pour agrandir...
Puis cliquer sur "Edit as HTML"
1387039061-edit.png


Effacez-tout ce qu'il y a et remplacez le code par celui-ci:
<div class="xenOverlay memberCard" style="position: fixed; z-index: 9999; top: 58.7px; left: 212px; display: block;"><div id="memberCard315249" class="contenuMemberCard" data-overlayclass="memberCard">
<div class="avatarCropper">
<a class="avatar NoOverlay Av315249l" href="members/raiin.315249/">
<img src="URL DE VOTRE AVATAR" alt="" style="left: 0px; top: 0px; ">
</a>

</div>

<div class="userInfo">
<h3 class="username"><a href="members/raiin.315249/" class="username NoOverlay"><span class="style3">VOTRE PSEUDO</span></a></h3>

<div class="userTitleBlurb">
<h4 class="userTitle">Administrateur</h4>
<div class="userBlurb">Homme </div>
</div>

<blockquote class="status">Administrateur</blockquote>

<div class="userLinks">

<a href="members/raiin.315249/">Profil</a>


</div>

<dl class="userStats pairsInline">

<dt>Inscrit le:</dt> <dd>15 Août 2013</dd>
<!-- slot: pre_messages -->
<dt>Messages:</dt> <dd><a href="search/member?user_id=315249" class="concealed" rel="nofollow">NOMBRE DE MESSAGES</a></dd>
<!-- slot: pre_likes -->

<!-- slot: pre_trophies -->
<dt>Évaluations :</dt>
<dd><span style="color:#C6FF8C">NOMBRE D'EVALS</span>




</dd> <dt>Points:</dt> <dd><a href="members/raiin.315249/trophies" class="concealed OverlayTrigger">NOMBRE DE POINTS</a></dd>


</dl>


<dl class="pairsInline lastActivity">
<dt>Dernière visite de VOTRE PSEUDO:</dt>
<dd>


Regarde la liste des forums,

<abbr class="DateTime muted" data-time="1387029055" data-diff="5" data-datestring="14 Décembre 2013" data-timestring="HEURE" title="14 Décembre 2013, à 14:50">il y a 1 minute</abbr>

</dd>
</dl>

</div>

<a class="close OverlayCloser"></a>
</div></div>
Cliquez pour agrandir...
Pour "URL DE VOTRE AVATAR", faites un clique droit sur votre image de profil et faites "Copier l'URL de l'image" :)

IV/ Résultat
Magie ! Vous êtes désormais administrateur !
1387039414-admin.png


V/ Bonus
Elle est bien belle cette image, mais dans la mienne, le fond est blanc/gris. Ce n'est qu'un détail mais c'est tout de même plus jolie !

Maintenant, montez-tout en haut de "Inspecter l'élément", et supprimez cette ligne en faisant: Clique droit => Delete Node
<div id="headerMover">
Cliquez pour agrandir...

Faites un clique droit sur la petite croix juste au dessus de votre pseudo, inspectez l'élément, et supprimez cette ligne en faisant: Clique droit => Delete Node
<a class="close OverlayCloser"></a>
Cliquez pour agrandir...

Et voilà ! Votre image est toute jolie !
1387039722-admin2.png


C'est la fin de ce tuto, n'oubliez pas que les évaluations bien méritées font plaisir, et, je vous signale juste comme ça que j'ai pris beaucoup de temps à faire ce tuto :blush:.
J'espère que ça vous aura plus, même si c'est très simple, il fallait que je fasse ce tuto :)

A bientôt :DJ:

PS/EDIT: Je remercie grandement @KOKA car c'est grâce à sa signature que j'ai eu l'idée de faire ce montage et ce tuto. Merci mec :love:
 
Dernière édition:
Merci du partage même si c'est simple :) :ok:
 
GG et tu peux me taguer dans le topic car sans moi ceci n'existerai pas... (d) Et sinon bon tuto et sa a du te prendre du temps pour les screen et le texte ! +1
 
KOKA a dit:
GG et tu peux me taguer dans le topic car sans moi ceci n'existerai pas... (d) Et sinon bon tuto et sa a du te prendre du temps pour les screen et le texte ! +1
Cliquez pour agrandir...
C'est vrai, j'avais oublié, j'edit le topic :)
Oui, merci c'est vrai que ça m'a pris du temps

PS: Tu as vu que je t'ai credit au moins dans ma signature ? :D
 
RaiiN a dit:
C'est vrai, j'avais oublié, j'edit le topic :)
Oui, merci c'est vrai que ça m'a pris du temps

PS: Tu as vu que je t'ai credit au moins dans ma signature ? :D
Cliquez pour agrandir...
Oui, j'ai vu ^^ Merci
 
RaiiN a dit:
Salut la communauté ! Dans ce tutoriel je vais vous apprendre à faire une image comme celle-ci:


Pour ce faire, vous aurez besoin de:
  • Google Chrome (ou Mozila Firefox, mais il vous faudra installer le plugin
    Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
  • Un cerveau :troll:

I/ Obtenir l'image de base
Alors, pour commencer, rendez-vous sur la page d'accueil de :RG: et cliquez sur votre pseudo à droite:
1387038415-acc.png


Vous devriez-donc obtenir vos statistiques qui s'affichent:
1387037740-stats.png


II/ Inspécter le quoi ?!
Vous savez sans doutes peut-être tous ce que c'est que "Inspecter l'élément", pas vrai ? Vous savez, quand vous faites un clique droit, c'est la fonction tout en bas :)
1387038104-cliquedroit.png

Cette fonction sert à modifier le code HTML de la page en temps réel... Le problème c'est qu'il n'y a que vous qui le voyez... Sinon ça serait du Hacking, et pour un plugin officiel ce serait bizarre :nrv:

Faites un clique droit sur votre pseudo, et cliquez sur "Inspecter l'élément"
Une fois ceci fait, en bas de votre navigateur il y aura pleins d'écritures bizarre. Enfaites, c'est le code HTML.

III/ Les codes à enlever et à rajouter
Cherchez une ligne de code comme celle-ci:

Puis cliquer sur "Edit as HTML"
1387039061-edit.png


Effacez-tout ce qu'il y a et remplacez le code par celui-ci:

Pour "URL DE VOTRE AVATAR", faites un clique droit sur votre image de profil et faites "Copier l'URL de l'image" :)

IV/ Résultat
Magie ! Vous êtes désormais administrateur !
1387039414-admin.png


V/ Bonus
Elle est bien belle cette image, mais dans la mienne, le fond est blanc/gris. Ce n'est qu'un détail mais c'est tout de même plus jolie !

Maintenant, montez-tout en haut de "Inspecter l'élément", et supprimez cette ligne en faisant: Clique droit => Delete Node


Faites un clique droit sur la petite croix juste au dessus de votre pseudo, inspectez l'élément, et supprimez cette ligne en faisant: Clique droit => Delete Node


Et voilà ! Votre image est toute jolie !
1387039722-admin2.png


C'est la fin de ce tuto, n'oubliez pas que les évaluations bien méritées font plaisir, et, je vous signale juste comme ça que j'ai pris beaucoup de temps à faire ce tuto :blush:.
J'espère que ça vous aura plus, même si c'est très simple, il fallait que je fasse ce tuto :)

A bientôt :DJ:

PS/EDIT: Je remercie grandement @KOKA car c'est grâce à sa signature que j'ai eu l'idée de faire ce montage et ce tuto. Merci mec :love:
Cliquez pour agrandir...

Petite précision : il n'y a pas besoin de Firebug , l'inspection d'élément se trouve sur tous les navigateurs web.
 
Mac' a dit:
Petite précision : il n'y a pas besoin de Firebug , l'inspection d'élément se trouve sur tous les navigateurs web.
Cliquez pour agrandir...
A mes souvenirs il le fallait, après j'utilise Chrome donc je sais pas, mais je le laisse au cas ou, on sais jamais :mmh:
 
Super merci <3 !
 
Je propose de vous y faire pour seulement 35 starpass la signature ! C'est un des meilleur prix donc dépêchez vous avant qu'il augmente ! :espion:
 
KOKA a dit:
Je propose de vous y faire pour seulement 35 starpass la signature ! C'est un des meilleur prix donc dépêchez vous avant qu'il augmente ! :espion:
Cliquez pour agrandir...
Moi je le fais à 34 :espion:
 
RaiiN a dit:
Salut la communauté ! Dans ce tutoriel je vais vous apprendre à faire une image comme celle-ci:


Pour ce faire, vous aurez besoin de:
  • Google Chrome (ou Mozila Firefox, mais il vous faudra installer le plugin
    Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
    )
  • Un cerveau :troll:

I/ Obtenir l'image de base
Alors, pour commencer, rendez-vous sur la page d'accueil de :RG: et cliquez sur votre pseudo à droite:
1387038415-acc.png


Vous devriez-donc obtenir vos statistiques qui s'affichent:
1387037740-stats.png


II/ Inspécter le quoi ?!
Vous savez sans doutes peut-être tous ce que c'est que "Inspecter l'élément", pas vrai ? Vous savez, quand vous faites un clique droit, c'est la fonction tout en bas :)
1387038104-cliquedroit.png

Cette fonction sert à modifier le code HTML de la page en temps réel... Le problème c'est qu'il n'y a que vous qui le voyez... Sinon ça serait du Hacking, et pour un plugin officiel ce serait bizarre :nrv:

Faites un clique droit sur votre pseudo, et cliquez sur "Inspecter l'élément"
Une fois ceci fait, en bas de votre navigateur il y aura pleins d'écritures bizarre. Enfaites, c'est le code HTML.

III/ Les codes à enlever et à rajouter
Cherchez une ligne de code comme celle-ci:

Puis cliquer sur "Edit as HTML"
1387039061-edit.png


Effacez-tout ce qu'il y a et remplacez le code par celui-ci:

Pour "URL DE VOTRE AVATAR", faites un clique droit sur votre image de profil et faites "Copier l'URL de l'image" :)

IV/ Résultat
Magie ! Vous êtes désormais administrateur !
1387039414-admin.png


V/ Bonus
Elle est bien belle cette image, mais dans la mienne, le fond est blanc/gris. Ce n'est qu'un détail mais c'est tout de même plus jolie !

Maintenant, montez-tout en haut de "Inspecter l'élément", et supprimez cette ligne en faisant: Clique droit => Delete Node


Faites un clique droit sur la petite croix juste au dessus de votre pseudo, inspectez l'élément, et supprimez cette ligne en faisant: Clique droit => Delete Node


Et voilà ! Votre image est toute jolie !
1387039722-admin2.png


C'est la fin de ce tuto, n'oubliez pas que les évaluations bien méritées font plaisir, et, je vous signale juste comme ça que j'ai pris beaucoup de temps à faire ce tuto :blush:.
J'espère que ça vous aura plus, même si c'est très simple, il fallait que je fasse ce tuto :)

A bientôt :DJ:

PS/EDIT: Je remercie grandement @KOKA car c'est grâce à sa signature que j'ai eu l'idée de faire ce montage et ce tuto. Merci mec :love:
Cliquez pour agrandir...
Mddr' le Topic ;)
 
Merci pour le tuto ;)
 
Ce n'est pas méchant ce que j'ai dis tkt :love:
 
Statut
N'est pas ouverte pour d'autres réponses.
Retour
Haut