• Tweetez
• Enregistrez
• Partagez
• Mail
• LinkedIn
• WhatsApp

Bienvenue dans cette Démo pour personnaliser les blocs Gutenberg !

TABLE DES MATIÈRES

Bloc Bannière Pleine Largeur

Pour bénéficier d’un alignement pleine largeur de la bannière, il faut au préalable activer dans l’onglet Personnaliser éditeur de la page d’option du plugin :
l’option d’alignement large pour l’éditeur de blocs.
Réglage de la hauteur de la bannière sur mobile dans le Panneau ECCP Styles des paramètres du bloc.

• Réglage du style Text Shadow pour le Titre & Texte dans le Panneau ECCP Text Shadow des paramètres du bloc.
• Réglage du style Box Shadow pour le Bouton dans le Panneau ECCP Box Shadow des paramètres du bloc.
• Le Bloc bannière est groupé ce qui permet d’avoir accès dans les paramètres du bloc Groupe au Panneau ECCP Formes de séparation et d’appliquer le style Vagues pour le bas de la bannière.

L’extension permet d’activer la Typographie Fluide pour les tailles de texte prédéfinies et les tailles personnalisés.
La Typographie Fluide permet aux tailles de texte de s’adapter aux changements de taille de l’écran, par exemple en augmentant la taille à mesure que la largeur de la fenêtre augmente, ou en la réduisant à mesure qu’elle diminue.
Le texte ci-dessous « Je décide d’apprendre a danser! » est avec une Typographie Fluide de 36px sur PC & 24px sur Mobile.

Formation Rock 4 Temps

Je décide d’apprendre à danser !

Découvrer Notre Formation

Bloc Bouton Style Contour

Réglage du style au survol dans le Panneau ECCP Style Contour Au Survol des paramètres du bloc: réglage de la couleur du Texte & Arrière plan & bordure.
L’extension ECCP ajoute un bouton format a la barre d’outils du bloc qui permet l’insertion d’une icône a gauche ou droite du texte sélectionné du bouton.
Ce bouton est aussi activé pour la barre d’outils du bloc Paragraphe et permet d’insérer dans le texte un icône pour un espace sélectionné.

Bloc Bouton Style Plein

Réglage du style au survol dans le Panneau ECCP Style Plein Au Survol des paramètres du bloc, réglage de la couleur du Texte & Arrière plan & bordure.
L’extension ECCP ajoute un bouton format a la barre d’outils du bloc qui permet l’insertion d’une icône a gauche ou droite du texte sélectionné du bouton.
Ce bouton est aussi activé pour la barre d’outils du bloc Paragraphe et permet d’insérer dans le texte un icône pour un espace sélectionné.

Bloc Bouton style Outline hover arrow

Le style Outline hover arrow est accessible dans le Panneau Styles des paramètres du bloc.
Le style au survol en front end est appliqué automatiquement en fonction de la couleur d’arrière plan sélectionnée dans les paramètres du bloc bouton en back office.

Bloc Bouton Style Download

Appliquer simplement le style Download a partir du panneau style des paramètres du bloc.

Bloc Citation

Ajout d’une option dans la page de réglages de l’extension, onglet Personnaliser Blocs Gutenberg, pour activer des styles personnalisés aux paramètres du bloc Citation.
Ci-dessous Bloc citation avec respectivement les styles:
• Quote
• Fancy Quote
• Parenthèse
• First Letter
• Arrow
Remarque
Le style Fancy Quote est identique a la variation du bloc citation Fancy Quote, disponible dans l’inséreuse de blocs sous la catégorie: BLOC PERSONNALISÉS ECCP.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Bloc Colonne

Bloc colonne avec le style: Column Reverse On Mobile (Inversion des colonnes sur mobile) sélectionné dans le Panneau Styles des paramètres du bloc.
Application du style centré du texte pour les paragraphes sur mobile, dans le Panneau ECCP Styles des paramètres du bloc.
Ajout d’un lien au bloc entier pour la colonne de gauche, dans le Panneau ECCP Link des paramètres du bloc.

Demo 07 Rock A 4 Temps

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Demo 07 Rock A 4 Temps

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Bloc Derniers Articles

