Injecter du CSS Drupal
Résolu
pbertout
Messages postés
992
Date d'inscription
Statut
Membre
Dernière intervention
-
pbertout Messages postés 992 Date d'inscription Statut Membre Dernière intervention -
pbertout Messages postés 992 Date d'inscription Statut Membre Dernière intervention -
A voir également:
- Injecter du CSS Drupal
- Css download - Télécharger - HTML
- Background color css ✓ - Forum CSS
- Enlever le soulignement d'un lien css ✓ - Forum Réseaux sociaux
- Css ligne horizontale ✓ - Forum CSS
- Enlever le soulignage des lien. - Forum CSS
1 réponse
Je commence tout juste sur Drupal mais apparemment c'est plutôt sur les thèmes qu'on joue avec le CSS et de préférence dans un sous-thème. (On ne doit pas modifier un thème officiel car ils sont mis à jour automatiquement et on perdrait ses modifs)
Donc le premier truc à faire serait de créer un sous-thème.
La façon de procéder dépends un peu des spécificités du thème de départ (certains comme celui de bootstrap proposent un répertoire à recopier) mais globalement la procédure généralement applicable est expliquée (en anglais) sur : https://www.drupal.org/node/225125
D'abord choisir arbitrairement un nom interne unique constitué de minuscule (et éventuellement de tirets bas). Exemple en partant de bartik : "mon_soustheme_bartik"
- créer un sous-répertoire reprenant exactement ce nom interne dans
Ensuite créer un fichier .info dans ce répertoire, qui aura le même nom que le nom interne, donc :
Il contiendra :
(Ne pas écrire dans le .info ce que j'ai mis entre parenthèses !!! On sait jamais ...)
Le sous-thème hérite ensuite de "presque" toutes les propriétés du thème de base et dés la fin de l'édition du .info on peut le choisir dans le menu d'administration "apparence/thème/"
Il est possible d'overrider (surcharger ou redéfinir) dans le .info certaines propriétés du thème de base.
Certaines, (très peu) devront être obligatoirement redéfinies comme le logo.png qui pourra être recopié à partir du répertoire du thème de base, les régions (qui apparaissent dans blocs), quelques préférences avancées de thème et le module color (avec ses css).
Ensuite il faut créer un fichier template.php dans le répertoire du sous thème et le modifier :
Le chemin est relatif depuis la racine ... Après j'utilise les options par défaut, on peut utiliser un css sur un autre serveur, etc ...
Moi, c'est là que je mets mon css ...
Et à l'arrivé dans le source des pages j'ai :
Si besoin la page du site officiel pour le CSS : https://www.drupal.org/node/171209
(Ou ils disent qu'on peut aussi le faire dans le .info mais chez moi ça marche pas, même après refresh du cache)
Maintenant ça fait 1 semaine que je fais du drupal alors ce que j'en dis ...
Tout ça dépends également de la version de Drupal. (6, 7 ou 8 / Je suis sur 7). Si je dis des co**ries n'hésitez pas à me le dire.
Et ta lightbox elle marche qu'avec du css, pas de javascript ?
Avec du JS en plus le template.php du sous-thème devient :
Bibliographie :
Creating a sub-theme
Working with JS
Adding style sheets
function drupal_add_js
function drupal_add_css
function template_preprocess_html
You may stop me but you can't stop us all ;-)
Donc le premier truc à faire serait de créer un sous-thème.
La façon de procéder dépends un peu des spécificités du thème de départ (certains comme celui de bootstrap proposent un répertoire à recopier) mais globalement la procédure généralement applicable est expliquée (en anglais) sur : https://www.drupal.org/node/225125
D'abord choisir arbitrairement un nom interne unique constitué de minuscule (et éventuellement de tirets bas). Exemple en partant de bartik : "mon_soustheme_bartik"
- créer un sous-répertoire reprenant exactement ce nom interne dans
sites/all/themes/mon_soustheme_bartik(ou dans
sites/www.exemple.com/themes/mon_soustheme_bartiksi on gère plusieurs site)
Ensuite créer un fichier .info dans ce répertoire, qui aura le même nom que le nom interne, donc :
sites/all/themes/mon_soustheme_bartik/mon_soustheme_bartik.info
Il contiendra :
name = Mon sous-thème à moi que j'ai fait(info libre)
description = Un sous-thème du thème Bartik (info libre)
core = 7.x (dépends de la version de drupal)
base theme = bartik (Info la plus importante !!! obligatoirement le nom interne du thème de base)
(Ne pas écrire dans le .info ce que j'ai mis entre parenthèses !!! On sait jamais ...)
Le sous-thème hérite ensuite de "presque" toutes les propriétés du thème de base et dés la fin de l'édition du .info on peut le choisir dans le menu d'administration "apparence/thème/"
Il est possible d'overrider (surcharger ou redéfinir) dans le .info certaines propriétés du thème de base.
Certaines, (très peu) devront être obligatoirement redéfinies comme le logo.png qui pourra être recopié à partir du répertoire du thème de base, les régions (qui apparaissent dans blocs), quelques préférences avancées de thème et le module color (avec ses css).
Ensuite il faut créer un fichier template.php dans le répertoire du sous thème et le modifier :
<?php
function <bold>mon_soustheme_bartik</bold>_preprocess_html(&$variables) {
drupal_add_css('sites/all/themes/mon_soustheme_bartik/ton_css.css');
}
Le chemin est relatif depuis la racine ... Après j'utilise les options par défaut, on peut utiliser un css sur un autre serveur, etc ...
Moi, c'est là que je mets mon css ...
Et à l'arrivé dans le source des pages j'ai :
@import url("[http://mon.serveur/drupal/sites/all/themes/mon_soustheme_bartik/ton_css.css]");
Si besoin la page du site officiel pour le CSS : https://www.drupal.org/node/171209
(Ou ils disent qu'on peut aussi le faire dans le .info mais chez moi ça marche pas, même après refresh du cache)
Maintenant ça fait 1 semaine que je fais du drupal alors ce que j'en dis ...
Tout ça dépends également de la version de Drupal. (6, 7 ou 8 / Je suis sur 7). Si je dis des co**ries n'hésitez pas à me le dire.
Et ta lightbox elle marche qu'avec du css, pas de javascript ?
Avec du JS en plus le template.php du sous-thème devient :
<?php
mon_soustheme_bartik_preprocess_html(&$variables) {
drupal_add_js('https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?autoload=true&skin=sons-of-obsidian', 'external');
drupal_add_css('sites/all/themes/mon_soustheme_bartik/ton_css.css');
}
Bibliographie :
Creating a sub-theme
Working with JS
Adding style sheets
function drupal_add_js
function drupal_add_css
function template_preprocess_html
You may stop me but you can't stop us all ;-)
<?php function mon_soustheme_bartik_preprocess_html(&$variables) {Il y a du y avoir un problème de copié/collé ... Et le nom de la fonction dépends évidement du nom interne du (sous-)thème ....
Ha oui et après vérification, j'ai également du javascript.
De plus je suis aussi sur la version 7.
Merci beaucoup !
A++
Bonne journée !
A++
Je viens de me poser une question, voila, par exemple certain utilisateurs peuvent choisir deux thèmes différents, pour la lightbox, je vais créer dans mes deux thèmes le dossier, ou il suffit de faire le sous-thème dans seulement le thème principal (à savoir corporate pour ma part)?
Merci par avance !
Bonne soirée !