Théories fumeuses, affirmations gratuites, croyances sans fondement :
arrêtez de croire et de faire n’importe quoi en SEO !

 Blog WordPress

Astra Pro, un thème d'excellence

Beau et riche

Beau, rapide, riche en fonctionnalités mais facile à utiliser, le thème WordPress Astra Pro compte parmi les meilleurs du marché, raison pour laquelle je l’utilise sur tous mes sites.

180 modèles de site

Fourni avec une galerie de plus de 180 templates, il permet de réaliser rapidement un site professionnel ou thématique – blog, magazine, site-vitrine, boutique e-commerce…

Licence Pro

La licence est vendue 49$ à l’année ou 239$ à vie.
Mises en page personnalisees Astra Pro

Les mises en page personnalisées d’Astra Pro (Site Builder)

4.1
(11)

Le module Mises en page personnalisées / Site builder (anciennement nommé Custom Layouts) du thème Astra Pro ajoute la possibilité de créer des maquettes pour les différents types de page, ou d’ajouter des blocs de contenu n’importe où sur un site en suivant des règles de placement, grâce aux « hooks« .

Comment activer les mises en page personnalisées

Vous devez d’abord avoir installé le thème Astra et son plugin Astra Pro.

Ensuite, quand on active le module Mises en page personnalisées sur la page Apparence > Options d’Astra, cela fait apparaître une page Apparence > Astra > Site builder.

On peut alors créer ou éditer des mises en page (= des maquettes) pour ces éléments :

  • l’en-tête
  • le pied-de-page
  • la page 404
  • le contenu d’une page
  • des « hooks« , des éléments intégrables n’importe où dans l’interface

Comment créer une mise en page personnalisée avec Site builder

Rendez-vous donc sur la page Apparence > Astra > Site builder, puis cliquez sur le bouton « Add new ».

Ensuite, choisissez un des 5 types de maquette ou d’usage.

Cela crée une sorte de page d’édition ordinaire, qu’on peut éditer sous Gutenberg, Elementor, ou autre.

Cliquez sur l’icone Astra en haut à droite de l’interface pour faire apparaitre les options d’affichage de cette mise en page personnalisée.

Les options varient suivant le type de maquette, mais certaines sont communes à toutes :

Display and User Role Settings

    • Display on : choisissez le type des pages sur lesquelles ce Custom Layout devra s’afficher
    • Add exclusion : excluez certaines pages
    • User roles : affichez ce Custom Layout pour certains rôles et pas pour d’autres (admin, éditeur, auteur, abonné…)

Responsive Visibility

  • choisissez d’afficher cet élément sur ordinateur, tablette et / ou mobile.

Time Duration Settings

  • choisissez d’afficher cet élément à certaines dates (par exemple pour annoncer une opération commerciale, ou dire que vous êtes en vacances, ou tout autre message temporairement valide)

Créer un en-tête personnalisé

Choisissons l’option en-tête / header.

Sachez d’abord que cet en-tête remplacera l’en-tête normal et toutes ses personnalisations sur les pages où vous aurez demandé de l’afficher.

Cliquez maintenant sur les options d’Astra sur la page de votre en-tête personnalisé en mode édition normal (et pas en mode édition sous Elementor ou autre).

Sticky Settings

  • Stick : décidez si votre en-tête personnalisé doit être fixe ou pas
  • Shrink : si votre en-tête est fixe, vous pouvez ajouter cet effet de rétrécissement qui diminue les marges haut et bas quand on scrolle
  • Stick On : décidez si cet en-tête doit s’afficher sur ordinateur, tablette, ou mobile.

Créer un pied de page personnalisé

Le Custom Footer ou pied de page personnalisé a les options de tous les éléments Site builder, plus deux options particulières :

Sticky Settings

  • Stick : décidez si votre pied de page personnalisé doit être fixe ou pas
  • Stick on : décidez si ce pied de page personnalisé s’affichera sur ordinateur, tablette et mobile

Créer une page 404 personnalisée

La page 404 personnalisée, ou Custom 404 a les options générales, plus les options suivantes :

404 Page Display Settings

  • Disable Primary Header : désactive l’en-tête principal
  • Disable Footer Bar : désactive le pied de page normal

Créer et placer un bloc Site builder

Créer le bloc Site builder

On va d’abord aller sur l’onglet Astra / Site builder, puis cliquer sur Add new.