Activation du style Card dans la page d’options du plugins Onglet Personnaliser Blocs Gutenberg.
Le style Carte n’est fonctionnel que pour la disposition en grille des derniers articles.
Pour l’image mise en avant utiliser la taille moyenne sans aucun alignement.
Les régles de style pour la balise lire la suite sont communes & appliquées a partir du bloc lire la suite.

Option pour activer un zoom au survol de 5% par défaut uniquement en
Front End.

• 
  ROCK 4 TEMPS Fête Ses 4 Ans
  par Rouergue Creation
  6 février 2021
  LA VIE DU SITE ROCK 4 TEMPS Crée en début 2017, le site ROCK 4 TEMPS fête ses 4 ans d’existence en 2021.
  En 2020[…]
• 
  Présentation 4ème Saison Cours En Vidéos
  par Rouergue Creation
  18 septembre 2020
  Le Tournage A compter du 22 juin en pleine période de déconfinement, la danse de couple a été autorisé dans les conditions habituelles.
  Le tournage[…]
• 
  Rock That Paris
  par Rouergue Creation
  1 février 2020
  Introduction: Rock 4 You organise le samedi 8 février 2020 à Paris un concours de Rock 4 Temps.
  A cette occasion, j’ai l’honneur d’être invité[…]

Bloc Boucle De Requête

Activation du style Card dans la page d’options du plugins Onglet Personnaliser Blocs Gutenberg.
Le style Carte n’est fonctionnel que pour la disposition en grille.
Les régles de style pour la balise lire la suite sont communes & appliquées a partir du bloc lire la suite dans la page d’options du plugin.
Pour avoir le même rendu que l’image ci-dessous, vous devez insérer un bloc espacement entre le bloc Date de la publication & le bloc Catégories d’articles.

Vous pouvez activer l’utilisation d’un avatar personnalisé pour le bloc Boucle De Requête.
Télécharger ensuite dans la médiathèque votre avatar personnalisé.
Cet avatar personnalisé doit être une image au format carrée, par exemple de 150 * 150px.
En back office pour un site en ligne, vous devez ensuite activer cet avatar personnalisé en sélectionnant l’option avatar personnalisé dans le menu Réglages/Commentaires section avatar par défaut.

Option pour activer un zoom au survol de 5% par défaut uniquement en
Front End.

Bloc Détails

Ce bloc introduit par la version WordPress 6.3 peut par exemple permettre d’établir une FAQ comme ci-dessous.
l’extension ECCP Ajoute un contrôle alignement dans la barre d’outils du bloc.
Dans les paramètres du bloc Panneau ECCP Styles,ajout des options:
• Icône Dashicons Arrows, en remplacement de l’icône par défaut, pour indiquer si le contenu du bloc détails est affiché ou masqué.
• Largeur du bloc
• Rayon de bordure

Le contrôle alignement est expérimental si vous rencontrez un problème avec l’alignement gauche ou droite , insérer en dessous du Bloc Détails un bloc espacement de 1px.

Bloc Embed Vidéos You Tube

Vidéo réglée a une largeur de 640px dans l’onglet Personnaliser éditeur de la page d’options du plugin, menu:
embeds responsive(par exemple intégration de vidéos YouTube).
Suite a la modification de taille, le plugin gère les alignements (left, center,right) de la vidéo.

Bloc Espacement

Gestion du responsive, réglages Hauteur Espacement en pixel dans le Panneau ECCP Styles des paramètres du bloc, pour les Tablettes & Mobiles.
Par défaut à l’activation du mode responsive, hauteur espacement de 50px pour les tablettes et 30px pour les mobiles.

Bloc FAQ Yoast SEO

Options dans la page de réglage de l’extension, onglet Personnaliser Blocs Gutenberg, pour transformer en Front End le bloc FAQ Yoast SEO en Accordéon et modifier sa largeur.
Ce bloc fait parti de l’extension Yoast SEO, il comporte des données structurées, ce qui permet d’avoir des résultats enrichis dans le moteur de recherche de Google.

Bloc Galerie

