BLACK FRIDAY: 50% OFF all Pro plans Code: BLACKFRIDAY50
Pro from $10 a year or $30 lifetime, no code needed: Code: BLACKFRIDAY50
Ends Cyber Monday, 30 Nov. Lock in the price today. Code: BLACKFRIDAY50
Get 50% Off

Image Accordion block guide

Pro

How to add the Image Accordion block and what every setting does. It comes with Bright Addons Blocks Pro, which also includes every free block.

Start

Add the block

Image panels side by side: the panel under the mouse grows and shows its title, text and button.

  1. Install the plugin

    Install Bright Addons Blocks Pro from your account and activate your licence. It includes every free block.
  2. Add the block

    Open a page or post in the block editor, press +, and search for “Image Accordion”. It is in the Bright Addons Pro category.
  3. Set it up

    Open the block sidebar and work through Panels, Accordion, Content and Colors.
  4. Publish

    Preview the page on desktop, tablet and phone, then publish. The block loads its own CSS and JavaScript only on pages that use it.

Panel 1 of 4

Panels

Open the block sidebar and find the Panels panel.

Setting What it does Choices
Panels A list you can add to, remove from and reorder. Each item has: image, title, description, icon (optional), button, button text, link, open link in a new tab, open by default, image focus point and own overlay color. –

Panel 2 of 4

Accordion

Open the block sidebar and find the Accordion panel.

Setting What it does Choices
Orientation Choose one. Side by side, Stacked
Stack the panels on Choose one. Never, Tablets and phones, Phones
Open on Choose one. Hover, Click
When the mouse leaves Choose one. Back to the default panel, Keep the last panel open, All panels equal
Height (px) From 150 to 900. –
Open panel size How many times wider the open panel is than a closed one. From 1.5 to 10. –
Gap (px) From 0 to 40. –
Animation speed (ms) From 200 to 1500. –
Corner radius (px) From 0 to 40. –
Image zoom on the open panel From 1 to 1.3. –

Panel 3 of 4

Content

Open the block sidebar and find the Content panel.

Setting What it does Choices
Show content Choose one. Open panel only, Always
Turned title on closed panels On or off. –
Title tag Choose one. H1, H2, H3, H4, H5, H6, div, p
Vertical position Choose one. Top, Middle, Bottom
Alignment Choose one. Left, Center, Right

Panel 4 of 4

Colors

Open the block sidebar and find the Colors panel.

Setting What it does Choices
Overlay Color picker. –
Overlay (open panel) Color picker. –
Title Color picker. –
Description Color picker. –
Icon Color picker. –
Button background Color picker. –
Button text Color picker. –

Questions

Good to know

Is the Image Accordion block free?

Image Accordion is a Pro block. It comes with Bright Addons Blocks Pro, which has the same plans and prices as Bright Addons Pro for Elementor and includes all 62 free blocks.

Do I need Elementor for this block?

No. It is a block for the WordPress block editor (Gutenberg). Elementor is not needed. If you use Bright Addons Pro for Elementor on the same site, both plugins work side by side.

Will it slow down my pages?

No. Each block loads only its own small CSS and JavaScript, and only on pages where it is used. Blocks you do not need can be switched off in Bright Blocks.

Does it work with my theme?

Yes. The blocks work with block themes and classic themes, and follow your theme fonts. Wide and full width alignment are supported.

Bright Addons Blocks

Build with every block

Blocks Pro adds 99 Pro blocks, Pro effects for every block, Theme Templates and popups to the 62 free blocks.