========================= CMS Made Simple 1.x HOWTO (c) Nicolas Kovacs ========================= Dernière révision : 8 mars 2016 Ce HOWTO décrit l'installation et la configuration de CMS Made Simple 1.x sur un serveur LAMP Slackware. * Introduction * Prérequis * Installation * Sauvegarder les gabarits par défaut * Rendre le site plus lisible * Menus détails typographiques * Supprimer les éléments inutiles * Personnaliser l'image de fond * Personnaliser le logo * Franciser l'interface de recherche * Simplifier la colonne des News Introduction ------------ CMS Made Simple, un CMS open source, permet la gestion rapide et facile des contenus d'un site web. Ce CMS est adapté aussi bien pour les petites sociétés que pour les grandes entreprises. Prérequis --------- CMS Made Simple nécessite un serveur LAMP avec PHP 5.3.2 ou supérieur. Il faudra songer à ajuster une série de paramètres PHP. Faire une sauvegarde du fichier de configuration initial : # cd /etc/httpd # cp php.ini php.ini.orig Ajuster la configuration de PHP en éditant '/etc/httpd/php.ini'. --8<---------- /etc/httpd/php.ini' ------------------------------------------- ; Maximum execution time of each script, in seconds ; http://php.net/max-execution-time ; Note: This directive is hardcoded to 0 for the CLI SAPI max_execution_time = 60 --> ligne 384 ... ; Maximum size of POST data that PHP will accept. ; Its value may be 0 to disable the limit. It is ignored if POST data reading ; is disabled through enable_post_data_reading. ; http://php.net/post-max-size post_max_size = 10M --> ligne 672 ... ; Maximum allowed size for uploaded files. ; http://php.net/upload-max-filesize upload_max_filesize = 10M --> ligne 800 ... --8<-------------------------------------------------------------------------- Installation ------------ Créer un emplacement pour ranger les archives compressées : # cd # mkdir cmsmadesimple # cd cmsmadesimple Aller sur le site du projet : # links http://www.cmsmadesimple.org Suivre le lien 'Downloads' > 'file release system'. Télécharger l'archive de la dernière version 1.x : * cmsmadesimple-1.12.1-full.tar.gz Décompresser l'archive à l'endroit approprié : # cd /var/www/vhosts # mkdir -pv cmsmadesimple/htdocs mkdir: création du répertoire « cmsmadesimple » mkdir: création du répertoire « cmsmadesimple/htdocs » # cd cmsmadesimple/htdocs # tar xvzf /root/cmsmadesimple/cmsmadesimple-1.12.1-full.tar.gz Résultat : # ls -l total 76 drwxr-xr-x 5 root root 4096 août 31 2015 admin drwxr-xr-x 2 root root 4096 août 31 2015 doc -rw-r--r-- 1 root root 1150 sept. 30 2010 favicon_cms.ico -rw-r--r-- 1 root root 330 juil. 12 2006 fileloc.php -rw-r--r-- 1 root root 9408 mars 29 2015 include.php -rw-r--r-- 1 root root 13581 juil. 12 2015 index.php drwxr-xr-x 8 root root 4096 août 31 2015 install drwxr-xr-x 11 root root 4096 août 31 2015 lib -rw-r--r-- 1 root root 955 sept. 15 2011 moduleinterface.php drwxr-xr-x 11 root root 4096 août 31 2015 modules drwxr-xr-x 2 root root 4096 août 31 2015 plugins drwxr-xr-x 5 root root 4096 août 31 2015 tmp drwxr-xr-x 6 root root 4096 août 31 2015 uploads -rw-r--r-- 1 root root 1131 août 31 2015 version.php Régler les permissions : # cd /var/www/vhosts # find cmsmadesimple/ -type d | xargs chmod 0750 # find cmsmadesimple/ -type f | xargs chmod 0640 # chown -R apache:apache cmsmadesimple/ Créer la base de données : # mysql -u root -p mysql> create database cmsmadesimple; Query OK, 1 row affected (0.00 sec) mysql> grant all on cmsms.* to cmsuser@localhost -> identified by '********'; Query OK, 0 rows affected (0.00 sec) mysql> exit Bye Ajouter un hôte virtuel dans la configuration d'Apache. Le nouvel hôte devra avoir une entrée correspondante dans la configuration de BIND (serveur dédié) ou Dnsmasq (réseau local). Lancer l'installation avec Firefox, en l'ouvrant à l'adresse configurée. Langue de l'installation : fr_FR. Étape n° 1 - Test de contrôle (checksum) Passer. Étape n° 2 - Configuration de PHP. Vérifier la configuration correcte de tous les paramètres. Étape n° 3 - Test de masque de création de fichier Les valeurs par défaut sont OK. Étape n° 4 - Informations sur le compte administrateur Nom d'utilisateur : 'kikinovak' ou autre Adresse email : adresse mail de l'admin Mot de passe Admin sécurisés : [X] Mot de passe : ******** Email pour le compte administrateur : selon configuration Étape n° 5 - Nom du site, fuseau horaire et informations sur la base de données Nom du site : CMS local Fuseau horaire : Europe/Paris. Type de base de données : MySQLi (4.1+) Adresse du serveur de BD : localhost Nom de la base de données : cmsms Nom d'utilisateur : cmsmsuser Mot de passe : ******* Port de base de données : laisser vide Préfixe des tables : cms_ Création des tables : [X] Installer les exemples de contenus : [ ] Étape n° 6 - Installation du système Racine du CMS : vérifier la valeur par défaut. Chemin de la racine du CMS : idem Symbole après "index.php" : page Langue par défaut pour l'interface : fr_FR Afficher le site dans un navigateur. Si tout a l'air OK, on peut protéger le fichier de configuration 'config.php' et supprimer le répertoire 'install/' : # chmod 0444 config.php # rm -rf install/ Afficher l'interface d'administration du site : * http:///admin/ Afficher la liste de toutes les pages préinstallées : Contenu > Pages. Sélectionner toutes les pages sauf la page d'accueil (Home), puis : Objects sélectionnés > Supprimer. Sauvegarder les gabarits par défaut ----------------------------------- Disposition > Gabarits > NCleanBlue : cliquer dessus pour afficher le gabarit. Copier l'intégralité de son contenu vers le presse-papier. Créer un nouveau gabarit 'NCleanBlueOrig' vers lequel on collera le contenu du presse-papier. Procéder de même pour le gabarit des News : Contenu > Articles > Gabarit du sommaire article Sauvegarder le gabarit par défaut 'Sample' vers une copie 'SampleOrig'. De même pour les feuilles de style 'NCleanBlue' et 'ncleanblueutils' : Disposition > Feuilles de style > Layout: NCleanBlue/ncleanblueutils Rendre le site plus lisible --------------------------- La police de caractères définie par défaut n'est pas très grande. Pour l'agrandir un peu, éditer la feuille de style : Disposition > Feuilles de style > Layout: NCleanBlue Repérer la définition de la police de caractères : body { /* default text for entire site */ font: normal 0.8em Tahoma, Verdana, Arial, Helvetica, sans-serif; ... } Remplacer par ceci, par exemple : body { /* default text for entire site */ font: normal 1.0em Arial, Helvetica, sans-serif; ... } En augmentant la taille de la police, on décale également les boutons de navigation du menu principal vers le bas. On peut les relever à la bonne hauteur en jouant sur le paramètre 'height' de la classe 'logo' : logo a { /* adjust according your image size */ height: 75px; --> réduire à 69px width: 215px; } Pour augmenter l'espacement entre les lignes, ajouter le paramètre 'line-height' dans le corps de la feuille de style : body { /* default text for entire site */ font: normal 1.0em Arial, Helvetica, sans-serif; color: #3A3A36; line-height: 1.3em; --> définit l'espacement entre les lignes ... } Il faudra également définir l'espacement pour les listes à puces : /* espacement des listes à puces */ div#main ul li, div#main ol li { list-style: square; line-height: 1.3em; } /!\ On pourra rajouter ce bloc en-dessous des définitions de listes à puces div#main ul, div#main ol, etc. Même si certaines définitions semblent en contradiction, c'est toujours la dernière qui l'emporte. Menus détails typographiques ---------------------------- Pour restituer les apostrophes, il faut éditer la feuille de style 'ncleanblueutils' et supprimer toutes les occurrences concernant la balise : blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } Quant au soulignement en pointillés pour les abbréviations, on peut les restituer en supprimant l'élément de la liste au début de la même feuille de style : html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, --> supprimer 'abbr' del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } Supprimer les éléments inutiles ------------------------------- Pour se débarrasser de certains éléments superflus, il faut éditer le gabarit 'NCleanBlue'. Supprimer le fil d'Ariane : {* Start Breadcrumbs *} ... {* End Breadcrumbs *} Supprimer l'étoile orange avec le numéro de version du CMS : {* Start Optional tag *} ... {* End Optional tag *} Garder la barre de navigation inférieure vide en supprimant les liens vers le haut de page et les autres pages : {* Start main bottom and relational links *}
{* End relational links *}
{* End main bottom *}

 