Dans le Panneau ECCP Styles des paramètres du bloc, réglage d’un zoom au survol des images & d’un style justifié.
Pour appliquer le style card aux images du bloc galerie à partir du Panneau Styles, il faut au préalable avec le réglage natif de l’editeur ajouter un rayon de bordure de 1px aux images pour déplacer la légende en dessous de l’image.
Le style justifié permet pour les blocs images de la galerie d’ avoir le même écartement horizontalement comme verticalement.
A cause du style justifié il sera peut être nécessaire d’ ajouter dans les paramètres du bloc Galerie une marge basse de par ex 1.5 em.

Dans la page de réglages de l’extension Onglet Personnaliser Front End
vous pouvez activer l’option lightbox.
La fenêtre contextuelle Fancybox permet alors d’apporter une lightbox aux images & galeries WordPress.
Cette lightbox est présente pour la galerie ci-dessous.

Autre Style

Le bloc Galerie est Ajouté dans un bloc Groupe ou Grouper a partir de la barre d’outil du bloc galerie.
Dans le Panneau ECCP Styles des paramètres du bloc Galerie, réglage d’un style justifié & d’un rayon de bordure global de 10px commun a toutes les images de la galerie, puis à partir du panneau Dimensions on régle l’espacement des bloc images.
Dans les paramètres du bloc groupe, on applique une couleur de fond et un rayon de bordure de 10px, puis à partir du panneau Dimensions une marge interne égale a l’espacement des blocs images de la galerie.

Simple Slider

Dans la page de réglages de l’extension Onglet Personnaliser Bloc Gutenberg vous devez activer pour le bloc galerie l’option qui permet de charger les scripts et styles nécessaire a la librairie Swiper afin de transformer en Front End le bloc galerie en slider.

Dans les paramètres de réglages du bloc Galerie, ajout du panneau
ECCP Slider pour activer le slider et ses options de réglages:
Largeur du slider, Lecture automatique avec délai de lecture par slide, Navigation Par Points, Navigation Par Flêches, Navigation Par Barre De Défilement .

Slider Lecture Automatique

Comparaison images AVANT/APRÉS

Dans les paramètres de réglages du bloc Galerie, ajout du panneau
ECCP Avant/Aprés. Il permet d’activer en Front End une comparaison pour une galerie composée de deux images qui présentent des différences, avec un effet de slide au survol des images.
• Pour que ce style fonctionne vous devez incorporer le bloc galerie dans bloc a 2 colonnes.
• Veiller dans les paramètres du bloc galerie a ne mettre aucun lien pour les images.
• Les intitulés « AVANT » & « APRÉS » sont renseignés avec la légende de l’image.

Bloc Groupe

Réglage arrondi de la bordure dans le Panneau ECCP Styles des paramètres du bloc.
Réglages du style Box Shadow dans le Panneau ECCP BOX Shadow des paramètres du bloc.

Style Table des matières

Dans le Panneau Styles des paramètres du bloc ajout du style Table Of Contents.
Ce style permet d’afficher uniquement en Front End une Table des matières de la publication en cours.Vous devez également au préalable dans le paramètre du bloc groupe
Panneau avancé/élément HTML sélectionner une balise <article>.

Cette Table des matières est visible en haut de cette page .

Dans les paramètres du bloc groupe vous pouvez modifier:
• La couleur d’arrière plan, couleur & taille & graisse du texte , rayon de bordure, etc..

Dans le Panneau ECCP styles des paramètres du bloc vous pouvez modifier:
• Réglage largeur du bloc Groupe donc de la Table Des Matières.

Dans la page de paramètres de l’extension,
onglet Personnaliser Blocs Gutenberg/Bloc Groupe/style table des matières:
• Titre,couleur du titre,pour la table des matières
• Activer un soulignement des liens au survol
• Décalage des ancres de navigation pour un en-tête fixe

Retrouver aussi le bloc Table des matières en téléchargement dans l’onglet blocs réutilisables des paramètres de l’extension.
Une fois le bloc réutilisable inséré dans la publication, cliquer sur l’icône « convertir en blocs normaux » de la barre d’outils du bloc.

Style Formes de séparation

Dans le Panneau ECCP Formes de séparation des paramètres du bloc vous avez le choix parmi douze styles de formes, avec réglage de la hauteur, largeur, couleur de fond, retournement.

Exemple: style Ventilateur & Incurvé pour le bloc groupe ci-dessous.

