Les Contes de

  • : Les Contes du Chat Perché (au sixième étage, sans ascenseur)
  • zoelie
  • : Journal Intime
  • : Faites une thèse, faites une thèse, qu\'ils disaient... J\'aurais mieux fait de rester faire la troglodythe avec ma chatoune sous les toits de Paris, au sixième étage sans ascenseur !
  • Recommander ce blog
  • Retour à la page d'accueil

Etre au courant

Inscription à la newsletter
 

Samedi 2 juillet 2005
Si c'est pas merveilleux ...

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 : ' 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)">
<img
class
="DrteTexte"
src="http://idata.over-blog.com/.../kaos-up.gif" />
</a>
Pour faire le vôtre, il n'y a qu'à changer l'adresse de l'image :
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.)


Vendredi 1 juillet 2005
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.




par Zoélie publié dans : TIP's
 

Temps Perdu

Juillet 2005
L M M J V S D
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
             
<< < > >>

C'est où ???

A votre tour !

Créez votre blog gratuit

Syndication

  • Feed RSS 2.0
  • Feed ATOM 1.0
  • Feed RSS 2.0
 
 
Contact - C.G.U. - Rémunération en droits d'auteur avec TF1 Network - Signaler un abus