Shortcodes and Gutenberg Block

Shortcodes and Gutenberg Block

---

Shortcodes

[bp_quotes]

Renders the member-facing quote activity feed widget. This shortcode outputs the quote-enabled activity stream in the context of the current page.

[bp_quotes]

This shortcode does not accept attributes. Use it on a dedicated page if you want to expose the activity feed outside of the main BuddyPress activity area.

---

[bp_quotes_leaderboard]

Renders a ranked list of members by quote count.

[bp_quotes_leaderboard period="week" count="10" scope="site"]

Attributes:

Attribute	Type	Default	Description
period	string	week	Time window to rank over. One of week, month, all.
count	integer	10	Number of members to display. Any positive integer.
scope	string	site	Leaderboard scope. Currently only site (site-wide) is supported.

Examples:

[bp_quotes_leaderboard]

Top 10 members this week (all defaults).

[bp_quotes_leaderboard period="month" count="5"]

Top 5 members this month.

[bp_quotes_leaderboard period="all" count="25" scope="site"]

All-time top 25.

The shortcode enqueues its own stylesheet and is safe to use multiple times on the same page with different attributes.

---

Gutenberg Block

The plugin registers a BuddyPress Quote block with the name bpquotes/quote. You can insert it in any post or page using the block editor.

Inserting the Block

1. Open a post or page in the block editor.
2. Click the + inserter or type /buddypress quote.
3. Select BuddyPress Quote.
4. Type your quote text in the block.
5. Use the block settings in the sidebar to choose a background, text color, font, and alignment.

Block Attributes

Attribute	Type	Default	Description
content	string	""	The quote text
presetId	integer	0	ID of a preset to apply. Overrides manual background and color when set.
background	string	""	Background value (image URL, hex color, or CSS gradient string)
textColor	string	""	CSS color for the quote text
fontFamily	string	""	Font family string. Empty string inherits the site font.
alignment	string	"center"	Text alignment: left, center, or right

Block Supports

The block declares the following WordPress block supports, so site editors can use them in the usual places:

Support	What it enables
align	Wide and full-width alignment in the editor
anchor	A custom HTML anchor for deep-linking
spacing	Padding and margin controls via the spacing panel

Server-Side Rendering

The block is rendered server-side via includes/blocks/quote/render.php. This means:

• The rendered output always reflects the current plugin settings (fonts, background definitions, etc.) without needing a block update.
• The block works correctly in full-site editing contexts and in REST API block previews.

Example Block Markup (serialised)

<!-- wp:bpquotes/quote {"content":"The future belongs to those who believe in the beauty of their dreams.","textColor":"#ffffff","background":"linear-gradient(135deg,#667eea,#764ba2)","alignment":"center"} /-->

Styling the Block in Themes

The block wrapper has the class wp-block-bpquotes-quote. You can add targeted CSS in your theme:

.wp-block-bpquotes-quote {
    border-radius: 12px;
    overflow: hidden;
}

The inner quote text element has the class bpquotes-block-text.