Espacements Fluides & Tailles personnalisées Fluides

L’extension permet d’activer la Typographie Fluide pour les tailles de texte prédéfinies et les tailles personnalisés, ainsi que les Espacements Fluides.
La Typographie Fluide permet aux tailles de texte de s’adapter aux changements de taille de l’écran, par exemple en augmentant la taille à mesure que la largeur de la fenêtre augmente, ou en la réduisant à mesure qu’elle diminue.
Il en est de même pour les Espacements Fluides qui s’appliquent aux sept valeurs prédéfinies pour les marges internes, externes et espacement des blocs qui sont disponibles dans la section Dimensions de l’onglet Style aux paramètres du bloc.

Bloc Icônes de réseaux sociaux

Dans le panneau Styles des paramètres du bloc sélectionner le style Rectangular Shape.
Pour les icônes de réseaux sociaux, saisissez le libellé dans les paramètres du bloc.
Le libellé sera visible au survol de l’icône de réseau social.
Corrélation des tailles des icônes avec les tailles de texte de l’editeur Gutenberg.
Dans le panneau style des paramètres du bloc vous avez aussi les styles:
Float Right: icônes sociales flottantes à droite
Float Left: icônes sociales flottantes à gauche

• Twitter
• YouTube
• Facebook
• Pinterest

Bloc icônes sociales avec liens de partage

Dans le panneau Styles des paramètres du bloc sélectionner le style Rectangular Shape.
Pour les icônes de réseaux sociaux, saisissez le libellé dans les paramètres du bloc.
Le libellé sera visible au survol de l’icône de réseau social.
Dans le panneau ECCP styles des paramètres du bloc, activer l’option pour transformer le lien de profil en lien de partage.
Le résultat est visible en haut de page et avec le style flottant à droite de cette page.
Le lien de partage pour le réseau social Pinterest transmet l’URL de l’Image En Avant si elle est présente pour les articles & types de publication personnalisées.
Retrouver des bloc icônes sociales avec styles liens de partage en téléchargement dans l’onglet blocs réutilisables de la page de réglages de l’extension.
Aprés importation dans l’écran des blocs réutilisables, vous pouvez ensuite afficher ces blocs réutilisables avant et/ou aprés tous type de publication via l’onglet blocs réutilisables de la page de réglages de l’extension.

Bloc Image

Style Filter: Grayscale(niveaux de gris) dans le Panneau Styles des paramètres du bloc.
Réglage de la légende pour l’image dans l’onglet Personnaliser Blocs Gutenberg de la page d’options du plugin, menu Bloc Image:
couleurs du texte & arrière plan, marge interne.
Réglage d’un zoom au survol des images dans le Panneau ECCP Styles des paramètres du bloc.

Dans la page de réglages de l’extension Onglet Personnaliser Front End
vous pouvez activer l’option lightbox.
La fenêtre contextuelle Fancybox permet alors d’apporter une lightbox aux images & galeries WordPress.
Cette lightbox est présente pour l’image ci-dessous.

Application du style Circle img 16/9 dans le Panneau Styles des paramètres du bloc.

Style Card: dans le Panneau Styles des paramètres du bloc.
Réglage de la largeur de l’image dans le panneau ECCP Styles des paramètres du bloc.
Effet Box Shadow dans le panneau ECCP Box Shadow des paramètres du bloc.
Ex: H=0 ¹V= 0  Rayon de flou= 4  Rayon de diffusion= 2  Couleur= #000
Opacité= 20%
Rayon de bordure avec le réglage natif de Gutenberg depuis
WordPress 6.0.
Ce style Card est expérimental si vous rencontrez un problème avec l’alignement gauche ou droite de l’image, insérer en dessous de l’image un bloc espacement de 1px.

Bloc Liste

Style des puces respectivement : Ordonned disk,check,
circle duotone,push spin,add circle fill,etc.. sélectionné dans la barre d’outils ou le Panneau Styles des paramètres du bloc.
Réglage de la taille des puces dans le Panneau ECCP Styles des paramètres du bloc.
Réglage de la couleur des puces dans le Panneau ECCP Couleur Des Puces des paramètres du bloc.
Soulignement du texte selon une palette de 7 couleurs sélectionnées dans le menu Souligner Couleurs de la barre d’outils du bloc.

