Attention

Tous les fichiers/dossiers installés dans le gestionnaire de médias doivent être
préalablement dézippés puis installés un par un...
Il semble que la possibilité de décompresser un fichier zip proposé par l'interface des blogs Free semble poser certains problèmes pouvant aller jusqu'à l'impossibilité d'accéder à la gestion des médias.
D'où un blog quasi inutilisable... ;(

Lire ce commentaire...


Dans un premier temps
je suis parti sur la piste: thème customisable [1]

Que l'on peut trouver dans le menu :

        > Tableau de bord 
                >> Apparence du blog 
                            >>> Custom theme

En dessous de l'image du thème, on peut lire :

  • Feuille de style
    • un clic pour lire [2] la feuille de style du thème
  • Configuration du thème
    • un clic pour entrer en mode d'édition de la feuille de style du thème customisable.

C'est cette dernière posibilité qui nous intéresse...

Dans un second temps (méthode à ne pas suivre !)
j'ai essayé d'ajouter les feuilles de style du style giacomo©
dans la feuille de style du thème customisable [3]

En gros....

  1. j'ai copié le contenu des fichiers custom.css et style.css du style giacomo©''
  2. Puis j'ai copié toutes les images du thème giacomo© dans un dossier nommé /images/ au seul endroit où je pouvais le faire : le gestionnaire de média

Là.... premières difficultés : modifier l'image à côté du titre

 body {
      margin: 0;
      padding: 0;
      font-family: "Lucida grande",Verdana,Lucida,
                     Helvetica,sans-serif;
      font-size: 84%;
      color: #111;
      background: #fff url(images/zen.jpg) no-repeat;
  }

Pour remplacer l'image
j'en ais chargé une autre dans le même dossier /images/
et modifié le css du style customisable.

     background: #fff url(images/monimage.jpg) no-repeat;

Bref, toute une série de bidouilles fastidieuses, inefficaces et sources d'erreurs...

Finalement je me suis aperçu que la feuille de style

du thème customisables 'custom.style.css'
est enregistrée dans ce même dossier --> gestionnaire de média
et que l'url de ce dossier là est /public/

Un peu de lecture complémentaire : la documentation Dotclear | à propos du gestionnaire de médias | ou, pour ce qui concerne le thème customisable m'a, petit à petit, amené à trouver

une autre méthode, plus efficace, plus propre et plus simple...

Puisque le gestionnaire des médias est le dossier /public/ et puisque c'est le seul dossier accessible : pourquoi ne pas l'utiliser ?

  o Créer un dossier /theme/ 
  o Y déposer (un par un...) les éléments du thème choisi 
  o et utiliser la feuille de style du thème customisable comme un 'aiguillage'...

Méthode que j'ai suivie


