Silverstripe
Silverstripe est le CMS (Content Management System) utilisé par AideDD pour publier du contenu en ligne. Moins connu que les deux poids lourds Joomla (que j'ai essayé comme première option de CMS et qui ne m'a pas convaincu) et Dupral - je laisse Wordpress de côté car il me semble encore et toujours plus axé blog qu'autre chose - il faisait néanmoins partie des CMS en vogue en 2013, lorsque le site a été relancé. Techniquement, l'outil est développé en Php orienté objet par une équipe néo-zélandaise.
La communauté française de Silverstripe ne semble cependant pas encore très active, c'est pourquoi je vais partager ici les petites modifications et personnalisations que j'ai apporté au programme de base (version 5). En espérant que ça puisse aider certaines personnes qui débuteraient avec ce CMS.
Installation
Avant toute chose, j'ai essayé plusieurs fois d'installer SS4 avec Softaculous sur CPanel, sans succès. Avec FTP ça n'a pas non plus marché. La seule manière d'installer correctement Silverstripe semble donc être celle recommandée sur leur site, via composer.
composer create-project silverstripe/installer SS4
Ensuite, éditez .env pour renseigner le nom de votre base, le user et le password de la base, ainsi que l'email de login et le password.
SS_DATABASE_CLASS="MySQLDatabase" SS_DATABASE_NAME="" SS_DATABASE_SERVER="localhost" SS_DATABASE_USERNAME="" SS_DATABASE_PASSWORD="" SS_DEFAULT_ADMIN_USERNAME="" SS_DEFAULT_ADMIN_PASSWORD="" SS_ENVIRONMENT_TYPE=""
Et dans SS4 :
vendor/bin/sake dev/build
Puis déplacer tous les fichiers du répertoire SS4 à la racine du site.
.htaccess
Les redirections doivent être placées dans le .htaccess à la racine du site, avant la redirection de Silverstripe. Par exemple :
Redirect 301 "/intro" "https://www.aidedd.org/dnd-5" RewriteEngine On # Redirect non www to www RewriteCond %{HTTP_HOST} ^aidedd\.org$ [NC] RewriteRule ^(.*)$ https://www.aidedd.org/$1 [R=301,L] # Redirect non https to https RewriteCond %{HTTPS} off RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L] RewriteRule ^(.*)$ public/$1
Arborescence
J'ai opté pour l'arborescence suggérée dans les leçons de Silverstripe.
app -- src -- templates public -- assets -- css -- images -- javascript -- webfonts silverstripe-cache vendor
Puis modifier app/_config/theme.yml en conséquences.
---- Name: mytheme --- SilverStripe\View\SSViewer: themes: - '$public' - '$default'
Langue
Pensez à modifier la langue de votre site pour la balise html lang. Dans app/_config.php ajouter :
use SilverStripe\i18n\i18n; i18n::set_locale('fr_FR');
Titre des pages
Silverstripe ajoute le nom du site au titre html de chaque page, mais cela ne me semble pas très judicieux au niveau SEO. Dans mon cas, le site s’appelle "AideDD" mais je préfère ajouter "D&D 5" que le nom du site après le nom de la page. Modifiez le template "templates/Page.ss" comme suit.
Nouveaux types de pages
Créer un nouveau type de page est expliqué clairement dans les tutoriels, mais il est moins facile de trouver l'info sur comment ajouter le texte de description des nouveaux types de page et changer l'icône. Si vous avez par exemple un template homepage.ss, il suffit de modifier la classe comme suit dans "app/src/homepage.php". La liste des icônes est disponible ici.
class homepage extends Page { private static $icon_home = 'font-icon-p-home'; private static $description = "Texte de description du type de page"; }
Modifier les Breadcrumbs
Pour modifier les breadcrumbs afin que Google les reconnaisse, éditez le fichier "vendor/silverstripe/ cms/templates/ BreadcrumbsTemplate.ss" comme indiqué si vous souhaitez utiliser les balises ‹ol> et ‹li> par exemple.
Puis modifier le fichier "public/css/layout.css" pour y ajouter quelque chose du style :
#Breadcrumbs ol {list-style-type: none;}
#Breadcrumbs ol li {display: inline; color: #999;}
#Breadcrumbs ol li+li:before {content: "\203A"}
Customiser la barre d'édition
Dans app/_config.php vous pouvez facilement ajouter ou retirer des boutons. Exemple :
use SilverStripe\Forms\HTMLEditor\HTMLEditorConfig;
HtmlEditorConfig::get('cms')->enablePlugins('hr');
HtmlEditorConfig::get('cms')->enablePlugins('charmap');
HtmlEditorConfig::get('cms')->insertButtonsAfter('underline', 'strikethrough');
HtmlEditorConfig::get('cms')->insertButtonsAfter('indent', 'hr');
HtmlEditorConfig::get('cms')->insertButtonsAfter('hr', 'charmap');
HtmlEditorConfig::get('cms')->removeButtons('ssembed');
Ensuite, pour ajouter de vos propres styles, toujours dans app/_config.php :
$style_formats = [
['title' => 'Nom du style 1', 'selector' => 'div, p', 'classes' => 'style1' ],
['title' => 'Nom du style 2', 'selector' => 'div, p', 'classes' => 'style2' ]
];
HtmlEditorConfig::get('cms')->addButtonsToLine(2, 'styleselect');
HtmlEditorConfig::get('cms')->setOptions([ 'importcss_append' => true, 'importcss_selector_filter' => 'fake', 'style_formats' => $style_formats]);
Style des images
Pour modifier les alignements par défaut des images.
Dans "vendor/silverstripe/asset-admin/ code/Forms/ ImageFormFactory.php", modifier :
$alignments = [
'leftlite' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentLeftAlone', 'Left'),
'left' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentLeft', 'Left'),
'centerlite' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentCenterAlone', 'Center'),
'center' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentCenter', 'Center'),
'rightlite' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentRightAlone', 'Right'),
'right' => _t('SilverStripe\\AssetAdmin\\Controller\\AssetAdmin.AlignmentRight', 'Right'),
];
Dans "vendor/silverstripe/asset-admin/ lang/fr.yml", modifier :
AlignmentLeft: 'Gauche +cadre'
AlignmentLeftAlone: 'Gauche'
AlignmentCenter: 'Centré +cadre'
AlignmentCenterAlone: 'Centré'
AlignmentRight: 'Droite +cadre'
AlignmentRightAlone: 'Droite'
Dans "vendor/silverstripe/asset-admin/ client/dist/ styles/bundle.css", modifier :
.insert-embed-modal__placement .form-check .option-val--leftlite+span:before{background-position-y:-252px}
.insert-embed-modal__placement .form-check .option-val--leftlite.checked+span:before{background-position-y:-216px}
.insert-embed-modal__placement .form-check .option-val--left+span:before{background-position-y:-252px}
.insert-embed-modal__placement .form-check .option-val--left.checked+span:before{background-position-y:-216px}
.insert-embed-modal__placement .form-check .option-val--centerlite+span:before{background-position-y:-108px}
.insert-embed-modal__placement .form-check .option-val--centerlite.checked+span:before{background-position-y:-72px}
.insert-embed-modal__placement .form-check .option-val--center+span:before{background-position-y:-108px}
.insert-embed-modal__placement .form-check .option-val--center.checked+span:before{background-position-y:-72px}
.insert-embed-modal__placement .form-check .option-val--rightlite+span:before{background-position-y:-324px}
.insert-embed-modal__placement .form-check .option-val--rightlite.checked+span:before{background-position-y:-288px}
.insert-embed-modal__placement .form-check .option-val--right+span:before{background-position-y:-324px}
.insert-embed-modal__placement .form-check .option-val--right.checked+span:before{background-position-y:-288px}
Codes HTML
Par défaut plusieurs écritures HTML sont bloquées par Silverstripe. Pour permettre de nouveaux codes HTML, ajoutez les lignes suivantes à la fin de votre fichier "app/_config.php".
HtmlEditorConfig::get('cms')->setOption(
'extended_valid_elements',
'ol[start|type],i[class|title]'
);
Menu admin
Pour ajouter un nouveau menu dans le panneau Settings de l'admin, modifiez les lignes suivantes dans le fichier "vendor/silverstripe/ siteconfig/templates/ Silverstripe/SiteConfig/Includes/ SiteConfigLeftAndMain_EditForm.ss".
Email admin
L'équipe de Silverstripe m'a répondu que c'était normal, mais l'email de l'admin, nécessaire dans le cas d'un password recovery par exemple, doit être mis manuellement. Pour cela éditer le fichier "app/_config/mysite. yml" et ajouter à la fin :
SilverStripe\Control\Email\Email:
admin_email: 'webmaster@monsite.com'
Trailing Slash (SS 5)
Le CMS ne gérant plus par défaut le / à la fin des URL, si on les veut il faut le spécifier.
SilverStripe\Control\Controller:
add_trailing_slash: true
Fichiers téléchargeables
Pour permettre de télécharger des extensions non prévues, éditer le fichier "app/_config/mysite. yml" et ajouter à la fin :
SilverStripe\Assets\File:
allowed_extensions:
- xml
W3C check
La validation des pages par le W3C donne deux warning sur ‹script type="application/javascript">. Pour s'en défaire, dans "vendor/silverstripe/ framework/src/View/ Requierements_Backend.php" commenter l'ajout du type :
$htmlAttributes = [
// 'type' => isset($attributes['type']) ? $attributes['type'] : "application/javascript",
'src' => $this->pathForFile($file),
Zoom
La modification suivante permet d'effectuer un zoom sur la page d'admin depuis un smartphone.
Dans "vendor/silverstripe/ admin/templates/Silverstripe/ Admin/LeftandMain.ss", remplacer :
meta name="viewport" content="width=device-width, maximum-scale=1.0"
Par
meta name="viewport" content="width=device-width"
Purge des versions de page
Par défaut, Silverstripe garde une trace de toutes les versions des pages, publiées et brouillons. En quelques jours, on peut donc avoir des dizaines de versions d'une seule page en base de données, ce qui augmente la taille de la BDD de manière significative. Il existe heureusement un module, Truncator, qui permet de nettoyer automatiquement l'historique d'une page à chaque sauvegarde de celle-ci.
composer require axllent/silverstripe-version-truncator
On paramètre juste le nombre de versions publiées et le nombre de versions brouillons qu'on souhaite garder par page dans "vendor/axllent/silverstripe-version-truncator/_config/extension.yml".
Upgrade
Indiquer dans le fichier composer.json la version à laquelle on souhaite upgrader, par exemple :
"silverstripe/recipe-cms": "~4.11.0@stable",
Puis utiliser la ligne de commande suivante :
composer update
En local, si la version de php détectée par Composer n'est pas la même que celle utilisée par wampserver, entrer :
composer config platform.php 7.4.21