Modifier les icônes du menu

basylbasyl Member

Bonjour à tous, sur mon sitehttps://mushingspirit.fr je voudrais modifier l'image des icônes home, label etc et mettre mes propres icônes.
Savez-vous où se trouvent ces images appelées par "icon-sli-home" ou "icon-newspaper" par exemple ?
Merci

Réponses

  • cpalocpalo Member

    Bonjour,
    Va regadrerdans le fichier components.css et là tu trouveras la section relative aux icones :-1: `

    /* Icon font - MFG labs */
    @font-face {
      font-family: 'mfg';
        src: url('../font/mfglabsiconset-webfont.eot');
        src: url('../font/mfglabsiconset-webfont.svg#mfg_labs_iconsetregular') format('svg'),
               url('../font/mfglabsiconset-webfont.eot?#iefix') format('embedded-opentype'),
             url('../font/mfglabsiconset-webfont.woff') format('woff'),
             url('../font/mfglabsiconset-webfont.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    i, .icon {
      font-family: 'mfg';
      font-size: 1em;
      font-style: normal;
      font-weight: normal;
      color:#e3e3e3;
    }
    .icon2x {font-size: 2em;}
    .icon3x {font-size: 3em;}
    .gradient {
      color: #999999;
      text-shadow: 1px 1px 1px rgba(27, 27, 27, 0.19);
      transition: all 0.1s ease-in-out 0s;
    }
    .gradient:hover, .gradient .current {
      color: #EEEEEE;
      text-shadow: 0 0 3px rgba(255, 255, 255, 0.25);
    }
    .icon-cloud:before { content: "\2601"; }
    .icon-at:before { content: "\0040"; }
    .icon-plus:before { content: "\002B"; }
    et ainsi de suite
    
  • cpalocpalo Member

    Mais tu peux très bien utiliser d'autres icones ( bootstrap, fontawesome, etc).
    Il te suffit de télécharger la famille d'icones correspondantes et de modifier le css et le template en conséquence:

  • cpalocpalo Member

    Et enfin pour l'icone accueil tu as dans responsee.css

    ul.chevron .submenu > a:after, ul.chevron .sub-submenu > a:after,ul.chevron .aside-submenu > a:after, ul.chevron .aside-sub-submenu > a:after {
      content:"\f004";
      display:inline-block;
      font-family:mfg;
      font-size:0.7em;
      margin:0 0.625em;
    }
    
  • cpalocpalo Member

    Oups je me suis basé sur responsee 6.2
    Alors que ton site utilise responsee 7.1
    Et dans responsee 7.1 il y a maintenant un fichier icons-min.css

  • basylbasyl Member

    Bonjour Cpalo, merci pour tout je vais tester. Bon dimanche.

  • basylbasyl Member

    Bonjour, dans theme d'admin il y a un dossier Fonts. Du coup je pense que l'on ne peut pas modifier l'image ou la couleur des fonts soi-même ?

  • cpalocpalo Member

    Attention ce thème d'admin ( dans le dossier core/admin/theme) c'est pour "styliser" le backend ( panneau d'administration).
    On peut bien entendu le modifier et ainsi avoir son propre panneau d'administration.
    Mais ça n'a rien à voir avec le frontend (ce que les visiteurs voient) et ce grace à ton dossier themes/ton-theme).
    Si ce sont les fonts (couleur en particulier)que tu veux modifier c'est bien dans ton-theme/css que cela doit se faire.

  • basylbasyl Member

    Bonsoir et merci beaucoup, j'ai réussi à trouver la solution en passant par l'inspecteur et en modifiant la couleur au bon endroit dans le thème frontend.https://mushingspirit.fr/

Connectez-vous ou Inscrivez-vous pour répondre.