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] Encadrement widget et autres modifications( pages catégories lien )
  • Bonsoir

    Avant style tu colle:

    .widget {
        margin-bottom: 25px;
        border: 2px solid;
        border-radius: 8px;
        background-color: #BCD2E4;
    }


    .widget .widget-title {
        color: #666;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 8px;
    }

    ____________

    explication:

    .widget

    .widget {
        margin-bottom: 25px;  (marge basse)
        border: 2px solid; ( encadrement 2 px)
        border-radius: 8px; (bord encadrement arrondi..plus joli)
        background-color: #BCD2E4; (couleur de fond de l'ensemble des widgets)
    }


    titre des widgets

    .widget .widget-title {
        color: #666; (couleur)
        font-size: 15px; (taille de la font)
        font-weight: 800; ( j'ai augmenté le coté "gras" de la fonte (500 actuellement..je l'ai mis a 800)
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 8px; ( j'ai ajouté une petite marge pour que le titre ne soit pas trop collé à l'encadrement)
    }


    ________________

    concernant le style de police du texte des widgets;..j'arrive pas à les modifier indépendamment..si on change le style ( arial, trebuchet etc...), on change aussi celui des articles

    __________

    Pour augmenter le nombres de catégories à afficher sur le blog il y a un fil sur la faq de ce forum traitant du sujet

    l'encadrement ajouté (border 2px solid) s'adapte automatiquement au nombre de catégories affichées

    ___________

    resultat en simulation:

    image



    image




  • j'ai modifié le titre du post pour le rendre plus explicite pour une recherche future

    (tu peux changer les valeurs de mes ajouts de lignes de code bien sur)
  • tu peux tester aussi avec un fond plus clair

    .widget {
        margin-bottom: 25px;
        border: 2px solid;
        border-radius: 8px;
        background-color: #D2FAFB;
    }

    ______________

     #D2FAFB; au lieu de  #BCD2E4; sur le post au dessus

    image



  • au passage tu devrais songer à installer une balise de centrage de tes iframe "investing" pour que le widget soit centré

    <IFRAME ALIGN="center"> le code </IFRAME>


  • Bonjour Médhi, 
    ok pour les fonds. Merci.

    Est il  possible de remplacer les mots " page , catégories , liens " par ( dans l'ordre respectif ), 
    Divers 
    Stratégies Intraday
    Actualités Financières  ? 


    Humm , tous les titres sous page categories liens, ( juste pour infos et/ou tests esthétiques ) peut on changer la couleur ? 

    Concernant la balise de centrage , je veux bien , mais la franchement ton dernier commentaire relatif a la balise de centrage, heuuu c 'est du chinois la pour moi . 
    Je copie la dernière phrase dans le CSS just avant style ? ou c'est comme creer un module ( bascule HTLM ) ? 
    merci 




  • humm , pardon , je retire ma question concernant les couleurs pour les titres sous les pages categories et liens 
    Tout est ok , IDEM pour couleur de fond . ( Goog job , Medhi is the best :)   ) 

    Juste si je peux changer c'est trois termes, ( page categories liens ) en ( Divers, Stratégies intraday , Actualités financières ) . 

    et cette histoire de centrage 

    Merci , ( va est super content )  :) 

  • c'est trois termes ( ces ) OUPS pardon 

  • Bonjour

    concernant les intitulés..il faut encore plonger dans le code twig..je regarderais plus tard

    concernant les iframes

    sauf erreur de ma part,  les codes que tu a insérer en mode html dans un module en "configuration se présente sous cette forme:


    <IFRAME> des lignes de code données par investing </IFRAME>


    on ajoute juste donc une balise de centrage et on remplace le premier  <IFRAME> par <IFRAME ALIGN="center">

    ce qui donne

    <IFRAME ALIGN="center"> le code investing </IFRAME>

    ____________

    Pour information, concernant l’encadrement des modules droit...j'ai donc ajouté une propriété border......que j'ai déterminé comme "solid"....avec une épaisseur de 2 px (  border: 2px solid;)

    Huit styles sont possibles en CSS 2.1  
    • dotted (pointillé)
    • dashed (tirets)
    • solid (solide)
    • double (double)
    • groove (rainurée)
    • ridge (relief)
    • inset (relief intérieur)
    • outset (relief extérieur)

    ce qui donne:

    image






  • Re , 
    ok merci pour ces précisions, 
    par contre avant de tenter de centrer tout ca, j'ai voulu ajuster tous les modules sur la meme taille . 
    Mais si ca a marché pour tous, il y en a un j'arrive pas , je comprend pas . 


  • bonsoir,

    si tu lis le code il y a 2 endroits ou il faut changer le 213