Topic-icon Modifier les titres modules sous GANTRY (H1, H2,...) HYDROGEN

Plus d'informations
16 Nov 2016 10:46 #8617 par eeloy
Message
Bonjour,

Tout nouveau sur l'utilisation de Joomla et de Gantry 5, template HYDROGEN, j'aimerai pouvoir modifier les styles et les polices des titres des modules par le biais des tags H1, H2...

Après maintes recherches sur internet, forum, je n'arrive pas à trouver un sujet qui correspond.

Quand j'utilise Firebug, le lien qui correspond au titre est un fichier css_compiled. Hors j'ai pu lire qu'il ne faut pas modifier les css_compiled et après expérience personnelle quand je modifie le css_compiled, tout s'efface après un changement dans gantry.

J'ai lu un sujet qui parlait de CSS/LESS, j'ai essayer mais je n'ai pas réussi et je ne sais pas quoi écrire.

Je répète je suis tout nouveau sur le sujet des css.

J'aimerais avoir une police H3 comme :

h3
{
font-size: 32px;
text-shadow: -1px -1px #0c0, 1px 1px #060, -3px 0 4px #000;
font-family:Arial, Helvetica, sans-serif;
color: #090;
padding:16px;
font-weight:lighter;
-moz-box-shadow: 2px 2px 6px #888;
-webkit-box-shadow: 2px 2px 6px #888;
box-shadow:2px 2px 6px #888;
text-align:center;
display:block;
margin:16px;
}

J'ai pu lire dans le fichier du template, que le fichier correspondant au fichier H1 est : /nucleus/theme/typography.css

Mais je ne sais pas quoi écrire .

Pouvez vous m'aider fortement soit à modifier le fichier racine soit à créer un fichier qui écraserait ou qui passerai prioritaire pour changer ces tags, en m'expliquant étape par étape.

Merci :-)

Vous devez vous connecter Connexion ou Créer un compte pour prendre part à la conversation.

Plus d'informations
16 Nov 2016 10:51 #8618 par C-Jay
Réponse
Hello,

Il te faut en fait tout simplement créer un fichier custom.scss dans le répertoire /custom/scss/ de ton template.
Cela est bien détaillé dans la doc. de Gantry :
docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet

Tout ce que tu mettras dedans overridera tout autre CSS.

C'est le même principe qu'avec le template-custom.less sous Gantry 4 , mais plus besoin de jouer sur la spécificité CSS.

A la recherche d'un hébergement / hébergeur Joomla spécialisé, performant et sécurisé ? Choisissez SiteGround (Nouvelles offres : -50% sur leur offre Start Up !)
Découvrez le guide Réussir son entreprise sur Internet grâce à Joomla
Découvrez le le centre de formation NosyWeb
Cet utilisateur a été remercié pour son message par: eeloy

Vous devez vous connecter Connexion ou Créer un compte pour prendre part à la conversation.

Plus d'informations
17 Nov 2016 06:51 #8619 par eeloy
Réponse
Merci beaucoup pour votre réponse rapide ! Ca marche à la perfection !

Par contre j'aimerais installer de nouveaux fonts.

Après avoir suivi les étapes de conversion de fichier en .eot .svg .woff .woff2 etc... et les avoir insérés dans un nouveau dossier dans /fonts de mon template HYDROGEN, je ne sais quoi faire du fichier .css

Pouvez vous m'aider ?

Vous devez vous connecter Connexion ou Créer un compte pour prendre part à la conversation.

Plus d'informations
17 Nov 2016 08:50 #8620 par C-Jay
Réponse
Je pense qu'il est plus simple que tu ajoutes directement une Google Font via un appel externe :
fonts.google.com/

Dans le code source de NosyWeb.fr, tu verras par exemple :
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato" />

A la recherche d'un hébergement / hébergeur Joomla spécialisé, performant et sécurisé ? Choisissez SiteGround (Nouvelles offres : -50% sur leur offre Start Up !)
Découvrez le guide Réussir son entreprise sur Internet grâce à Joomla
Découvrez le le centre de formation NosyWeb

Vous devez vous connecter Connexion ou Créer un compte pour prendre part à la conversation.

Temps de génération de la page : 0.178 secondes
Contact

Scoop.It de NosyWeb

Twitter de NosyWeb

YouTube de NosyWeb

Facebook de NosyWeb

Google+ de NosyWeb

Flux RSS de NosyWeb

Inscription newsletter de NosyWeb

 

Restez à l'affut de l'actualité NosyWeb ! :-)

En poursuivant votre navigation sur le site, vous acceptez l'utilisation de cookies sur votre poste dans le respect de notre politique de protection de votre vie privée. Ok