Extra Settings: Background & HTML Code

The Extra Settings section in the Universal Wescle Block allows you to customize the background styling of a block and insert custom HTML code before or after the block content. These settings provide additional flexibility for design enhancements, custom scripts, and unique styling options.

Background Customization

The Background settings allow you to apply colors, gradients, or images to a block.

Color & Gradient Settings

Background Color – Choose a solid color for the block’s background.

Gradient Background – Enable a gradient effect with:

Linear or Radial Gradients

Customizable Angle & Direction

💡 Use gradients for a modern look, or solid colors for a clean, minimalist design.

Image Background

Upload an Image – Click Media Library to add a background image.

Paste Image URL – Use an external image link.

Fill Mode Options:

Cover – Fills the entire block, cropping as needed.

Contain – Ensures the whole image fits within the block.

Auto – Uses the image’s default dimensions.

Object Position – Adjusts the alignment of the background image.

💡 Use background images for hero sections, banners, or feature blocks.

Breakpoints & Responsive Design

Configure Breakpoints to control how the background appears on desktop, tablet, and mobile.

💡 Responsive background settings ensure the best display across all devices.

Custom HTML Code Before & After Block

The HTML Code section allows you to insert custom scripts or additional content before and after a block.

Code 1 (Before the Block)

Insert custom HTML, JavaScript, or tracking scripts before the block.

Useful for Google Analytics tags, custom animations, or additional wrappers.

Code 2 (After the Block)

Add custom footer scripts, widgets, or extra content below the block.

Useful for custom tooltips, tracking events, or interactive elements.

💡 Use this feature for custom integrations, additional tracking, or extended functionality.