BANNIERE ENTETE HTML

Bienvenue chers visiteurs dans mon Univers des Astuces Bloggers

Bonjour ou Bonsoir!

Un petit rappel quand vous voulez tester des trucs assurez vous de faire une sauvegarde et même prendre des notes surtout si vous manipulez dans Modifier HTML noter la ligne par prudence copier le code que vous enlever et coller dans un notepad si jamais vous devez remettre le code vous allez pouvoir corriger.* Les commentaires ont ete desactiver maintenant. Venez consultez comme vous voulez ici ce blog est fait pour vous aidez a embellir vos blogs et apprendre les fonctions . Bonne lecture !


BASE
URL des articles Ajout du CSS Creer livre d'Or
Sauvegarder le theme Creer des catégories Creer un Onglet
Creer une page Suppr la Mise en Forme d'un texte ( copier/coller)

Montage de blog de base
Creer Liste d'amies ou Autres

Flux Rss

Recents Articles

URL de L'image / Heberger une Image

Image en Html avec ou sans bordure

Suppr.le fond Blanc images ou noir
BORDURES & Coins Arrondis
Bordures en dessous des commentaires Bordures Verticales entre les articles et colonnes Coins Arrondis
Bordures des titres d'Articles Separateur entre Gadgets Coins Arrondis sur des images
Supprimer la Bordure Noir autour des images (shadow) Supprimer une grande bordure (bande) ombre portée ou degradé en dessous de la bannieree et le pied page Encadrement pour vos textes

Bordures de titre de Gadgets avec arriere plan Bordure avec espacement pour nombres de commentaires

Bordures autour des Articles et accueil en-bas

BOUTONS
Bouton Deco des commentaires Bouton, Banniere, Image Cliquable (1ere partie) Bouton Entete de page
Bouton Mailto Bouton Reponse dans les commantaires Onglet de liens Coulissant

CENTRER
Centrer Banniere Entete Centrer le texte des articles Centrer le titre des articles
Centrer le texte de l'onglet et Gadgets  Centrer le texte des commentaires Centrer le titre des menus onglet
Centrer une image dans les gadgets Centrer des images identiques Centrer la date des articles

Banniere Html #1
Banniere Html #2 avec bordure et arrondis    
NOUVEAUTÉ


COMMENTAIRES
Arriere Plan avec texture ou Glitters GIF pour les commentaires  Deco pour commentaire Centrer Le texte des commentaires
Bouton Reponse  Bordures en dessous des commentaires Changer la couleur du texte et la taille du texte
Fond, bordures, les marges, date, avatar, texte etc.. Commentaires dans la colonne Gestion des commentaires
Separateur GIF entres les Commentaires Lien cliquable dans les commentaires Inserer des emojis
TEXTES
Ajouter Police d'écriture Espacement entre les textes Texte qui defile 
Texte Arc-en-ciel Centrer le texte des commentaires Changer la taille du texte dans les Gadgets

Texte defilant dans la barre en haut navigation Centrer le texte des article Titre des Articles couleur , police et taille..

Deplacer le Titre du BLOG

Centrer le texte dans l'onglet






DECO
Puce de liens Remplacer le Favicon Avatars Rondes
Boutons Deco Entete de page Faire bouger un GIF Curseur Etoiles Filantes
Bouton Deco Commentaires Des Bulles Curseur avec des coeurs
Lumiere de Noel

Deco de chaque coté 

Effet de Neige 1

Barre Accueil Curseur qui suit la souris Fleches Haut & Bas
Effet de Neige 2

Decompte de Noel

Icone en coter de l' avatar
Follower Personalisable

Fond (bordure) en dessous des articles et menu

Formulaire Contact Personaliser
NOUVEAUTÉ
AUTRES
Scrollbar avec des liens Supprimer Atom Creer une Annexe ou site
Scrollbar Retirer option partager Page Profil
Page d'Accueil Espacement Haut et bas Banniere entete Espacement des articles  entre titre et la date 
Musique Autoplay Heberger vos Images chez DRIVE Mot de Passe sur un Fichier Zip
Tableau Liste 1 colonne

Marges entres les Gadgets

ARRIERE PLAN + IMAGES
Arriere Plan Central  Arriere Plan des titres de Gadget Diaporama
Arriere Plan des commentaires Arriere Plan Barre Accueil en Bas Fond d'Article
Banniere, Image, bouton  Cliquable (2e partie)

Afficher vos Creations en HTML5

Fullscreen#1
Fullscreen #2
AIDES  BLOG
Ghislaine   Forum Blogger FR Aide et Support 



 KITS DESIGNS & HTML
