Skip to content

Instantly share code, notes, and snippets.

@gregoirenoyelle
Last active September 12, 2021 13:28
Show Gist options
  • Save gregoirenoyelle/42a611bb969ea6d237d5ea4b1f657427 to your computer and use it in GitHub Desktop.
Save gregoirenoyelle/42a611bb969ea6d237d5ea4b1f657427 to your computer and use it in GitHub Desktop.
Ajouter des InnerBlock dans Gutenberg avec ACF
<?php
/**
* Affichage du HTML dans le block
*
* @author Grégoire Noyelle
* @since 1.0.0
*/
$template = array(
array( 'core/paragraph', array(
'content' => 'Texte du cartouche',
) )
);
?>
<section class="wrap-cartouche-texte">
<div class="cartouche-texte">
<InnerBlocks
template="<?php echo esc_attr( wp_json_encode($template) ); ?>"
templateLock="all"
/>
</div>
</section>
<?php
/***
* Fichier pour la création de blocs Gutenberg (Cartouche de Texte) avec ACF
* @link https://www.advancedcustomfields.com/resources/blocks/
* @link https://www.advancedcustomfields.com/resources/acf_register_block_type/
*/
//* Ajouter un bloc
add_action('acf/init', 'acf_bloc_gutenberg_cartouche_texte');
function acf_bloc_gutenberg_cartouche_texte() {
/// Vérifie si la fonction ACF existe
if ( ! function_exists('acf_register_block_type') ) return;
// Enregistrement du bloc
acf_register_block_type(array(
'name' => 'cartouche-texte',
'title' => 'Cartouche de Texte',
'render_callback' => 'acf_bloc_gutenberg_cartouche_texte_callback',
'enqueue_style' => plugin_dir_url(__DIR__) . 'css/style-cartouche-texte.css',
'category' => 'formatting',
'icon' => 'book-alt',
'mode' => 'preview',
'post_types' => array('page','post'),
'keywords' => array('profile', 'user', 'author'),
'supports' => array(
'align' => false,
'mode' => false,
'align_content' => false,
'jsx' => true
)
));
}
//* Affichage du bloc
function acf_bloc_gutenberg_cartouche_texte_callback() {
// Appel du fichier d'affichage
ob_start();
include plugin_dir_path(__DIR__) . 'view/view-bloc-cartouche-texte.php';
// Affichage et nettoyage de la mémoire tampon
echo ob_get_clean();
}
@charset "UTF-8";
/* CSS du bloc Cartouche de Texte' */
.entry-content-singular-full .wrap-cartouche-texte,
.debut-contenu .wrap-cartouche-texte,
.wrap-cartouche-texte {
background: black;
grid-column: 1 / -1;
margin-top: 20px;
margin-bottom: 20px;
}
.cartouche-texte {
color: white;
padding: 49px 29px;
max-width: 761px;
margin: 0 auto;
}
<?php
// Contenu par défaut
$template = array(
array('core/heading', array(
'level' => 2,
'content' => 'Texte du titre',
)),
array( 'core/paragraph', array(
'content' => 'Texte du cartouche',
) )
);
// Blocs autorisés
$allowed_blocks = array(
'core/heading',
'core/paragraph',
'core/button'
);
?>
<div class="contenu-texte contenu-texte-<?php echo $alignement_class;?>">
<InnerBlocks
template="<?php echo esc_attr( wp_json_encode($template) ); ?>"
allowedBlocks="<?php echo esc_attr( wp_json_encode($allowed_blocks) );?>"
templateLock="false"
/>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment