Block Pattern: Contact Details and Opening Hours
Adds a two-column contact section with address, phone and email on one side and opening hours on the other, ready to fill in.
Opens WPIDE on
Code
add_action( 'init', function () {
if ( ! function_exists( 'register_block_pattern' ) ) {
return;
}
if ( ! WP_Block_Pattern_Categories_Registry::get_instance()->is_registered( 'wpide-sections' ) ) {
register_block_pattern_category( 'wpide-sections', array( 'label' => 'Site Sections' ) );
}
$content = '<!-- wp:columns --><div class="wp-block-columns">'
. '<!-- wp:column --><div class="wp-block-column"><!-- wp:heading {"level":3} --><h3 class="wp-block-heading">Visit or call us</h3><!-- /wp:heading -->'
. '<!-- wp:paragraph --><p>12 Harbor Street<br>Springfield, 01234</p><!-- /wp:paragraph -->'
. '<!-- wp:paragraph --><p><a href="tel:+15550100199">+1 555 010 0199</a><br><a href="mailto:[email protected]">[email protected]</a></p><!-- /wp:paragraph --></div><!-- /wp:column -->'
. '<!-- wp:column --><div class="wp-block-column"><!-- wp:heading {"level":3} --><h3 class="wp-block-heading">Opening hours</h3><!-- /wp:heading -->'
. '<!-- wp:list --><ul class="wp-block-list"><!-- wp:list-item --><li>Monday to Friday: 9:00 to 17:30</li><!-- /wp:list-item --><!-- wp:list-item --><li>Saturday: 10:00 to 14:00</li><!-- /wp:list-item --><!-- wp:list-item --><li>Sunday: closed</li><!-- /wp:list-item --></ul><!-- /wp:list --></div><!-- /wp:column -->'
. '</div><!-- /wp:columns -->';
register_block_pattern( 'wpide/contact-details', array(
'title' => 'Contact details and hours',
'description' => 'Address, phone, email and opening hours in two columns.',
'categories' => array( 'wpide-sections' ),
'keywords' => array( 'contact', 'address', 'hours' ),
'content' => $content,
) );
} );
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.