Get Bricksfusion BLACKFRIDAY DealUntil month-end

Documentation

v1.5.0

Transition page 006

PREVIEW
Reveal now

Presets

Classic CyanElectric PurpleNeon GreenHot PinkLaser RedOcean BlueSunny YellowLime ShockPeach Glow

What is it?

Transition Page 006 offers a captivating page loading effect, seamlessly transitioning between content with sliding panels and a dynamic neon line. Customize the neon color to match your brand, providing a vibrant visual experience for your users.

How to set it up?

To bring your transitions to life with Bricks Builder, you can easily implement the transition code in either the main menu of your site or in the footer. This way, the animation will appear on every page where the menu or footer is present.

Here’s how to do it:

  1. Go to the Menu or Footer where you want to add the transition effect.
  2. Open the Page Settings.
  3. Navigate to Custom Code.
  4. In the Body Script section, paste the transition code.

Changing the Logo

To personalize the logo displayed during the transition, follow these simple steps:

  1. Find the line in the code that reads const logoUrl = 'https://example.com/path/to/your/logo.png';.
  2. Change the URL to the link of your own logo image. Ensure that the logo is hosted online and is accessible.
  3. Save your changes, and your new logo will appear in the transition the next time it’s triggered!

Change the neon Preset

To customize the neon line’s color, simply update the preset value in the code. Locate the setPreset function within the script, and adjust the index to select your desired color from the available presets. For example, using setPreset(0) will apply the ‘Classic Cyan’ color. Experiment with different indices to find the perfect look for your site!