Heading
Heading
Welcome to the “Heading” documentation.Looking to integrate heading into your website? Our block provides stunning options to ensure your headings not only capture attention but also convey key messages effectively.
In this guide, we'll show you how to use the editor to customize your heading block.
Step 1 : Open the Editor
2. Click on "Edit" after choosing your template.
class="flex justify-center items-start h-auto w-auto" alt="">Step 2: customize the content
1. In this panel, you can easily add, remove and change your texts header as needed.
class="flex justify-center items-start h-auto w-auto" alt="">2. You can also include a fixed prefix or suffix and choose to display them on a separate line with the header.
class="flex justify-center items-start h-auto w-80" alt="">3. Additionally, you have the option to add a subtitle and adjust its size to your preference.
class="flex justify-center items-start h-auto w-80" alt="">Step 3: Configure settings
Here, you'll manage the Tabs settings.
1.You can decide if you want to put an image, choose where to put it in the page and adjust its width.
class="flex justify-center items-start h-auto w-96" alt="">2. Within the "Header" section, you have the flexibility to decide whether to display the header, customize its size separately for desktop and mobile, and fine-tune its font weight.
Furthermore, you can precisely control the speed of typing in, typing out, and set the idle times as desired.
class="flex justify-center items-start h-auto w-auto" alt="">4. Lastly, in this section, you can determine how your block will be displayed, customize its style including border, roundness, block position, width, and height. You can also fine-tune the margin to achieve the desired spacing.
class="flex justify-center items-start h-auto w-auto" alt="">Step 4: Set Up buttons
1. When it comes to buttons, you can activate each one of these two buttons, enter their labels, fine-tune their style and width, and insert the respective links.
class="h-auto w-auto" alt="">2. Additionally, in this section, you have the option to customize their roundness, choose whether to display them inline or not, and control the spacing between them as well as their text size.
class="flex justify-center items-start h-auto w-80" alt="">Step 5 : Choose Colors
In this panel, you can select your background style: whether it's an image, a color, a gradient, or transparent. Furthermore, you can customize header, button, and other theme colors to harmonize perfectly with your website's design.
class="flex justify-center items-start h-auto w-auto" alt="">Step 6 : Preview
Lastly, you can click on “Preview” to see how your heading block looks on both desktop and mobile devices. After this, you can proceed to the next step.
class="flex justify-center items-start h-auto w-auto" alt="">