1. Liste ordonnée de style: Ordonned Disk
   1. Liste indentée
2. Liste ordonnée de style: Ordonned Disk
3. Liste ordonnée de style: Ordonned Disk

• Établissement de la charte graphique : Palette des couleurs, Typographie, Logo
• Refonte complète : des pages du site avec le constructeur de page Elementor

• Création : Formulaire d’inscription à une Newsletter
• Ajout d’une nouvelle rubrique : Formation Rock 4 Temps, Je décide d’apprendre à danser !, avec intégration de la passerelle de Paiement Stripe

• Intégration de cours en vidéos : accessible uniquement pour les Membres Premium
• Établissement de la charte graphique : Palette des couleurs, Typographie, Logo

• Refonte complète : des pages du site avec le constructeur de page Elementor
• Remplacement du player vidéos : pour la rubrique Photos/Vidéos j’utilise maintenant un Player Vidéos Moderne.

Style Diagram

Le style Diagram dans le Panneau Styles des paramètres du bloc Liste
permet d’établir un diagramme par arborescence.
Commencer par sélectionner le style defaut dans le Panneau Styles des paramètres du bloc Liste.
Ajoutez des éléments de liste pour représenter la structure de votre diagramme.
Indentez les éléments de la liste qui doivent être les éléments de la sous-arborescence
dans le diagramme.
Vous devez impérativement mettre en gras tous les éléments de la liste.
Sélectionnez dans le panneau style des paramètres du bloc le style Diagram,
pour avoir le visuel du diagramme en back office & front End.
Pour toute modifications ultérieures sélectionner dans le panneau style le style défaut,
Une fois terminé les modifications, sélectionner le style Diagram.

• Acceuil
  • La Vie du site Rock 4 Temps
    • La Refonte du site Rock 4 Temps
    • Rétrospective 2020
  • Chaine YouTube Rock 4 Temps
  •  Page Facebook Rock 4 Temps
  • Les Statistiques Du Site
    • Utilisateurs
    • Données Démographiques
    • Les Canaux D’Acquisition
    • Le Référencement Google

Style Accordion

Le style Accordion permet de transformer le bloc liste en Accordéon basculable visible uniquement en Front End.
Ce style s’applique uniquement a une liste non ordonnée.
Commencer par sélectionner le style Accordion dans le Panneau Styles des paramètres du bloc.
Le 1er élément de la liste correspondra par exemple a une question.
Indentez le deuxième élément de la liste qui correspondra a la réponse.
Continuez ainsi de suite pour avoir le visuel du bloc liste en back office comme ci dessous.
Par défaut les questions sont mises en caractères gras sur Front End.
Vous pouvez régler la largeur de l’accordéon via le Panneau ECCP Styles des paramètres du bloc Liste.

• Question N°1
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
• Question N°2
  • Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Bloc Média & Texte

Style Half Background(demi arrière plan) sélectionné dans le Panneau Styles des paramètres du bloc.
Activer le style box shadow dans le Panneau ECCP Box Shadow des paramètres du bloc pour régler le demi-arrière plan de l’image.
Paramètres pour l’exemple ci-dessous:
Couleur ombre de boite: #0E6487  X:20  Y:20  Flou:0  Diffuser:0

Demo Rock A 4 Temps

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Bloc Paragraphe

Style de notification & icône en préfixe du titre

Application d’une icône dashicons(site) en préfixe du titre(ci-dessus) sélectionné dans le Panneau ECCP Styles des paramètres du bloc Titre.
Application du style Info(ci-dessous) sélectionné dans la barre d’outils ou le Panneau Styles des paramètres du bloc Paragraphe.
Réglage de la largeur du bloc paragraphe dans le Panneau ECCP Styles des paramètres du bloc.

INFO
Un espace en trop entre deux lettres, un écart irrégulier entre les paragraphes ou les intertitres… Traquez toutes les petites coquilles, histoire de livrer un article 100% cohérent et agréable à parcourir. Après tout, les détails font la perfection, n’est-ce pas ?

Surlignement du texte

