Quote Block Style: Big Quotation Mark
Adds a "Big quotation mark" style to Quote and Pullquote blocks that shows a large decorative quote sign and roomier text, for testimonials and highlights.
Opens WPIDE on
Code
add_action( 'init', function () {
$css = '.is-style-wpide-big-mark{position:relative;padding-top:2.5rem!important;border:0!important;}'
. '.is-style-wpide-big-mark::before{content:"\201C";position:absolute;top:-.5rem;left:0;font-family:Georgia,serif;font-size:5rem;line-height:1;opacity:.25;}'
. '.wp-block-pullquote.is-style-wpide-big-mark::before{left:50%;transform:translateX(-50%);}'
. '.is-style-wpide-big-mark p{font-size:1.2em;line-height:1.5;}';
foreach ( array( 'core/quote', 'core/pullquote' ) as $block ) {
register_block_style( $block, array(
'name' => 'wpide-big-mark',
'label' => 'Big quotation mark',
'inline_style' => $css,
) );
}
} );
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.