Préalables

  * Tous les zip doivent être préalablement décompressés.
  * Ne pas conserver de fichiers ou dossiers inutiles.
  * Tout se joue dans le dossier des médias /public/
  * Ne rien mettre en vrac dans ce dossier /public/
  * Bien organiser le tout en 'sous dossiers'.
  * Noter l'organisation (arborescence) préparée.
  * Les url se feront à partir de ce dossier /public/ 
    Exemple : Puisque le fichier de style custom 
     est placé dans le dossier des médias /public/ 
     les images contenues dans un dossier /images/
     seront référencées par un chemin de type :
                             url(images/monimage.jpg
  * Simplifier pour éviter les erreurs :
     o Donner des noms simples et courts
     o Penser que linux n'est pas windows     
        - les Majuscules ne sont pas des minuscules
        - pas de caractère bizaroide ou accentué 
        - pas d'espace devant ou derrière les noms
  * Pour faire simple je me suis limité aux caractères :
     a à z et 0 à 9

1. Dans le gestionnaire de médias

  • Commencer par créer un dossier nommé themes
  • Dans ce dossier themes créer un dossier portant le nom du thème choisi
    Exemple : giacomo
  • Dans giacomo transférer tout le contenu du thème choisi.
    Dossier par dossier, fichier par fichier.
    Afin d'éviter des erreurs, respecter /ne pas modifier/ le nom des dossiers et des fichiers du thème choisi
      Exemple pour giacomo
    Dossiers                |            Contenu
    /themes/giacomo/        | custom.css et style.css
    /themes/giacomo/images/ | images utiles au thème

2. Revenir au thème customisable

> Tableau de bord >> Choisir ce thème >>> Cliquer sur configuration du thème.

3. Installer le thème personnalisé

Pour que le thème personnalisé fonctionne, il faut importer sa feuille de style dans celle du thème customisable. Si vous avez procédé avec méthode et organisation, une simple ligne suffit...

import "public/nom-du-dossier-themes/nom-du-theme-choisi/style.css";

Exemple :  @import "/public/themes/giacomo/style.css";

4. Cliquer sur Enregistrer. Et c'est tout...

Vérifier sur le blog, le style du thème choisi devrait être utilisé.

Infos complémentaires


Préalables




:

Note : Pour lecture/vérification et transferts
    le fichier custom_style.css est dans le dossier des medias.
    En cas de problème sur le fichier css du custom thème la suppression de ce fichier (custom_style.css) dans le dossier des médias, réinitialisera le thème.
    Donc....
    - Conserver des sauvegardes en local.
    - On peut aussi Modifier tous les fichiers css en local (avec un éditeur de texte)
    Avant de les mettre en ligne.
    Une fois transformés : supprimer l'ancien fichier, charger le nouveau.
    Et, pour ceux qui en ont la possibilité, faire des essais préalables en local.
  N'Utiliser ce fichier custom_style.css (thème customisable) que pour paramétrer le aiguillages vers les feuilles de styles des thèmes choisis.
  Pour exemple, toutes les modifications que j'apporte au thème choisi Giacomo©
  sont effectuées dans une feuille de style personnalisée que j'ai chargée dans un dossier appelé /montheme/ dans le dossier /theme/
  Explication :
  Les dernières règles appliquées à un style sont prioritaires.
  Donc, pour modifier, par ex, une image de fond, dans le thème choisi Giacomo©
  la ligne correspondante doit se trouver après les lignes chargeant les fichiers du style du thème choisi. J'appelle donc, tout à la fin du fichier custom_style.css, et de la même façon que décrite précédemment ma propre feuille de style.
  Ce sans aucune correction aux feuilles de styles du thème Giacomo© ...
  A NOTER++:
  Cette modification n'est pas sans entrainer certains ennuis.
  Il me semble que, lors des heures de pointe, le thème ainsi customisé semle avoir des difficultés à s'afficher correctement. Peut-être un problème de cache ?
  Le thème Blowup est personnalisable. Couleur et police + l'image d'entête. Et semble plus réactif que la solution thème customisable. Pour ceux qui ne veulent pas se lancer dans le css et pour qui 2 colonnes suffisent.

Lire ce billet

Si vous utilisez Firefox le module web developer est très utile, y compris pour suivre les erreurs css ou d'url.

comme : ne pas poser en vrac des fichiers dans ce dossier

A NOTER

Seuls les liens cliquables dirigent vers des billets déjà publiés...
Pour l'instant envoyer vos remarques en commentaire. J'ai inscrit en todo une liste de trucs permettant la messagerie...


RETOURNER VERS...

le haut de cette page

Accueil-Bienvenue

Sommaire-Plan du site


Notes

[1] A CSS customizable theme par Olivier version 1.0

[2] Attention: Une fois la feuille de style modifiée, elle peut ne pas apparaitre lors d'un clic sur 'feuille de style'. Pas de panique. Je ne sais pas pourquoi mais une fois le thème modifié, les modifications sont tout de même prises en compte

[3] le fichier ouvert par un clic sur Configuration du thème