Surlignement du texte selon une palette de 7 couleurs sélectionnées dans le menu Surlignage Couleurs de la barre d’outils du bloc.
Le surlignement du texte concerne toutes les barres d’outils de bloc qui présentent un menu format comme les blocs liste, paragraphe,titre.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lien externe & soulignement simple

Un contôle Liens Externes est présent dans le menu format de la barre d’outils.
Concerne toutes les barres d’outils de bloc qui présentent un menu
format comme les blocs liste, paragraphe,titre.
Permet l’ajout d’une icône Dashicons External après le lien sélectionné avec réglage de la couleur du lien + icône selon une palette de 7 couleurs.
Cela met en évidence que c’est un lien externe qui redirigera l’utilisateur
vers un autre site Web.

Un contôle Souligner est présent dans le menu format de la barre d’outils,il permet un soulignement simple du texte.

Ceci est un Lien Externe avec une icône positionnée aprés le lien pour indiquer a l’utilisateur que ce lien redirigera vers un autre site Web.
Voilà un soulignement simple du texte.

Contour du texte

Contour du texte selon une palette de 7 couleurs sélectionnées dans les menus Contour Couleurs, Contour Double Couleurs, Contour Pointillé Couleurs de la barre d’outils du bloc.
Le Contour du texte concerne toutes les barres d’outils de bloc qui présentent un menu format comme les blocs liste, paragraphe,titre.
Le contour du texte se fait selon un trait simple,double,pointillé.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Info-Bulle

Un contôle Ajouter info-bulle est présent dans le menu format de la barre d’outils.
Concerne toutes les barres d’outils de bloc qui présentent un menu
format comme les blocs liste, paragraphe,titre.
Le bouton Ajouter info-bulle affiche une fenêtre modale dans laquelle vous pouvez saisir le message de votre info-bulle pour l’élément de texte sélectionné.
Une fois le message saisi et appliqué, l’élément de texte sélectionné est souligné par un double trait, le message apparait dans une info-bulle au survol de l’élément de texte.

La couleur du texte et arrière plan etc.. de l’info-bulle sont personnalisable dans la page de réglages de l’extension:
Onglet Personnaliser bloc Gutenberg/BLOC PARAGRAPHE/Format info-bulle

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Bloc Réutilisable Attention

Bloc à télécharger au format json dans l’onglet Blocs réutilisables de la page d’options du plugin.

Bloc Réutilisable Alerte

Bloc à télécharger au format json dans l’onglet Blocs réutilisables de la page d’options du plugin.

Bloc Tableau

Application du style ECCP Stripes sélectionné dans le Panneau Styles des paramètres du bloc, activer section d’en-tête dans le Panneau réglages du tableau.
• Réglages dans le Panneau ECCP En-Tête Tableau des paramètres du bloc:
couleur du texte & arrière plan pour l’en-tête.
• Réglages dans le Panneau ECCP Corps Du Tableau des paramètres du bloc:
couleur du texte & arrière plan pour les lignes paires
• Réglages dans le Panneau Couleur des paramètres du bloc:
couleur du texte & arrière plan pour les lignes impaires

• Ajout d’une option dans la page de réglages de l’extension pour activer les tables responsives. Pour une résolution d’écran <= 767px la colonne de gauche est fixe et le reste des colonnes peuvent défiler.

Variation du bloc citation: Fancy Quote

Ajout à partir de l’inséreuse de blocs de la variation Fancy Quote sous la catégorie
BLOCS PERSONNALISÉS ECCP.

C’est une variation du bloc natif de WordPress citation.
Le réglage de la couleur des quotes commun avec le bloc réutilisable blockquote se trouve dans l’onglet Bloc Réutilisables de la page d’options du plugin menu: Téléchargement & réglages du bloc blockquote.

Ceci est une citation avec la variation de bloc Fancy Quote.
Cette variation se trouve dans l’inséreuse de bloc sous la catégories
BLOCS PERSONNALISÉS ECCP accessible par l’icone + de l’editeur Gutenberg. Le réglage pour la couleur des quotes se trouve dans la page d’options du plugin.

Variation du bloc groupe: Info Box

