Chez momo-fr

Personnaliser OwnCloud à vos couleurs

OwnCloud

OwnCloud est une excellente solution pour avoir son propre cloud, mais il est tentant de le mettre à ses propres couleurs, comment faire ?

CMS OwnCloudJ’ai travaillé, il y a déjà quelques temps, sur un thème personnalisé pour le CMS de Clouding OwnCloud. Une fois installé il n’est pas évident de comprendre où créer son thème et surtout de savoir quoi y mettre. En fait c’est plutôt simple, on trouve en racine de l’hébergement OwnCloud un dossier « themes » où placer le dossier du thème personnalisé.

Emplacement du thème personnalisé pour OwnCloud

owncloud_dossier_coreDans ce dossier personnalisé il suffit de créer les mêmes fichiers que l’on trouve dans le dossier « core » présent, lui aussi, en racine. On n’utilisera que les fichiers utiles : css, images, etc. La fonction d’application d’OwnCloud permet d’ajouter des fonctions particulières à la solution de Cloud, on devra, là aussi, dupliquer les dossiers des Apps dans le thème si l’on veut designer ces dernières. Il faut garder la même arborescence pour que tout ce qui est présent dans le nouveau thème soit répercuté sur le site.

L’activation du thème reste manuelle avec l’ajout d’une ligne dans le fichier config.php présente dans le dossier « config » en racine du site. Elle aura la syntaxe suivante :

‘theme’ => ‘nom du thème’, 

Activation du thème personnalisé dans OwnCloud

Une fois le design établi, il subsiste quelques petites touches à personnaliser :

  • Changer le favicon
  • Changer le titre dans la balise « title » du <head>

 Pour le favicon il faut ajouter dans le dossier « core » du nouveau thème (créer le dossier si il n’est pas présent) un sous-dossier « img » qui contiendra les favicons du thème :

  • favicon.png
  • favicon-touch.png

On trouve aussi des versions SVG pour les terminaux mobiles (non obligatoire).

Pour changer ou ajouter le nom de votre service avec votre thème pour OwnCloud on va dupliquer dans le dossier « core » d’origine 3 fichiers présents dans le sous-dossier « templates » :

  • layout.base.php
  • layout.guest.php
  • layout.user.php

Ces fichiers contiennent la structure des pages de connexion, de log en utilisateur ou invité. On retrouve la ligne concernant la balise « title » en tête du code source, attention chaque fichier contient une action en PHP pour appeler différentes informations à taguer dans le titre de la page, il y en a 2 sortes.
On retrouve, par contre, le même appel au nom de l’application CMS (OwnCloud) sous la syntaxe : 

<?php p($defaults->getName()); ?>

On transforme l’appel au nom du CMS par un « echo » PHP de ce style :

<?php echo ‘NOM DE MON SERVICE’; ?>

A changer dans les 3 fichiers, pour « layout.user.php » se sera :

<title>
<?php p(!empty($_[‘application’])?$_[‘application’].’ | ‘: »);
echo ‘NOM DE MON SERVICE’;
p(trim($_[‘user_displayname’]) !=  » ?’ (‘.$_[‘user_displayname’].’) ‘: ») ?>
</title>

Ces 3 fichiers modifiés sont bien entendu présents dans un sous-dossier « templates » du thème personnalisé.

Fichiers "templates" du thème personnalisé

Bonne création…

Vous aimerez aussi

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Plus de résultats...

Generic selectors
Corespondance exacte
Rechercher dans le titre
Rechercher dans le contenu
Post Type Selectors

Autres catégories du Blog

Partager cette publication