How to style labels with Live Designer?

How to style labels with Live Designer?

The appearance of the labels can be completely customized to the look of the e-shop. We will show you step by step how to create the look in Live Designer.

How Live Designer works

We have added a tool called Live Designer to Pobo Page Builder , which is designed to allow you to customize the look of your labels without any knowledge of stylesheets (CSS) or HTML. In the designer, you can customize:

  1. Size, indentation, color and line spacing of second and third level headings, paragraphs and lists.
  2. Widget spacing
  3. Detailed styling of widgets

Let's edit the first product...

Select the product you want to edit, then under the tools section, select the subsection edit the appearance of labels.

Click on any widget to open the editor in the right bar.

Within the widget you can edit the photo, title and text. You can do this by selecting the element in the right bar of the editor, or by clicking on the green pencil icon next to the element.

After selecting an element, you will see the editing options in the right bar:

  • Font size, line spacing, text color, outer indentation, font, text highlighting

By default, the modifications are applied to all widgets (e.g. image rounding, text font, etc.) If you want the modifications to apply only to an individual widget, select only that widget in the right column section.

Within the customization of an individual widget, it is also possible to set the color background of the widget, including the gradient (its color and angle).

Within Live Designer, you can also see a live preview of the site on your tablet and phone. In the top bar, just select the computer button, then the selector will open(computer, tablet mobile.) After clicking on the appropriate option, the preview will open.

To save the modification, just click the save changes button in the right corner and the design will be assigned to the product.