Background Options (CTB)

CTB offers multiple options for bar backgrounds. In the basic plan, you can select the No Image as the background. The premium plan allows access to gradients, patterns, and images as backgrounds.

Single Colour

To use a single color as the background for the bar, select No Image under Background Style.

You can set the background to a color of your choice using the color picker.

The Background Color Opacity slider controls the opacity of the background (how transparent or 'see-through' the background color is).

For example, if you set the opacity to 0.5, the bar will be half transparent, revealing content behind the bar. 

This can be most visible while scrolling a page in your shop:

Gradient Color Premium Plan Only

The Gradient Color option allows you to use a 2 or 3 color gradient as the background.

The app provides an array of presets to choose from:

You can also customize the gradient to your liking by using the color pickers and gradient angle slider: 

To have 3 colors in your custom gradient, click on a preset option that has 3 colors to open a 3rd color picker:

Pattern Image: Premium Plan Only

The pattern image background takes a small image and repeats it, creating a pattern.

Simply click on the pattern you'd like to set as the background:

You can also load your own pattern (.jpg, .png, .gif) by dragging and dropping it into the drop zone:

Fitted Image: Premium Plan Only

The Fitted Image option allows you to use a large image and fills the width of the background.

Simply click on the image you'd like to set as the background:

You can also load your own image (.jpg, .png, .gif) by dragging and dropping it into the drop zone:

You have the option to have the image scroll up and down, adding a bit of motion to the background which can help draw attention.

The Scroll Speed setting refers to how many seconds it takes the image to fully scroll the height of the image.

For example, if you set the scroll speed to 10, the image will smoothly scroll down, taking 10 seconds to reach the bottom. The image will then scroll back up over 10 seconds.

Setting the scroll speed to 0 will keep the image still.

The fitted image is meant to be a background only and not contain main content. This option is not intended to display a premade bar with fixed dimensions.

The image will fill the width of the bar. The height of the bar is dependent on the content (message length, font size, and padding). The height of the bar cannot be set to the background content.