En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies pour vous proposer des contenus et services adaptés. Mentions légales.

Chez Papinou - Skins GuppY 5

Vous êtes ici :   Accueil » Liens onglets à l'horizontale
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...
   GuppY 5 ???   Il y a moins bon mais c'est plus cher ! ! !   
   S'il n'y a pas de solution, c'est qu'il n'y a pas de problème. Devise Shadok   
   Utilisateur de GuppY, je suis membre de l' asso freeGuppY ... et vous ? ? ?   
   Pourquoi vouloir compliquer ?  Essayez GuppY 5  tout simplement ... smile   
   N'oubliez pas d'installer un .htaccess pour protéger l'accès à  l'admin de GuppY 5.   
   Votre premier réflexe après le téléchargement de GuppY 5 ?   Lire la documentation  ! ! !   

Nouveautés du site

(depuis 30 jours)

Astuces GuppY 5

 ↑  

Translator

Nouvelles


+ Année 2018
 -  Année 2018
+ Année 2017
 -  Année 2017
+ Année 2016
 -  Année 2016
 Décembre 2016
 Octobre 2016
 Septembre 2016
 Juillet 2016
 Juin 2016
 Mai 2016
 Avril 2016
 Mars 2016
 Février 2016
 Janvier 2016
+ Année 2015
 -  Année 2015
+ Année 2014
 -  Année 2014

En savoir plus

Radio Papinou

radio01.png
 

Twitter

Dons Chez Papinou


Si vous le souhaitez vous pouvez participez aux frais en faisant un don.

Je vous laisse le soin de choisir le montant, l'essentiel étant le geste.

Nouveau  Liens onglets à l'horizontale

rss Cet article est disponible en format standard RSS pour publication sur votre site web :
https://www.papinou.fr/data/fr-articles.xml

Des liens sur des onglets à l'horizontale


liens_onglets.jpg

Dans le fichier styleplus.css de votre skin, vous ajoutez le style ci-dessous:
 

/* Ajouter au styleplus.css */
/********* ONGLETS *******/
ul.onglets { width: 100% ;}
ul.onglets li { display:block;width: 12%;height: auto;float: left;}
ul.onglets li[float="left"] + li { float:none; }
.onglets li {
font: bold 16px Arial, Helvetica, sans-serif;background-color:#fff;color: #BB8060;border: 1px solid #BB8060;
border-radius: 8px;margin:8px;padding:5px;display:block;text-align:center; }
.onglets li:hover {
font: bold 16px Arial, Helvetica, sans-serif;background-color:#BB8060;color: #fff !important;
border: 1px solid #BB8060;border-radius: 8px; }
.onglets a { color:#BB8060; }
.onglets a:hover { font-weight: bold;color: #fff !important; }
/********* FIN ONGLETS *******/


Vous pouvez modifier :

- la  taille des onglets en modifiant width; 12%; en remplaçant 12% par la largeur souhaitée,
- la police, la couleur du texte, la couleur du background.

Sans rien modifier, vous devez avoir le même affichage que sur la copie d'écran ci-dessus.

Dans chaque article ou document vous devez ajouter au début ou à la fin le code pour afficher les liens comme ci-dessous :
 

/* Ajouter au début ou à la fin de chaque article concerné par un lien */

<div style="text-align:center;width:100%;margin:auto;">
<ul class="onglets">
	<li><a href="articles.php?lng=fr&amp;pg=509#z2">Préambule</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=8#z2">Présentation</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=9#z2">Installation</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=407#z2">Mise à jour</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=10#z2">Configuration</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=55#z2">Habillage</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=13#z2">Notes</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=14#z2">Licence</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=15#z2">Nous rejoindre</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=418#z2">Scripts</a></li>
	<li><a href="articles.php?lng=fr&amp;pg=412#z2">Merci</a></li>
</ul>
</div>

<div style="clear:both"></div>

/* Fin ajout article */

Vous devez remplacer le pg=509 par pg=ID de votre article, et bien sûr le texte à afficher sur l'onglet.
Ceci fonctionne avec tous les types de document à la condition de mettre le bon lien.

à suivre


Date de création : 06/11/2018 @ 23:11
Catégorie : Astuces GuppY 5 - GuppY 5
Page lue 40 fois

Vous êtes ici :   Accueil » Liens onglets à l'horizontale
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...

Préférences


Se reconnecter :
Votre nom (ou pseudo) :
Votre mot de passe
<O>


  4709205 visiteurs
  10 visiteurs en ligne

Connectés :
( personne )
Snif !!!

Calendrier

Licence

Cette création est mise à disposition des visiteurs selon les termes de la
Toute citation doit comporter un lien direct vers la page d'origine.
Chez Papinou est en ligne depuis le 26.03.2006
 
Lire les mentions légales