Tests – Snippet HTML

Titre H2 Cette page est une page de test!

Si vous n’éditez pas le site, vous n’avez rien à faire ici.

Titre H3

Titre H4

Titre H5
Titre H6
  1. Homepage 1
  2. Homepage 2
  3. Homepage 3
  4. Homepage 4
  5. Full Page
  6. Blog
  7. Contact
  8. Archive

Snippet HTML à copier / collé dans l’éditeur HTML

Classes CSS Particulières :

// Utiliser sur les liens texte externes :
.newTab : Pour faire ouvrir dans un lien dans un nouvel onglet (et faire apparaître Icône ):

<a href=”#URL” title=”” class=”newTab”>Contenu Lien</a>

// A utiliser sur les liens des images pour ne pas faire apparaître l’icône de lien externe les images mais jouer quand même le target=”_blank” sur le lien :
.newTabImg :

<a href=”#URL” title=”” class=”newTabImg”><img src=”#Lien” /></a>

// A Tester pour utiliser des icônes en CSS :

Vous pouvez utilisez la librairie : https://fontawesome.io/icons/ qui semble installée

//Séparateur <hr /> :

classe .separateur :
<hr class=“separateur” />
<hr /> : l’élément de base est stylisé par une barre verte à 60% centrée

Bouton input Il s’affiche avec le vert du site et se centre dans un paragraphe, à personnaliser :

<p><a href= »https://www.chanvrelibertes.org » title= »Retour sur l’accueil »>
<input type= »button » value= »Retour sur l’accueil » class= »button btcl » /></a></p>

Lightbox Feather light :

Doc : https://github.com/noelboss/featherlight/#usage

Ex sur https://www.chanvrelibertes.org/asso/ (organigramme)

Juste rajouter l’attribut data-featherlight= »image » dans le lien pointant vers un fichier image ayant une grosse dimension.

Ex :
<p><a href= »https://votre.url » data-featherlight= »image »><img src=”la-grosse-image.jpg” alt=”textealt”></a></p>

 

 

Titre Stylé pour les sidebars

 

Vaporisateur Arizer Air
Vaporisateur
Arizer Air Solo

Jack Herer - L'empereur est nu
L’Empereur est Nu
Jack Herer