Cadres HTML + chez Dalila Deco Blog chez Maryse  Horloges et Calendrier chez Criniere
Deco Blog AngePB

Effets de Pluie plusieurs modele code html

Les Horloges de Thalia

Huguette Designs
Huguette Html



Formulaire de Contact personnaliser

(Avant) la base 
(Apres) lorsque j'ai personaliser 


On a tous ou presque tous ce Gadger de formulaire quon a installer dans une colonne. Il est basic mais maintenant vous pouvez le personaliser. Voici comment j'ai faites le code qui se trouve plus bas .

(rappel) Une derniere chose n'ecrivez pas entre les codes sinon sa entre en conflit. Faut vous notez cest quoi en anglais sur ujn papier ou un bloc note et non sur le code direct. Jai vue cette erreur de plusieurs d'entre vous et la plupart du temps sa entre en conflit que les effets fonctionne pas  a 100% comme il devrait. 


==== Explication ======

Voici la traduction des mots de anglais en francais

widht= largeur /heigh= hauteur/ padding = marge interieur/ button-submit= bouton envoyer/contact-form-email-message= la boite du formulaire contact / font size = taille police ecriture/ border = bordure/
contact-form-button-submit:hover= bouton  envoyer survol /  line-height= l'espace en hauteur pour le texte (pour le bouton) / contact-form-widget= Gadget du formulaire de contact / text-align center= texte centrer/ 

Le  code ''Color'' est la couleur de l'ecriture. 
Bordures:  dotted = pointillé/ solid=simple/ dashed=tiret

Choix police ecriture en css :

 https://www.w3schools.com/css/css_font.asp

OU

https://www.w3.org/Style/Examples/007/fonts.en.html#:~:text=Font%20styles-,Font%20families,%2C%20monospace%2C%20cursive%20and%20fantasy.&text='fantasy':%20decorative%20fonts%2C%20for%20titles%2C%20etc.

OU

https://www.tutorialbrain.com/css_tutorial/css_font_family_list/


====  INFO CSS============

Note:Si le code fonctionne pas en Css essayez en Modifier Html  avant ....]]></b:skin> et si sa fonctionne toujours pas dernier option que je connais est avant   .....}]]></b:template-skin>


======== CODE ==========

 .contact-form-widget {

width: 400px; 

border-radius: 55px 3px;

max-width: 100%;

padding: 4px;

background: #152820; 

font-family: Fantasy, papyrus;

 text-align: center; 

 font-size: 18px;

color: #729485; 

border: 8px double #45896b;

}

.contact-form-name, .contact-form-email, 

.contact-form-email-message { width: 100%; max-width: 400px; }

.contact-form-button-submit {

border: 3px dotted #4f4089;

background: #ab9be9;  

color: #ffffff;  

width: 100%; 

 height: 40px; 

 line-height: 30px;

font-family: Fantasy, papyrus; 

 text-align: center; 

  font-size: 18px; 

}

.contact-form-button-submit:hover{

border: 2px solid #342f4d;

background: #342f4d;


==================Des Modeles pour vous ==================

J'ai faites quelques modeles pour vous aidez .

https://les-astuces-blogger.blogspot.com/p/formulaire-contact-de-couleur-lot-1.html

https://les-astuces-blogger.blogspot.com/p/formulaire-contactchoix-de-couleurs-lot.html



4 commentaires:

  1. cc Sorcière merci encore pour tes astuces j'èspère que tu vas bien ? belle soirée bisous ♥

    RépondreEffacer
    Réponses
    1. De rien sa me fait plaisir. Oui ca va merci des projets qui prend un peu mon temps mais ca va. Jirais te voir a la suite de ce message. Bon week end bisous

      Effacer
    2. ♥♥♥ merci bon week-end bisous 💙💙

      Effacer
  2. Bonjour ma gentille Sorcière
    Merci pour cette belle astuce pour améliorer le formulaire de contact.
    Tu es adorable et j'espère que tout va pour le mieux pour toi.
    Que ton samedi et ton dimanche soient un duo de bonheur.
    Que ton dernier week-end de novembre soit un poème d’instants heureux et légers.
    Prends soin de toi.
    Gros bisous d'amitié de mon île où il y fait une chaleur intense d'été.

    RépondreEffacer

😀😁😂😃😅😆😇😈😉😊😋😌😍😎😐😑😒😔😗😘😛😜😝😱😲😴😥😧😭😷😙😖💪👎👍👌🙏👀👋👊👉👈👇👆👅💋💀💕💗💙🍀🌺🎁🎉👻👼👽🍕🍔🎃🎄🎅☕(Copier/coller) pour inserer les emojis dans les commentaires.