Ajout à partir de l‘inséreuse de blocs de la variation Info Box sous la catégorie
BLOCS PERSONNALISÉS ECCP.
Cette variation combine les blocs Titre, Colonnes, Paragraphe, Bouton, Image dans un groupe,soit six blocs au total, avec gestion du responsive.
Ajout d’un lien au bloc groupe entier, dans le Panneau ECCP Link des paramètres du bloc.

Apprendre À Danser

Avec notre formation en ligne, au travers de vidéos, vous allez apprendre à danser les passes du
Rock A 4 Temps .
Chaque passe de danse est décomposée afin de la rendre accessible au plus grand nombre.

Découvrer Notre Formation

Variation du bloc Paragraphe: Click to Tweet

Ajout à partir de l‘inséreuse de blocs de la variation Click to Tweet sous la catégorie
BLOCS PERSONNALISÉS ECCP.
L’ajout d’une fonction « Cliquer pour Tweeter » a vos articles est un excellent moyen d’encourager vos lecteur a partager votre contenu.
Cette variation définit une taille de texte à 25px et un effet Box Shadow, le bouton « Click to Tweet » n’est visible qu’en Front End.

Découvre les personnalisations des blocs Gutenberg dans la démo du plugin
Editor Custom Color Palette
#WordPressClick to Tweet

Variation du bloc Colonne: Pricing Table

Ajout à partir de l’inséreuse de blocs de la variation Pricing Table sous la catégorie
BLOCS PERSONNALISÉS ECCP.
Cette variation utilise beaucoup de réglages apportés par ce plugin, successivement:
• Arrondi de la bordure aprés application d’une couleur d’arrière plan pour les titres du tableau des prix
• Arrondi de la bordure pour le bloc colonne
• Réglage de largeur pour le bloc separateur
• Style check pour les listes a puces, avec réglages de la couleur & taille des puces
• Style au survol pour les boutons
• Effet Box Shadow pour les colonnes
• Réglage espacement mini des colonnes

Variation du bloc Groupe: Countdown Timer

Ajout à partir de l‘inséreuse de blocs de la variation du bloc Groupe Countdown Timer sous la catégorie BLOCS PERSONNALISÉS ECCP.
Cette variation combine seulement un bloc paragraphe pour un texte d’intro au compte à rebours. Le compte a rebours est visible uniquement en Front End.
Dans le panneau ECCP Compte à rebours des paramètres du bloc, option pour activer le compte à rebours et sélectionner la date de l’évènement.
Par défaut en Back Office et Front end on a juste un effet Box Shadow, et le texte d’introduction : « Prochain Spectacle » a personnaliser.
Le reste des paramètres de réglages natif des blocs Groupe & paragraphe ainsi que ceux apportés par l’extension permettent d’obtenir le résultat ci-dessous.
Cette variation du bloc groupe est expérimentale si vous rencontrez un problème avec l’alignement gauche ou droite du bloc groupe, insérer en dessous du bloc un espacement de 1px.

Variation du bloc Colonne: Flip Box

Ajout à partir de l‘inséreuse de blocs de la variation du bloc Colonne Flip Box sous la catégorie BLOCS PERSONNALISÉS ECCP.
Cette variation combine un bloc colonne, un bloc groupe qui contient lui même deux autres blocs groupe:


Vous devez en back office remplir le contenu des deux blocs groupe qui concerne la face avant et arrière du Flip Box.
La fonctionnalité de retournement du Flip Box ne sera visible qu’en Front End.
La hauteur de la colonne Flip Box Vertical est fixé par défaut a une hauteur min de 350px, au besoin ajouter un bloc espacement en dessous du bloc Colonnes.
Rappel: Gestion du responsive pour le bloc espacement, réglages Hauteur Espacement en pixel dans le Panneau ECCP Styles des paramètres du bloc, pour les Tablettes & Mobiles.
Remarque:
Les icônes de la face avant & arrière du Flip Box font partie d’un bloc Paragraphe dans lequel on a juste mis un espace insécable(raccourci clavier: ALT + 255).
L’extension ECCP ajoute un bouton format a la barre d’outils du bloc Paragraphe qui permet l’insertion d’une icône Dashicon pour un espace sélectionné.

Voir toutes les fonctionnalités de l’extension

• Tweetez
• Enregistrez
• Partagez
• Mail
• LinkedIn
• WhatsApp