Vue d'ensemble
Le système de thèmes de Larapen vous permet de changer complètement l'apparence de votre site web en installant différents thèmes. Chaque thème fournit ses propres mises en page, styles et philosophie de design tout en utilisant le même contenu et les mêmes données.
Thèmes disponibles
Larapen propose plusieurs thèmes, chacun avec une identité visuelle distincte :
| Thème | Description | Disponibilité |
|---|---|---|
| Default | Propre, moderne, professionnel avec une mise en page large et un espacement équilibré. | Inclus avec l'application principale |
| Creative | Audacieux, créatif, mises en page asymétriques pour freelances et agences. | Vendu séparément |
| Elegant | Élégant, style éditorial avec typographie raffinée et grille inspirée des magazines. | Vendu séparément |
| Minimalist | Design épuré et minimaliste avec un espacement généreux, axé sur le contenu et la simplicité. | Vendu séparément |
| Olive | Thème inspiré de la nature, tons chauds avec des formes organiques et des couleurs terreuses. | Vendu séparément |
| Technology | Mode sombre par défaut, orienté tech pour développeurs et startups. | Vendu séparément |
Méthodes d'installation
Méthode 1 : Via le panneau d'administration (recommandé)
- Connectez-vous à votre panneau d'administration sur
https://votresite.com/admin. - Allez dans Apparence → Thèmes.
- Cliquez sur « Téléverser un thème ».
- Sélectionnez le fichier ZIP du thème et cliquez sur Téléverser.
- Le système extraira le thème dans
extensions/themes/{nom-theme}/et l'enregistrera. - Le nouveau thème apparaîtra dans la liste des thèmes.
Méthode 2 : Via FTP/Gestionnaire de fichiers (manuel)
- Téléchargez le package du thème (fichier ZIP).
- Extrayez le fichier ZIP sur votre ordinateur local.
- Téléversez le dossier du thème extrait dans
extensions/themes/sur votre serveur. Par exemple :extensions/themes/creative/extensions/themes/elegant/extensions/themes/minimalist/extensions/themes/olive/extensions/themes/technology/
- Connectez-vous au panneau d'administration.
- Allez dans Apparence → Thèmes.
- Cliquez sur « Synchroniser » pour détecter le thème nouvellement téléversé.
Méthode 3 : Via SSH (ligne de commande)
# Extraire le thème dans le répertoire des extensions
unzip creative-theme.zip -d extensions/themes/creative/
# Publier les assets du thème (liens symboliques vers public/themes/)
php artisan theme:publish creative
# Compiler les assets du thème (compiler SCSS/JS)
npx vite build
Structure du répertoire d'un thème
Chaque thème suit une structure standardisée dans extensions/themes/{nom-theme}/ :
extensions/themes/creative/
├── theme.json ← Manifeste (nom, version, couleurs, paramètres)
├── assets/
│ ├── css/ ← CSS compilé
│ ├── js/ ← Fichiers JavaScript
│ ├── scss/ ← Fichiers source SCSS
│ └── images/ ← Images et icônes du thème
├── views/
│ ├── layouts/
│ │ └── master.blade.php ← Template de mise en page principal
│ ├── pages/ ← Templates de pages
│ ├── partials/ ← Composants réutilisables (en-tête, pied, nav)
│ └── components/ ← Composants Blade
└── config.php ← Paramètres par défaut spécifiques au thème
Activer un thème
- Allez dans Apparence → Thèmes dans le panneau d'administration.
- Vous verrez tous les thèmes installés avec des miniatures d'aperçu.
- Cliquez sur « Activer » sur le thème que vous souhaitez utiliser.
- Le changement de thème prend effet immédiatement; visitez votre site web pour le voir.
Après l'installation
Compiler les assets du thème
Après avoir installé un nouveau thème, vous devrez peut-être compiler ses assets CSS/JS :
- Allez dans Apparence → Thèmes.
- Cliquez sur « Compiler » à côté du nouveau thème.
- Attendez que la compilation se termine.
Ou via SSH :
npx vite build
Configurer les paramètres du thème
- Allez dans Apparence → Paramètres du thème.
- Personnalisez les couleurs, polices, options de mise en page et autres paramètres spécifiques au thème.
- Cliquez sur Enregistrer. Les modifications prennent effet immédiatement.
Compatibilité thème + add-on
Les thèmes peuvent fournir des vues personnalisées pour les add-ons installés. Par exemple, le thème Creative pourrait styliser les articles de blog différemment du thème Default. Si un thème ne fournit pas de vues pour un add-on spécifique, les vues par défaut intégrées de l'add-on sont utilisées automatiquement.
Gestion des thèmes
Prévisualiser un thème
Avant d'activer un thème, vous pouvez le prévisualiser :
- Allez dans Apparence → Thèmes.
- Cliquez sur « Aperçu » sur n'importe quel thème installé.
- Un aperçu en direct s'ouvre dans un nouvel onglet, montrant votre contenu réel avec le design du nouveau thème.
Supprimer un thème
- Assurez-vous que le thème que vous souhaitez supprimer n'est pas le thème actif. Basculez d'abord vers un autre thème.
- Allez dans Apparence → Thèmes.
- Cliquez sur « Supprimer » à côté du thème inactif.
- Confirmez la suppression. Cela supprime les fichiers du thème de
extensions/themes/.
Dépannage
Le thème n'apparaît pas après le téléversement
- Vérifiez la structure des dossiers :
extensions/themes/{nom}/theme.jsondoit exister. - Cliquez sur « Synchroniser » sur la page des Thèmes pour re-scanner.
- Vérifiez que le fichier
theme.jsonest un JSON valide.
Styles manquants ou mise en page cassée
- Compilez les assets du thème : Apparence → Thèmes → Compiler.
- Videz le cache du navigateur avec un rafraîchissement forcé (
Ctrl+Maj+R/Cmd+Maj+R). - Videz le cache de l'application : Paramètres → Cache → Tout vider.
Images du thème ne se chargent pas
- Exécutez la commande de publication des assets du thème pour créer les liens symboliques corrects : via SSH :
php artisan theme:publish {nom-theme} - Vérifiez que le lien symbolique
public/themes/{nom-theme}/existe et pointe vers le bon répertoire.