The business hours widget gives you an easy way to set up your working hours in a clean manner. Choose from different layouts, customize the text properties, and enable various options like the odd & even rows styling and the dynamic styling.
Lets go over the details of this amazing widget.
This section is going to be used to define the list of your working days. You can click on add item at the bottom of this section add a new element to the list.
Under the styling tab section, you can change the text properties, colors, and enable various functionalities.
Choose a layout style and setup a row separator for your business hours widget.
-Layout Style : Choose one of the four layout styles available.
-Row Padding : Control the rows inner space by changing the row padding values.
-Enable Row Border : Enable this if you want to use a row border as a separator.
-Border size : Change the border width using this control.
-Border Style & Color : Choose a style for your border and customize its color.
Customize the text properties for the day and time elements. Change the font size, letter spacing... choose from hundreds of Google font families.
-Colors : Customize the color of your text elements to create a suitable design.
Enable the Odd & Even Rows if you want to use a custom style for odd rows and a different style for the even rows.
-Odd & Even : Select which type of rows you want to style. The remaining options will only affect the selected row type.
-Colors : Customize the the text and background colors for both the date and time texts.
Enable the dynamic styling if you want to use a custom style for the current day. This style will be automatically applied to the present day.
-Dynamic Decoration : Choose a decoration for the present day. You can also choose none if you don't want to use this option.
-Decoration Position : Position the decoration to either the left or the right of the row.
-Decoration Size : Change the decoration size. The options available are small, medium, and large.
-Decoration Color : Choose a color for your decoration.
If you can't find what you are looking for any our documentation website, please feel free to open a support ticket & get help from our support team.