Blog · Gutenberg
Pullquote Pro block for WordPress
Eye-catching quotation with large typography, decorative marks, author avatar, and alignment options.
Get Blockenberg
Free Gutenberg block in Blockenberg. The inspector controls and front-end behavior on this page come from this block’s source, not a shared stub.
What it actually does
Eye-catching quotation with large typography, decorative marks, author avatar, and alignment options.
Inspector panels on this block: Quote Style, Author. Those titles come from index.js, not from a shared template.
Behavior controls: “Quote Mark Style” options: Curved (" "), Straight (" "), Guillemets (« »), None; “Layout / Alignment” options: Center, Left, Right, Float Left; “Typography Preset” options: Editorial, Elegant, Loud; “Accent Position” options: Left, Top, Bottom.
Pullquote Pro has no render.php and no frontend.js. The saved Gutenberg HTML is what visitors see, plus Blockenberg layout/typography CSS.
Where to find it
Gutenberg inserter → Blog → search “Pullquote Pro” (block name `blockenberg/pullquote-pro` in block.json). Style it in the sidebar after insert.
How to use Pullquote Pro block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Pullquote Pro”, insert it. Category: Blog.
- Configure inspector controls that exist on this block. Open Quote Style. Set “Quote Mark Style”, “Layout / Alignment”, “Typography Preset”, “Show Accent Line”.
- Publish. Save the page. Output is the saved block HTML; typography/colors follow Blockenberg shared panels.
Inspector controls from this block’s code
| Control | What the code does |
|---|---|
| Quote Mark Style | Select control; the chosen value is saved on the block. Options: Curved (" "); Straight (" "); Guillemets (« »); None. block.json default: curved. Saved as `quoteMarkStyle`. |
| Layout / Alignment | Select control; the chosen value is saved on the block. Options: Center; Left; Right; Float Left. block.json default: center. Saved as `layout`. |
| Typography Preset | Select control; the chosen value is saved on the block. Options: Editorial; Elegant; Loud. block.json default: editorial. Saved as `preset`. |
| Show Accent Line | On/off toggle in the inspector. On by default. Saved as `showAccent`. |
| Accent Position | Select control; the chosen value is saved on the block. Options: Left; Top; Bottom. block.json default: left. Saved as `accentPosition`. |
| Accent Width (px) | Numeric range control in the inspector. Range 2–12. block.json default: 4. Saved as `accentWidth`. |
| Vertical Padding (px) | Numeric range control in the inspector. Range 16–80. block.json default: 40. Saved as `paddingV`. |
| Horizontal Padding (px) | Numeric range control in the inspector. Range 16–80. block.json default: 40. Saved as `paddingH`. |
| Border Radius (px) | Numeric range control in the inspector. Range 0–24. block.json default: 8. Saved as `borderRadius`. |
| Box Shadow | On/off toggle in the inspector. Off by default. Saved as `shadow`. |
| Show Avatar | On/off toggle in the inspector. Off by default. Saved as `showAvatar`. |
| Avatar Size (px) | Numeric range control in the inspector. Range 32–100. block.json default: 56. Saved as `avatarSize`. |
| Quote Text | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `quoteTypo`. |
| Author | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `authorTypo`. |
| Colors — Background | Color control in the inspector. Saved as `bgColor`. |
| Quote Text | Color control in the inspector. block.json default: #222222. Saved as `textColor`. |
| Quote Mark | Color control in the inspector. block.json default: #d1c4e9. Saved as `markColor`. |
| Accent Line | Color control in the inspector. block.json default: #6c3fb5. Saved as `accentColor`. |
When this is the right block
- Eye-catching quotation with large typography, decorative marks, author avatar, and alignment options — that is the job of Pullquote Pro, not a generic content block.
- Use it when you need the editor control labeled “Quote Mark Style”, which exists on this block’s inspector.
- It matches pages about pullquote, quote, citation.
- Inserter grouping: posts, magazines, and editorial WordPress pages.
Notes from the implementation
viewScript: this folder’s frontend.js is enqueued on the front end for this block.
FAQ
How do I add the Pullquote Pro block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Pullquote Pro”. It sits under Blog. After insert, open Quote Style and set “Quote Mark Style”, “Layout / Alignment”, “Typography Preset”, “Show Accent Line”.
What makes Pullquote Pro different from other Blockenberg blocks?
Eye-catching quotation with large typography, decorative marks, author avatar, and alignment options. Inspector labels on this block include “Quote Mark Style”, “Layout / Alignment”, “Typography Preset”, “Show Accent Line”.
Is the Pullquote Pro Gutenberg block free?
Yes. Pullquote Pro ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Pullquote Pro to match my theme?
Yes. Blockenberg’s shared typography and color panels apply here, plus any block-specific style controls listed on this page (panels: Quote Style, Author).
Related blog blocks
Article Header
Rich editorial-style article/blog post header with category badge, headline, subheadline, author meta bar, and optional hero image.
Contributor Box
Multi-author attribution block with avatars, bios and social links.
Expert Roundup
Collect expert opinions, tips, or predictions on a topic. Each expert has a photo, name, title, and their contributed insight. Great for SEO-rich editorial articles.
Interview Q&A
Magazine-style interview Q&A with styled questions and answers, speaker info, and multiple visual styles.
Media Quote
Quote with embedded video thumbnail (play button overlay) or image and speaker attribution. Perfect for podcast clips, interview excerpts, and video testimonials.
Opinion Box
Editorial 'My Take' opinion callout with author attribution, badge, and signed commentary.
Get Blockenberg
Install Blockenberg from WordPress.org, then insert Pullquote Pro from the Gutenberg inserter.