Block Variants

Feature Purpose:

ExpoPlatform's Block Variants feature empowers event organizers to craft dynamic, visually engaging websites without the need for coding expertise. By offering a suite of customizable blocks, each with multiple layout options, organizers can tailor their event websites to showcase exhibitors, products, speakers, sponsors, news, and brands effectively.​

The Block Variants feature serves as a modular design system within ExpoPlatform's website builder. It allows organizers to: ​

• Showcase content dynamically: Present various event elements like exhibitors and products in multiple layouts.

• Enhance user engagement: Utilize sliders, static blocks, and carousels to create interactive experiences.

• Customize displays: Adjust settings such as the number of items per row, sorting preferences, and category filters.

• Streamline website creation: Build and update event websites efficiently without relying on developers.​

Working with this Feature:

Accessing Block Variants

To utilize Block Variants:​

1. Navigate to the Admin Panel.

2. Go to Event Setup > Build Website.

3. Click on Edit Website.

4. Select Add Block and choose from the available platform blocks.​
   

Available Blocks and Their Variants

Static Content Block

Static blocks contain fixed content that doesn’t change. Common use cases include Carousel, Countdown, Download App , FAQ , Intro Block, Testimonials, Text List, Text & iframe & button, Text & video & button headers, or descriptive text that remains the same for all users.

• Example: An “About the Event” section or a “Thank You” message.

• Editing: Done directly in the block via the page builder.
  
  Screenshot highlights a static block in the page builder with title and content areas visible.

  

Dynamic Content Block

Dynamic blocks pull data automatically from the platform database. These blocks are used to show participant-specific or system-generated content.

• Example: Agendas, speaker listings, exhibitor lists, or recommended products.

• Settings: You must select the right data source (e.g., Exhibitors, Sessions).

• Note: Dynamic blocks require correct filters and sorting options.
  
  Screenshot shows a dynamic block editing modal with filters set.

  

Element Block

Element blocks add interactive or structural elements like banners, Title and subtitles .

• Use Case: Inserting a visual separator between sections.
  
  Screenshot displays a page with a visible search bar element.

  

Dev Block

Developer blocks can be used to inject custom HTML, CSS, or JavaScript directly into a page.

• Use Cases: Embedding third-party widgets, analytics scripts, or advanced custom designs.

Warning: Incorrect code here may break the layout.

Favourite Blocks

Favourite blocks are saved variants of existing blocks you use frequently.

• Purpose: Save time by avoiding repetitive configuration.

• How to Use: Mark a block as favourite by clicking on the three dots at the right hand side of the added block and click on “Add favourite Section” --- input name of choice and save. Then navigate to the favour--- input name of choice and save. Then navigate to the favourite section to see favourited blocks.

• Screenshots Show how to ‘Add favourite Section’ and the second screenshot shows how to preview it

  

CSS and JS Blocks

• Custom CSS Block: Apply custom styles across blocks or entire pages.

• Custom JS Block: Include scripts for pop-ups, event-based interactions, or dynamic calculations.

• Use Tip: Always test scripts before publishing.

Best Practices and Tips

• Use Dynamic blocks for repeatable content (e.g., Exhibitors, Speakers).

• Use Static blocks for unique page sections (e.g., Carousel, Countdown, Download App , FAQ , Intro Block, Testimonials, Text List, Text & iframe & button, etc).

• Test mobile responsiveness of blocks using the preview mode.

Troubleshooting:

If you're experiencing issues with block variants, here are some common problems and how to resolve them:

• Dynamic blocks appear empty: This usually happens when the selected data source (like Speakers or Exhibitors) doesn’t have any matching entries. Double-check that content has been added in the backend and that the filters within the block settings are configured correctly.

• Changes to static blocks aren’t showing: Ensure that you’ve saved and published both the block and the page. Sometimes updates are made but not reflected because the content wasn’t properly published.

• Dev blocks cause layout problems: If inserting custom HTML, JavaScript, or CSS causes your page layout to break or behave unexpectedly, revert to a previous working version. Use browser developer tools to inspect errors in the console and identify what’s causing the issue.

• Favourite blocks aren’t showing up: This might be due to the block not being saved properly and ensure it was saved as a favourite under the correct conditions.

• Custom CSS isn’t applying as expected: Make sure that the CSS selectors you’ve written match the structure of the HTML elements. Also, check whether other styles are overriding your custom styles. Using browser inspection tools can help you troubleshoot these conflicts.