Cela va nous ouvrir une interface d’édition. On y crée notre contenu, avec l’éditeur classique de WordPress ou avec notre constructeur de page habituel (Elementor, Gutenberg, etc). On sauvegarde.

Si on a utilisé un constructeur de page, on doit revenir à l’onglet Mises en page personnalisées, trouver notre contenu, puis l’ouvrir en mode normal (donc sans passer par le constructeur de page). En bas, on va trouver Un réglage « paramètres de disposition personnalisée ».

Si on a utilisé l’éditeur classique, on est déjà sur la bonne page pour éditer les « paramètres de disposition personnalisée ».

Là donc, dans le menu déroulant, on sélectionne « hooks » : cela ouvre plein de nouvelles options à remplir.

Elles vont nous permettre de placer notre contenu à des endroits précis de notre site !

Placer le bloc Site builder sur un « hook »

Un « hook » en code informatique est un bout de code exécutable, pour accomplir une certaine action : par exemple aller chercher des données et les afficher.

Avec Astra, ce concept de hook signifie qu’on va pouvoir aller placer finement nos blocs de contenu (custom layouts) sur nos pages, nos articles, à divers endroits, et en fonction de règles définies.

Les options particulières de ce custom hook sont les suivantes :

  • Action : cette option est mal nommée… elle vous sert à indiquer la position à laquelle sera affiché le résultat du code, dans votre mise en page. Astra donne la liste des positions possibles sur cette page
  • Priority : la priorité d’affichage, au cas où plusieurs hooks ont été placés dans la même « action » = position : celui qui a la priorité la plus haute (genre 1, plutôt que 2) sera placé avant
  • Spacing : ajoute une marge interne (padding) à l’élément inséré

On va par exemple pouvoir placer

  • un menu de navigation sur tous les articles d’une catégorie donnée (on définira alors la règle « all singulars » de cette catégorie, dans les réglages du hook)
  • un bandeau pub sur les articles d’une catégorie : c’est ce que je fais ici même, sur cette page, tout en haut : la section « Astra Pro, un thème d’excellence » sur fonds rose, est un custom layout qui s’applique à tous les articles de la catégorie « Astra »)
  • une annonce, sur tel ou tel type de page : sur toutes les pages, ou sur tous les articles, ou uniquement sur les pages de catégorie, etc
  • une offre commerciale ou un bon de réduction sur toutes les pages de type produit, ou uniquement sur certains produits
  • etc etc

Bref, c’est très pratique et je l’utilise abondamment sur mon site !

Shortcodes

Notre bloc site builder a aussi un shortcode, un code court, qu’on peut trouver sur l’onglet Mises en page personnalisées.

Il suffit de le copier, et d’aller le coller n’importe où dans une page : cela aura pour effet d’importer automatiquement tout le contenu à cet endroit de la page ! Magique. (Cela fonctionne exactement comme un modèle Elementor, en fait.)

Créer un élément site builder (« inside page / post content »)

Astra pro permet d’insérer un élément sous certaines conditions directement à l’intérieur de pages ou d’articles.

Ce type de bloc Site builder a les options générales, plus les options particulières suivantes :

Location Settings

  • After a certain number of blocks : vous pouvez insérer votre bloc après un certain nombre d’autres blocs – pour garantir que cet élément sera bien intégré au contenu
  • Before certain number of Heading blocks : vous pouvez insérer votre bloc avant un certain nombre de bloc titre, par exemple avant le 3è titre H2 (mais ceci ne marche qu’avec les blocs titre, pas avec les titres tout court présents dans un bloc texte)

Conclusion

En résumé, les éléments / blocs Site builder, permettent de créer et ajouter automatiquement du contenu à certains endroits définis de la maquette d’un site, en suivant des règles conditionnelles, par type de page, et par catégorie.

Qu'avez-vous pensé de cet article ?

Cliquez sur une étoile pour donner votre avis

Avis moyen 4.1 / 5. Nombre d'avis donnés 11

Soyez le premier à donner votre avis

Guide du thème Astra et Astra Pro

Voici une documentation en français sur le thème Astra et ses plugins premium Astra Pro, Ultimate Addons, et Starter Templates

Le thème Astra & Astra Pro pour WordPress : la doc en français

Documentation en français du thème WordPress Astra et Astra Pro et de Starter Templates. Découvrez comment le customiser et l'adapter à vos besoins.

