School of Pub, où la perfection est à la portée de chacun. (Dixit Audidounette)

AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

 


Partager | 
 

 [forumactif]Mettre un "ascenceur" à votre forum

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

kiri

Doyenne

Voir le dossier scolaire

Doyenne

Féminin Rang spécial: Formatrice codeuse, Admin et analyste; RH
Marraine

Journaliste du M-SoP

Nombre de messages: 7075
Age: 37
Localisation: dans les bras de mon Homme
$ops: 12541
Points: 200
Date d'inscription: 24/06/2010
 
MessageSujet: [forumactif]Mettre un "ascenceur" à votre forum    Ven 11 Fév - 13:44

~ Créer un ascenseur pour votre Forum ~
Coucou,

voici un tutoriel Facile , simple et bien pratique surtout si votre forum comporte beaucoup de sous-forums

Le but



Réaliser un ascenseur à Droite ou à Gauche de votre Forum

"aperçu de résultat possible":
 


Les conditions



Pour réaliser ce tutoriel vous devez :
  • Avoir un forum version phpbb2 ( je n'ai pas vérifié sur les autres versions )

  • Avoir accès aux PA et aux Templates

  • Quelques notions de CSS : [Trucs] Code CSS


Le code



On y va....Pour ce faire , vous devez allez dans votre panneau d'administration

Affichage --> Templates --> Général

Ouvrer le Template > overall_footer
> Tout en bas Vous cherchez :
Code:
</body>
</html>


Code copier et à coller à placer juste avant :
Code:

<div class="ascenseur"><br/>
<a href="#top"><img src="http://i78.servimg.com/u/f78/15/28/98/12/scroll11.png" /></a>
<br/><br/>
<a href="#bottom"><img src="http://i78.servimg.com/u/f78/15/28/98/12/scroll10.png" /></a><br/><br/>
</div>


Arrow Enregistrer puis publier votre template en cliquant sur le :

CSS
Panneau d'admin > Affichage > Couleurs > Feuille de style CSS
Ensuite vous copier coller ce code :
Code:
.ascenseur {
position: fixed; /*--- Cette ligne permet de toujours afficher l'ascenseur à l'écran ---*/
top: XXpx; /*--- On le place à XX px du haut de l'écran ---*/
left: XXpx; /*--- On le place à X px de la gauche de l'écran ---*/
background-color: #COULEUR; /*--- On donne une couleur au fond ---*/
}


N'oubliez pas de remplacer #Couleur et les deux XXpx par vos propres valeurs

Personnalisation



Pour placer les flèches à droite remplacer ceci
Code:
left: XXpx; /*--- On le place à X px de la gauche de l'écran ---*/

par :
Code:
right: XXpx; /*--- On le place à X px de la droite de l'écran ---*/


vous pouvez bien sur personnaliser tout ceci en vous aidant de ces petits [Trucs] Code CSS


Bon courage et si vous avez des soucis, n'hésitez pas great

Tuto réalisé par ©kiri pour Sop




_________________

J’ai toujours rêvé que mon ordinateur soit aussi simple à utiliser que mon téléphone.
Ce rêve est devenu réalité : je ne comprends plus comment utiliser mon téléphone [ by Bjarne Stroustrup ]


Mes cadeaux de Noel : Merci Clo
Merci Volt
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://www.ile-improbable.net/
 

[forumactif]Mettre un "ascenceur" à votre forum

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

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
School of Pub :: Les cours :: Tutoriels :: Informatique :: Gestion d'un forum-


Aller en haut
Aller en bas