Si c'est pas merveilleux ...
' Cliquez moi '
qui permet de revenir tout en haut de la page où on se trouve (d'où amélioration, par rapport à un simple lien sur la page d'accueil).
L'astuce est de Vger et je ne peux trop vous conseiller d'aller faire un tour dans ses Archives Vinéennes.
Le code à mettre est en javascript, mais, Osanah Osanah, il fonctionne même en mode Confiance...
src="http:// ..."
en mettant l'adresse d'une image de vos fichiers OB.
Il est évidemment possible de modifier aussi class="DrteTexte", qui oblige votre image à se justifier à droite (en mode "flottant", c'est-a-dire indépendemment des limites du bloc ou il est inséré), pratique quand on le met tout a la fin d'un article.
Vous trouverez l'icône à peu près partout où il est possible de la mettre, c'est-à-dire partout où on peut insérer un code HTML (il faut passer en mode HTML avant, bien sûr) :
- Dans le pied de page. (Bon, dans l'en-tête on peut aussi, mais c'est moyen intéressant pour un retour en haut de page...)
- Dans chacun des modules Textes Libres.
- A la fin des articles.
(Je suis très enthousiaste.)
Je ne sais pas si vous avez remarqué, mais j'ai tendance à être trèèèès bavarde ...
Et du coup, mes articles en tendance à avoir une longueur en conséquence.
Alors désormais, mon blog s'enrichit de cette icône : Et du coup, mes articles en tendance à avoir une longueur en conséquence.
' Cliquez moi 'qui permet de revenir tout en haut de la page où on se trouve (d'où amélioration, par rapport à un simple lien sur la page d'accueil).
L'astuce est de Vger et je ne peux trop vous conseiller d'aller faire un tour dans ses Archives Vinéennes.
Le code à mettre est en javascript, mais, Osanah Osanah, il fonctionne même en mode Confiance...
<a href="javascript:scroll(0,0)">Pour faire le vôtre, il n'y a qu'à changer l'adresse de l'image :
<img
class="DrteTexte"
src="http://idata.over-blog.com/.../kaos-up.gif" />
</a>
src="http:// ..."
en mettant l'adresse d'une image de vos fichiers OB.
Il est évidemment possible de modifier aussi class="DrteTexte", qui oblige votre image à se justifier à droite (en mode "flottant", c'est-a-dire indépendemment des limites du bloc ou il est inséré), pratique quand on le met tout a la fin d'un article.
Vous trouverez l'icône à peu près partout où il est possible de la mettre, c'est-à-dire partout où on peut insérer un code HTML (il faut passer en mode HTML avant, bien sûr) :
- Dans le pied de page. (Bon, dans l'en-tête on peut aussi, mais c'est moyen intéressant pour un retour en haut de page...)
- Dans chacun des modules Textes Libres.
- A la fin des articles.
(Je suis très enthousiaste.)
par Zoélie
publié dans :
TIP's
EDIT : Attention, le code Source de ce module ayant changé depuis le jour où cet article a été rédigé, certaines informations sont obsolètes !
Les lignes inscrite dans le module Newsletter sont souvent difficiles a lire, voire invisibles...
Voici tout ce qu'il faut pour les modifier:
On veut agir uniquement sur le module Newsletter, donc on commence chaque ligne par #Newsletter.
#Newsletter .box-content {
color:#machin;
}
change "inscription a la newsletter". Jusque la, c'est logique.
#Newsletter .box-content p {
color:#truc;
}
change "email", car ce mot est defini (par la partie du code a laquelle on n'a pas acces) dans un paragraphe (classe p), justement pour pouvoir le differencier de "inscription a la newsletter".
Edit : le pparagraphe n'existe plus.
#Newsletter input[type="submit"] {
color: #chose;
}
change "je m'inscris".
Edit : maintenant, ça s'appelle "Ok".
Enfin,
input {
color:#toto;
}
situe tout en haut, dans la partie des caracteristiques generales (donc ne commence pas par un selecteur type # ou .) change la couleur de ce qu'on tape dans les fenetres du blog (l'adresse email pour s'inscrire a la newsletter et le mot-cle qu'on met dans le module Recherche, par exemple) Edit : et le mot "email" qui est maintenant dans le cadre.
j'ai aussi ajouter dans cette fonction input:
border: outset;
pour avoir le cadre en relief que vous pouvez voir.
Moi, j'trouve ca beau. Pas Vous ? Ah bon.
Cependant, si vous voulez toucher exclusivement le cadre ou l'on met l'adresse e-mail pour s'inscrire a la Newsletter et pas les autres cadres d'input (pour reduire sa longueur, par exemple), il faut alors ajouter la fonction:
#Newsletter input[type="text"] { width: 80%;}

Pour avoir la petite image ci-dessus en-dessous du cadre "Je m'incris" , j'ai ajoute dans le paragraphe le formulaire (<form>)de la Newsletter son url. Ca donne donc finalement :
#Newsletter .box-content p
Edit : #Newsletter .box-content form
{
color:#FFDEAD;
padding-bottom:65px;
background:transparent url(http://idata.over-blog.com/0/05/85/46/gifs-animes/animaux-305.gif) no-repeat scroll bottom left;
}
Le padding-bottom: 'hauteur de l'image' px; permet d'agrandir la taille du paragraphe vers le bas, pour que l'image rentre en entier.
Les lignes inscrite dans le module Newsletter sont souvent difficiles a lire, voire invisibles...
Voici tout ce qu'il faut pour les modifier:
On veut agir uniquement sur le module Newsletter, donc on commence chaque ligne par #Newsletter.
#Newsletter .box-content {
color:#machin;
}
change "inscription a la newsletter". Jusque la, c'est logique.
#Newsletter .box-content p {
color:#truc;
}
change "email", car ce mot est defini (par la partie du code a laquelle on n'a pas acces) dans un paragraphe (classe p), justement pour pouvoir le differencier de "inscription a la newsletter".
Edit : le pparagraphe n'existe plus.
#Newsletter input[type="submit"] {
color: #chose;
}
change "je m'inscris".
Edit : maintenant, ça s'appelle "Ok".
Enfin,
input {
color:#toto;
}
situe tout en haut, dans la partie des caracteristiques generales (donc ne commence pas par un selecteur type # ou .) change la couleur de ce qu'on tape dans les fenetres du blog (l'adresse email pour s'inscrire a la newsletter et le mot-cle qu'on met dans le module Recherche, par exemple) Edit : et le mot "email" qui est maintenant dans le cadre.
j'ai aussi ajouter dans cette fonction input:
border: outset;
pour avoir le cadre en relief que vous pouvez voir.
Moi, j'trouve ca beau. Pas Vous ? Ah bon.
Cependant, si vous voulez toucher exclusivement le cadre ou l'on met l'adresse e-mail pour s'inscrire a la Newsletter et pas les autres cadres d'input (pour reduire sa longueur, par exemple), il faut alors ajouter la fonction:
#Newsletter input[type="text"] { width: 80%;}

Pour avoir la petite image ci-dessus en-dessous du cadre "Je m'incris" , j'ai ajoute dans le paragraphe le formulaire (<form>)de la Newsletter son url. Ca donne donc finalement :
#Newsletter .box-content p
Edit : #Newsletter .box-content form
{
color:#FFDEAD;
padding-bottom:65px;
background:transparent url(http://idata.over-blog.com/0/05/85/46/gifs-animes/animaux-305.gif) no-repeat scroll bottom left;
}
Le padding-bottom: 'hauteur de l'image' px; permet d'agrandir la taille du paragraphe vers le bas, pour que l'image rentre en entier.
par Zoélie
publié dans :
TIP's











