• Il faut rajouter ce code dans ton CSS

    #menubar {
    color: #FFFFFF;
    }

    En remplacant #FFFFFF par la code de la couleur de ton choix.

    Pour appliquer une ombre portée au texte

    #menubar { 
        text-shadow: 1px 1px 2px #000000;
    }

    Remplace  #000000 par la couleur que tu veux appliquer à l'ombre.


    1 commentaire
  • Pour changer le fond de la barre de menu il faut ajouter ceci dans ton CSS :

    #menubar {background-image: url("urldel'image");}

    Et remplacer urldel'image par l'url de l'image que tu souhaites mettre en fond.
    Tu verras des traits blancs de séparation entre les menus après, si tu souhaites les enlever
    tu dois insérer ceci à la suite :

    #menubar_section_content{
    background-image: none;
    }
    #menubar_section_appearance{
    background-image: none;
    }
    #menubar_section_interactions{
    background-image: none;
    }
    #menubar_section_manage{
    background-image: none;
    }
    #menubar_section_account{
    background-image: none;
    }
    #menubar_notifications{
    background-image: none;
    }
    #menubar_signin {
    background-image: none;
    }
    .menubar_button {
    background-image: none;
    }
    #menubar_favorites{
    background-image: none;
    }

    Merci à Chelinka pour sa dernière précision !

    Pour appliquer une ombre portée sous la barre

    #menubar { 
        box-shadow: 1px 1px 2px #000000;
    }

    Tu remplaces #000000 par la couleur de ton choix.


    1. Changer le fond des sous-menu

    Il y a deux images de bases pour les sous menus sur Ekla.
    Celle-ci : submenu_item.png
    Et celle-là qui concerne le dernier sous-menu : submenu_item_last.png

    La partie supérieure de chaque image correspond à celle que l'on voit sans passage de la souris.
    La partie inférieure correspond donc au moment où l'on passe la souris sur le sous-menu.
    Tu ne dois en aucun cas découper ces images si tu souhaites les modifer, elle doivent se trouver sur la même image et garder le meme format que celles de base.

    Quand tu les a modifiées comme tu le souhaite, tu inséres ces codes dans ton CSS.

    .menubar_section li {
        background: url("urldel'image:submenu_item.png") no-repeat scroll 0 0 transparent;
    }
    .menubar_section li:last-child {
        background: url("urldel'image:submenu_item_last.png") no-repeat scroll 0 0 transparent;
    }

    Bien sûr, tu remplaces les url par celles qui sont concernée.


    2. Changer la couleur du texte mon compte sur la barre de menu

    Il faut rajouter ce code dans ton CSS

    #menubar {
    color: #FFFFFF;
    }

    En remplacant #FFFFFF par la code de la couleur de ton choix.


    13 commentaires
  • Il faut ouvrir sa feuille de CSS et insérer, selon votre choix :

    a.
    Pour arrondir les coins des menus

    #menu1 {
    border-radius: 30px ; 
    }

    b. Et ajouter une lueur

    #menu1 {
    border-radius: 30px ;
    box-shadow: 0 0 10px #FFFFFF;
    }

    Si vous voulez changer la force de l'arrondi (border-radius) (Circulaire, ou lègerement) vous remplacez 30px par la valeur voulue. 10px est à remplacé si vous souhaitez changer l'étendue de votre ombre (box-shadow) mais en principe ce n'est pas la peine. Enfin, #FFFFFF, c'est tout simplement la couleur de l'ombre.
    Pour appliquer tout ça au menu de droite vous remplacez le 1 de #menu1 par 2, donc #menu2.


    c. Pour arrondir les coins des articles

    .module_contenu {
    border-radius: 30px ;
    }

    d. Et ajouter une lueur

    .module_contenu {
    border-radius: 30px ;
    box-shadow: 0 0 10px #FFFFFF;
    }

    e. Pour arrondir les coins du blog

    #background {
        border-radius: 30px;
    }

    f. Et ajoutez une lueur

    #background {
        border-radius: 30px;
         box-shadow: 0 0 10px #FFFFFF;
    }

    g. Pour arrondir les coins du header

    #header {
        border-radius: 30px;
    }

    Remarque : Il est possible de n'appliquer qu'un "semi-arrondissement", pour cela remplacez les border-radius: 30px; (et UNIQUEMENT.) par ceci :
    border-top-left-radius: 100px;
    border-bottom-right-radius: 100px;
    (Merci à
    Fubuki)


    35 commentaires
  • Pour ça il faut avoir le Javascript activé sur son compte, si ce n'est pas fait il faut envoyer une demande au Staff d'Eklablog ou faire sa demande sur le forum à cette adresse. Une fois que le Javascript est activé sur son compte, pour desactiver le clique droit il faut coller le code ci-dessous en cliquant sur le bouton HTML dans l'interface d'édition d'un module simple du blog.

    <script type="text/javascript">// <![CDATA[
    document.body.oncontextmenu = function(){ alert("Clic droit désactivé !"); return false };
    // ]]></script>

    EDIT 2015 : Il est désormais possible de désactiver ce clic droit via Configuration > Avancé > Désactiver le clic-droit !


    13 commentaires
  • <a href="urldetonimage"><img src="urldetonimage" height="*" width="**"/></a>

    urldetonimage sera remplacé par l'url de l'image à redimensionner en question.
    Tu dois remplacer l'* après height par un chiffre qui correspondra à la hauteur de ta miniature en pixels.
    Par exemple, si tu veux que ta miniature fasse 100 pixels de haut, tu mettra 100. Pour l'** après width, tu devra également mettre un chiffre qui correspondra à la largeur de ta miniature.
    Il est possible aussi de ne mettre que la largeur ou la hauteur, dans ces cas, si tu ne met que la largeur, la hauteur se fera automatiquement par rapport a la taille de l'image de base. Et inversement.

    Pour ne définir que la hauteur ce sera ce code (On enleve juste le width)
    <a href="urldetonimage"><img src="urldetonimage" height="*"/></a>

    Et pour ne définir que la largeur ce sera celui-ci (On enleve height)
    <a href="urldetonimage"><img src="urldetonimage" width="**"/></a>


    4 commentaires