Bienvenue sur le forum d'entraide d'OverBlog.
Nous vous conseillons de chercher une réponse sur notre base de connaissances avant de poster une demande sur le forum.
[RÉSOLU] CSS migré
  • Bonjour, j'appelle au secours car je n'arrive pas à modifier le CSS de mon blog migré; j'ai lu les articles postés sur le sujet, mais je ne retrouve rien sur mon css  dans le mode "éditer". J'ai passé plusieurs années à mettre au point la présentation de mon blog et depuis la migration plus rien ne va. Je suis en premium, je ne sais pas si ça change quelque chose. J'envisage de tout arrêter. Merci de m'aider.
  • Bonjour,

    pour faciliter l'aide, merci de mettre l'adresse de ton blog sur ton profil forum dans le rectangle blanc, après avoir cliqué sur ce lien

    Si tu n'y arrives pas, voir la marche à suivre
     sur ce fil
  • Merci Mehdi, j'ai mis le lien sur mon blog: http://www.kauana.com/
  • Bonjour

    sur la FAQ en haut de ce forum tu trouvera un début de réponse


    ♦ IMPORTANT - FAQ - RÉPONSES aux QUESTIONS souvent posées - FAQ

    plus précisément ici

    Comment récupérer son css migré (afin d'y effectuer des modifications)

    concrètement, ton css ancienne plateforme étant sur un fichier externe dans le code kiwi, il est difficile d'y intervenir directement (il faut modifier le fichier externe et le re enregistrer)

    si tu veux faire des modifications, il faut chercher dans ton code (gerer..theme.... editer) la derniere balise </style> qui marque la fin du css kiwi


    pour t'aider a la trouver, en dessous de cette balise </style> tu verra </HEAD> et plus loin <BODY>


    cf capture d'écran

    (ne pas tenir compte du numéro de ligne spécifique a chaque theme )

    il suffira d'ajouter les modifications désirés avant cette balise
    </style>


    Explication:

    ton navigateur lit en premier le fichier externe avec donc ton design ancienne plateforme puis les éventuelles modifications.

    En matière de css, les dernières lignes de code sont prioritaire sur les précédentes.

    si tu demande par exemple une couleur de police noir et qu'a la fin du css tu la demande en rouge, cela sera le rouge qui sera prioritaire.

    donc, tout ce que tu ajoutera avant la dernière balise
    </style> du code kiwi sera prioritaire sur le css externe ancienne plateforme


  • Merci Mehdi, j'ai essayé plusieurs choses:
    1/ en intervenant sur le thème dans le panneau de configuration j'ai du faire une fausse manip , le titre du blog a disparu..
    2/ en allant dans le css , avant la balise "style" j'ai réussi à ajouter un cadre à mes photos dans les articles. Par contre j'ai voulu aggrandir l'espace entre les photos ça n'a pas marché.
    3/Dans le css encore j'ai essayé d'élargir la colonne principale, j'avais trouvé le script sur le forum, mais ça n'a pas marché non plus

    Y a-t-il une manière specifique d'ajouter des codes? et quels codes?

    ça fait beaucoup de questions..
    Merci pour ton aide

    Hélène
  • Bonsoir,

    tout s'ajoute avant la dernière balise </style> (tu met chaque code ajouté les uns sous les autres)

    en premier ,fait une sauvegarde sur ton bloc note de tout ton code.

    1/ pour le titre ,essaye de trouver quelle erreur de manipulation effectué

    2/ pour mettre une marge de 10 px entre chaque image ajoute avant style


    .ob-section * {
        box-sizing: border-box;
        margin-bottom: 10px;
    }


    (tu peut régler le 10 px plus ou moins)


    3/ concernant la largeur des articles et colonne

    sur la droite du forum tu peux voir "legacy" (ton theme)  avec une liste de modification possible

    dont ici


    http://fr.forum.over-blog-kiwi.com/discussion/3016/resolu-je-ne-trouve-pas-comment-elargir-mon-blog/p1
  • pour ton entete, va voir en "gerer"......theme..... configuration

    descend un peu tu devrais voir

    "entete"

    et en dessous

    Contenu personnalisé

    puis "editer html"

    clique sur "editer html"

    c'est la que se trouve ta bannière si tu en a une et tout ce qu'il y a dans l’entête du blog

  • Un grand merci! grâce à ton aide j'ai réussi à faire plusieurs modifications:

    1/ le titre du blog est revenu : c'était bien comme tu me l'as indique dans "thème" "configurer" une deuxième rubrique qui concerne le titre ( j'en étais resté à la première)

    2/ merci pour l'info pour modifier la marge entre les images dans le css : ça a marché impeccable!
    Sur le même principe j'ai apporté d'autres modif sur les marges en allant fouillé dans mon ancien css . Je te montre ici:


      /*lire la suite*/
    .extrait a  {color:#4169E1; }

    /*lire la suite au survol*/
    .extrait a:hover  {color:#4169E1; }

    /*article*/
    .contenuArticle img {border:1px solid ThreeDLightShadow; }
    .article p, .page p {margin:10px;}
    .ob-section * {
        box-sizing: border-box;
        margin-bottom: 10px;}
       
    /*----------------------------------------------------------------------------*/
    body
    .extraitArticle {
        margin-top: 10px;
        margin-bottom: 10px;
        clear: both;
        padding: 20px;
    }


    je n'ai pas réussi à modifier la largeur de colonne mais avec les autres modifications effectuées l'ensemble est plus aéré donc ça peut rester comme ça.

    Je te remercie beaucoup pour cette aide






  • Bonsoir,

    tant mieux si tu y est arrivé


    je tag en "résolu" mais on peut compléter le post éventuellement

    je trouve la couleur de police de tes modules droit peut visible en noir, tu peux tester avec du blanc


    sur le même principe (avant style)  tu ajoute:

    .box a {
        color: #fff;
        text-decoration: none;
    }

    .box-content {
        color: #fff;
        overflow: hidden;
        padding: 10px 5px;
    }

    ________________

    la partie "box content" est pour passer en blanc le texte en dessous du module abonnement  :)

    tu peux bien sur choisir ta couleur
  • tu peux tester un bleu pastel pale aussi

    #B5CBE0
  • au point ou on en est, sur le meme principe tu peux tester aussi un fond de blog fixe, centré

    ce qui fait que tu aura pas la couleur grise en prolongement de ton image


    body {
        background-attachment: fixed;
        background-color: #8697a7;
        background-image: url("http://idata.over-blog.com/3/83/48/28/003_GLACIER_BAY_FND.jpg");
        background-position: center top;
        background-repeat: no-repeat;
    }

    ___________

    le background est fixe

    la couleur #8697a7; sera la couleur qui va apparaitre en prolongement de l'image pour ceux qui consulte ton blog sur de très grand ecran (haute résolution)

    j'ai demandé a l'image de fond de ne pas se répéter, la couleur #8697a7; sera sont prolongement


    (comme tout est avant style, tu peux tester ou supprimer facilement sans chercher des heures ou tu a mis les modifications de code)
  • pour la largeur des articles et de la colonne

    #cl_1_0 
    est la largeur de l'article
    }
    #cl_1_1  est la largeur de la colonne

    actuellement tu as:

    #cl_1_0 {
        float: left;
        margin: 0 20px 0 0;
        padding: 0 10px;
        width: 700px;
    }
    #cl_1_1 {
        float: left;
        margin: 0 5px;
        padding: 0;
        width: 200px;
    }


    il faut modifier proportionnellement la largeur de l'article et de la colonne sinon celle ci passe en dessous

    test:

    #cl_1_0 {
        float: left;
        margin: 0 20px 0 0;
        padding: 0 10px;
        width: 740px;
    }
    #cl_1_1 {
        float: left;
        margin: 0 5px;
        padding: 0;
        width: 160px;
    }

    ___________

    j'ai élargi tes articles de 40 px et diminuer d'autant ta colonne droite (160 px au lieu de 200 )
  • comme je suis motivé et que plonger dans le code est un excellent réveil matin, on peut faire aussi la total en augmentant aussi la largeur global du blog

    pas trop car il faut penser au visiteur ayant des petits écran; j'ai donc ajouté 50 px


    je récapitule

    #global  (largeur global actuellement a 950 px ,on va la passer a 1000 px

    #cl_1_0  est la largeur de l'article
    }
    #cl_1_1  est la largeur de la colonne


    du coup si je passe à un global de 1000 px je peux élargir un peu plus le bloc "article"

    je l'ai passé ici a 790 px

    code a ajouter:

    #global {
        background-color: transparent;
        margin: 20px auto;
        width: 1000px;
    }

    #cl_1_0 {
        float: left;
        margin: 0 20px 0 0;
        padding: 0 10px;
        width: 790px;
    }
    #cl_1_1 {
        float: left;
        margin: 0 5px;
        padding: 0;
        width: 160px;
    }

    _______________

    tu notera que 790 px plus 160 px font 950 px et pas 1000.......normal le différentiel de 50 px est prit par les diverses marges. :)

    tu peux t'amuser à tester maintenant :) (en simulation cela fonctionne)

  • Bonjour Mehdi,
     Excuses moi de ne pas avoir donné suite, j'étais sans connexion..Tu me donnes plein de tuyaux pour améliorer le blog, mille mercis..Je n'ai pas une minute libre en ce moment mais d'ici deux semaines je pourrai m'y remettre. Merci et à bientôt
  • Bonsoir Mehdi, J'espère que je peux reprendre le fil ici...J'ai fait les modifications que tu m'avais indiquées...Impeccable! Un grand merci , ça rend très bien!.ça rendait très bien car depuis une demie heure plus rien ne va, la première page de mon blog apparait tout en blanc..Je ne comprend pas ce qui se passe...
  • A peine dit à peine disparu...Tout est revenu dans l'ordre... Un grand merci encore Mehdi pour tes conseils.