Suite à l'installation du nouveau design, le blog peut encore présenter quelques erreurs, ou bugs d'affichage. Merci de votre compréhension.

Le guide du Blogging de Hellocoton

Je vous écris un petit article rapide pour vous dire que Hellocoton à réalisé un grand dossier sur le blogging ! Vous y trouverez des articles sur pleins de sujets en rapport avec son blog : des conseils de base pour bien commencer, des infos sur les partenariats et la monétisation, des conseils pour optimiser vos photos, des témoignages, comment améliorer le référencement de son blog, améliorer sa visibilité sur les réseaux sociaux, et des infos pour les blogueurs sur Wordpress et sur Blogger, et pleins d'autre sujets ! Allez jeter un œil c'est très intéressant !

C'est d'ailleurs sur ce dernier que je voulais en venir. Vous pouvez retrouver 3 de mes tutoriels pour personnaliser son blog sous Blogger dans le dossier Bien bloguer sous Blogger !!! Merci à Joy pour l'info ! ;)
Ça fait super plaisir !! :D :D

Afficher les articles en miniature et en grille

Le guide du Blogging de Hellocoton - Tutoriels sélectionnés lady bird red

Voir le tutoriel >>

Créer et ajouter un favicon

Le guide du Blogging de Hellocoton - Tutoriels sélectionnés lady bird red

Modifier l'apparence des titres de la barre latérale

Le guide du Blogging de Hellocoton - Tutoriels sélectionnés lady bird red

Voir le tutoriel >>

Autres articles

13 commentaires:

  1. C'est grâce à ce guide que j'ai découvert ton blog, c'est une bonne chose :)

    RépondreSupprimer
  2. Bonjour Catherine,
    Merci pour tous ces tutoriels sur blogspot, certains m'ont beaucoup aidés.

    J'ai en revanche une question à propos des images, je viens de personnaliser un thème et mes anciennes images sont beaucoup plus large que la largeur de mon blog, existe t'il un moyen pour que mes images changent automatiquement de taille avec le thème ? Comment fais-tu, quand tu changes de "thème" et que tes images ne s'adaptent plus à la dernière largeur du blog ?

    Amélie

    ps : félicitation pour la sélection de tes articles dans ce dossier :)

    RépondreSupprimer
    Réponses
    1. C'est très simple il suffit d'un tout petit code :)

      Va dans Modèle puis clique sur Modifier le code HTML.
      Clique sur le triangle noir à gauche de <b:skin>...</b:skin> et clique n'importe où dans la boîte de code. Appuie sur Ctrl et F en même temps. Dans la boîte de recherche qui apparaît en haut à droite colle :

      /* Content

      Et appuie sur Entrer.

      Au-dessus de cette ligne colle ceci :

      /* Largeur maximale des images à 100% de son contenant */
      img {
      max-width: 100%;
      }

      Comme ceci :

      /* Largeur maximale des images à 100% de son contenant */
      img {
      max-width: 100%;
      }

      /* Content

      Sauvegarde, et voilà ! ;)

      Supprimer
    2. Merci pour ce code, ça fonctionne parfaitement :)

      Supprimer
  3. Bonjour, tout d'abord merci pour ces conseils que vous nous donnez. J'aurai néanmoins besoin de vos conseils... Voilà, je viens de créer mon blog et j'ai installé un template. Seulement je n'aime pas du tout la barre noir au-dessus de l'entête et mes connaissances en code HTML sont si maigres que je n'arrive pas à y remédier... Aurais-tu une solution ou un conseil ?
    http://pop-and-romane.blogspot.fr
    Merci d'avance
    Romane

    RépondreSupprimer
    Réponses
    1. Bonjour Romane,

      Pas de soucis, vas dans modèle à partir du tableau de bord Blogger, et clique sur Modifier le code HTML.
      Clique sur le triangle noir à droite de <b:skin>...</b:skin>. Clique n'importe où dans la boîte de code et appuie sur Ctrl et F en même temps.
      Dans la boîte de recherche qui apparaît en haut à droite colle :

      #navigation { background:#171717; }

      Remplace cette ligne par :

      #navigation { display:none !important; }

      Ensuite cherches :

      #header {

      Sous cette ligne tu devrais trouver une ligne qui commence par :

      padding-top:

      Remplace tout la ligne par ceci :

      padding-top: 0;

      Sauvegardes, et voilà ! ;)

      Supprimer
    2. Merci beaucoup, c'est parfait !

      Supprimer
  4. Bonjour Catherine,
    Je me permets de te poser encore une question, je cherche à mettre des icônes dans ma colonne de gauche un peu comme toi. J'ai réussi à faire mes liens sur mes images, en revanche je ne trouve pas comment faire pour avoir des espaces sur les cotés de mes icônes. Y a t'il un code que je dois modifier ?

    Bonne fin de soirée,
    Amélie

    RépondreSupprimer
    Réponses
    1. Bonjour Amélie,

      Pour ajouter un espace autour de tes images il faut ajouter les lignes de code CSS suivantes au code CSS de tes images :

      padding-left: 5px;
      padding-right: 5px;

      Ces 2 lignes définissent un espace de 5 pixels à gauche et à droite.

      Par contre je ne peux pas te donner le code CSS de tes images, pour cela il faudrait que je puisse voir ton blog :)

      Supprimer
    2. Bonjour Catherine,
      J'ai essayé de chercher ou mettre les codes que tu m'as donné mais je ne trouve pas. Mon blog est maintenant accessible en "public".

      Par la même occasion est ce que tu sais pourquoi mes photos sont décalé par rapport aux textes de mes articles ?

      Bonne journée,
      Amélie

      Supprimer
    3. Bonjour Amélie,

      Vas sur Modèle > Modifier le code HTML. Cliques sur le triangle noir à gauche de <b:skin>...</b:skin> puis cliques n'importe où dans la boîte de code. Appuies sur Ctrl et F en même temps. Dans la boîte de recherche colles :

      /* Content

      Appuies sur Entrer pour trouver cette ligne.
      Juste au-dessus de cette ligne, colles :

      #HTML1 img {
      padding-left: 5px; /* Espace à gauche de l'icône */
      padding-right: 5px; /* Espace à droite de l'icône */
      }

      Ce code va te permettre d'ajouter un espace à gauche et à droite des icônes de réseaux sociaux de ta barre latérale.
      Changes la valeur 5px par celle qui te convient.

      Par défaut il y a un espace entre les images des articles et le texte, pour supprimer cet espace ajoutes à la suite du code CSS précédent, les codes suivants :

      .post-body a {
      margin: 0 !important;
      }

      .post-body img {
      padding: 0 !important;
      }

      Et voilà ;)

      Supprimer
    4. Bonjour,
      Merci pour ces explications.
      Bonne fin de journée à toi et j'ai hâte de découvrir le nouveau design de ton blog :)

      Supprimer
  5. Ahah je viens de voir la petite dédi :) <3

    RépondreSupprimer

Le blog est officiellement en PAUSE. Je ne pourrai PAS répondre à vos commentaires. Pour plus d'infos.

Vérifiez que la réponse à votre problème ne se trouve pas déjà dans les commentaires ;)

Lady Bird RedDesign et contenu par Catherine Surr
Mentions légales . Un blog créé sur Blogger