Guide d’installation du thème Astra & Astra Pro pour WordPress

Apprenez comment installer le thème WordPress gratuit Astra, sa version Astra Pro, et le plugin Starter Templates (ou premium).

Personnaliser Astra et Astra Pro avec le customizer (outil de personnalisation)

Le thème WordPress Astra, augmenté ou pas avec le plugin Astra Pro, propose de nombreux réglages de personnalisation dans le customizer de WordPress.

Les fonctionnalités du thème Astra et Astra Pro pour WordPress

Le thème WordPress Astra et sa version augmentée Astra Pro a d'excellentes performances et de nombreuses fonctionnalités.

Le constructeur d’en-tête (header) du thème Astra et Astra Pro

Le thème Wordpress Astra et son plugin premium Astra Pro permettent de concevoir un en-tête (header) élaboré par une interface WYSIWYG riche en options.

Le constructeur de pied de page (footer) du thème Astra Pro

Le constructeur de pied de page du thème Astra Pro permet de gérer 3 zones de footer et d'y placer du HTML, des widgets, des boutons ou des images.

Gérer la colonne latérale (sidebar) d’Astra et Astra Pro

Le thème Astra et sa version Pro permettent d'ajouter et personnaliser une colonne latérale (sidebar) sur chaque type de page, avec de nombreuses options.

Gérer le fil d’Ariane (breadcrumbs) d’Astra et Astra Pro

Le thème WP Astra et son plugin Astra Pro gèrent les options du fil d'Ariane (breadcrumbs), qui permet d'indiquer la place d'une page dans l'arborescence.

Personnaliser le blog d’Astra et Astra Pro

Le thème Astra et son plugin Astra Pro ont des options de configuration des articles de blog, des catégories de blog et des étiquettes / tags (pages "archives").

Personnaliser le thème Astra Pro pour WooCommerce

Le thème Astra Pro s'intègre parfaitement avec WooCommerce et permet de gérer les pages catalogue de catégorie produit et de fiche-produit.

Le thème WordPress Astra Pro et ses modules enrichissent ses fonctionnalités

Le thème WordPress Astra Pro est vendu avec une série de modules qui enrichissent ses fonctionnalités : couleurs, blog, WooCommerce, widgets...

Créer un méga-menu avec Astra Pro

Le thème WordPress Astra Pro permet de créer un méga-menu de navigation qui permet d'améliorer l'expérience utilisateur avec une interface plus visuelle.

Les mises en page personnalisées d’Astra Pro (Site Builder)

Le module Mises en page personnalisées (Site Builder) du thème Astra Pro ajoute la possibilité de créer des maquettes pour les différents types de page, ou des éléments de design à insérer sous conditions.

Le module En-tête de page d’Astra Pro (Page Header)

Le module En-tête de page (Page Header) offre de nombreuses options pour styler des en-têtes de page différenciés, activables selon le type de page.

Installer et utiliser les (Premium) Starter Templates d’Astra

Le thème Astra et son plugin Astra Pro permettent d'utiliser des centaines de modèles graphiques, nommés "Starter Templates" et "Premium Starter Templates"
Thème Wordpress Astra et Learndash LMS

Créer des cours en ligne de qualité avec le thème Astra et Learndash LMS

Découvrez comment créer des cours en ligne attrayants avec le thème Astra et Learndash LMS. De l'installation des outils à la gestion des étudiants, toutes les étapes pour optimiser votre expérience d'enseignement en ligne.
Tutor LMS et Astra Pro

Comment créer un cours en ligne avec Astra Pro et Tutor LMS

Découvrez comment créer un cours en ligne avec Astra Pro et Tutor LMS sur WordPress. Ce guide pratique vous accompagne étape par étape, de la préparation à la gestion de vos cours, en passant par la personnalisation de votre page. Créez dès maintenant des cours de yoga, de mathématiques, d'informatique ...

Besoin de savoir autre chose ? Posez vos questions en commentaire :-)

Besoin d’assistance concrète ? Embauchez-moi comme formateur WordPress !

Laisser un commentaire

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

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Besoin d’un hébergeur ?

Convivial, sympa, fiable, et pas cher,
O2Switch me semble être la meilleure offre actuellement sur le marché français.
C’est pourquoi j’y héberge tous mes sites.

Hébergement O2Switch
Hébergement O2Switch
Panier
Retour en haut