Supprimer le plan du site en pied de page. Il faudra remplacer le contenu des menus par un paragraphe vide, sous peine de décaler le pied de page : {* first foot menu *}

 

{* second foot menu if active page has children *}

 

Éventuellement, supprimer le bouton d'impression. Ne pas enlever tout le bloc, mais laisser le container vide, sous peine de perdre l'arrondi en haut du bloc principal supérieur : {* main top, holds top image and print image *}
Pour supprimer tout le pied de page, il suffit d'enlever tout le contenu compris entre '{* Start Footer *}' et '{* End Footer *}'. Personnaliser l'image de fond ----------------------------- Préparer une image de 110 pixels de haut, et la charger dans le gestionnaire d'images. Dans la feuille de style, indiquer le chemin vers l'image ainsi que la couleur du fond, comme ceci : /* you can set your own image and background color here */ background: #E8E8E8 url([[root_url]]/uploads/images/fond-perso.jpg) repeat-x; /!\ Si l'on utilise un fond uni, il faut éventuellement ajuster la barre de navigation en diminuant la hauteur de la classe 'logo' d'un pixel, de 69 à 68 pixels. /!\ Dès le moment qu'on remplace le fond bleu original par une autre image, il faut également remplacer 'search.png' et 'tabs.gif' dans le répertoire 'uploads/NCleanBlue' par une version modifiée qui respecte la transparence des bords. Personnaliser le logo --------------------- La configuration par défaut contient un fichier 'logo.png' d'une taille de 215x75 pixels, dans le répertoire 'uploads/NCleanBlue'. Renommer ce fichier en 'logo.png.orig' pour le remplacer par un logo personnalisé. On peut également confectionner un logo pour la colonne des News. Appeler ce logo 'logo-lateral.png', par exemple. Éditer le gabarit NCleanBlue et repérer l'affichage du logo par défaut dans la section News. Indiquer le chemin vers le nouveau logo. Franciser l'interface de recherche ---------------------------------- Ouvrir le gabarit de recherche : Extensions > Recherche > Gabarit de recherche Repérer la ligne qui contient ceci : value="{$searchtext}" Remplacer par : value="Rechercher..." Simplifier la colonne des News ------------------------------ L'affichage des News est géré par le gabarit du sommaire article, que l'on trouve ici : Contenu > Articles > Gabarit du sommaire article Cliquer sur le gabarit 'Sample' par défaut, copier l'intégralité de son contenu, créer un nouveau gabarit 'SampleOrig' et coller le contenu du presse-papier. Ensuite, éditer le gabarit 'Sample'. Supprimer la liste cliquable des catégories : {* This section shows a clickable list of your News categories. *}
    ...
... {* if you don't want category browsing on your summary page, remove this line and everything above it *} Supprimer la date : {if $entry->postdate}
{$entry->postdate|cms_date_format}
{/if} Le titre de chaque News est un lien cliquable : Supprimer le lien ... tout en gardant le titre, qu'on affichera en gras : Supprimer l'affichage de la catégorie de l'article :
{$category_label} {$entry->category}
De même pour l'auteur de l'article : {if $entry->author}
{$author_label} {$entry->author}
{/if} L'interface d'édition des articles propose deux champs : * Sommaire * Contenu Pour un affichage correct des News, il faut laisser vide le champ 'Sommaire' et éditer uniquement le champ 'Contenu'. ------------------------------------------------------------------------------ # vim: syntax=txt