Nouveau design pour le blog

​Comme vous avez pu le voir, le design du blog à changer.

Et oui, au début je voulais quelque chose de beau, original, sophistiqué. J'avais donc cherché des modèles pour blogger et trouvé celui-ci.

Au fil de son utilisation, je me suis vite rendue compte que je ne pouvais pas le personnaliser comme je le souhaitais (vu mon niveau très médiocre en html) et que celui-ci ne me correspondait pas vraiment.

Avec un peu de recul, je me rends compte de mes erreurs :

• personnalisation du modèle au fil de l'eau, au fil des besoins, sans y avoir réfléchis avant le lancement du blog ;
• je ne savais pas trop où j'allais ;
• j'étais débutante dans la blogosphère et avec blogger ;
• je souhaitais quelque chose de sophistiqué alors que un modèle simple, plus épuré me convient mieux.

Après deux mois d'existence (et d'expérience), je sais maintenant ce que je veux ou non pour mon blog. J'ai donc décidé de repartir de zéro avec un nouveau design. Cette fois, j'ai fait les choses proprement (enfin je crois). J'ai créé un blog "brouillon" pour mettre au point mon nouveau thème avec toutes les fonctionnalités que je souhaitais avant de l'appliquer au blog (au vrai).

Je suis partie d'un modèle Blogger (Éthéré,de son petit nom) que j'ai personnalisé grâce aux outils intégrés à Blogger et à de supers tutos dont voici la liste :

• Boutons pour suivre le blog sur les réseaux sociaux (en haut à droite) : D'ailleurs, n'hésiter pas à aller y faire un tour : ici ;
• Création d'une page de contacts : ici ;
• Mise en place d'une newsletter : ici ;

Pour la mise en forme des billets, j'ai ajouté le code CSS suivant dans Modèles / Personnaliser / Avancé / Ajouter le fichier CSS :
p, li {
text-align: justify; /* Justifier le texte des paragraphes et des lignes de listes */
color: gray; /* couleur du texte gris*/
font-size: small; /* utiliser une police small*/
font-family: 'comic sans ms';
}

p:first-letter { /* Pour la première lettre de chaque paragraphes : */
font-size: large; /* Utiliser une police large */
font-weight: bold; /* Et grasse */
color: #3fcad8; /* De couleur turquoise*/
}

h4{ /*Sous titre*/
font-size: large; /* Utiliser une police large */
font-weight: bold; /* Et grasse */
color: ##3fcad8; /* De couleur turquoise*/
text-decoration: underline; /* et soulignée */
font-family: 'comic sans ms';
}

h5{ /*Dernier phrase article*/
font-size: small; /* Utiliser une police small*/
font-weight: normal; /* Et normal*/
color: ##3fcad8; /* De couleur turquoise*/
font-style: italic; /*en italique*/
font-family: 'comic sans ms';
}

h6{ /*légende*/
font-size: small; /* Utiliser une police small*/
font-weight: normal; /* Et normal*/
color: gray; /* De couleur gris*/
font-style: italic; /*en italique*/
font-family: 'comic sans ms';
text-align: center; /*et centrée*/
}

La prochaine étape sera d'ajouter une liste d'articles similaires à la fin de chaque billet.

J'espère que ces tutos pourront également vous aidez dans la personnalisation de votre blog.

Alors que pensez-vous du nouveau design ?