Guide to components in creating the marketing page

In VITRi, we offer you a robust and flexible platform to create effective marketing pages. Through its admin panel, you can build a fully customized page using a variety of components. In this article, we explain how to make the most of these tools to create an impactful marketing page.

1. Accessing the admin panel

To get started, log in to the VITRi admin panel. From there, you will have access to a list of components on the left side of the screen. These components will allow you to design your marketing page visually and fully customized.

2. Main components

VITRi offers you three main components to start building your page. It’s important to highlight that you can only choose one of these three main components, as the system allows you to select only one for the initial structure of the page.

Main components options:

• Default component: A basic component that includes a title, a description, and a customizable action button. You can adjust the top margin and choose from various button styles.
• Visual image with header: This component includes an image that you can place to the right or left of a title and description. It also includes a customizable action button and the option to adjust the top margin.
• Visual video with header: Instead of an image, you can use a video, which you can place to the right or left of a title and description. This component also includes a customizable action button and options to adjust the spacing.

3. Secondary components

Unlike the main components, the secondary components can be freely combined. While it's not mandatory, it is recommended to use all of these components to build a complete marketing page. This will provide a richer and smoother experience for users.

Types of available secondary components:

Product features:

• By default: Includes a title, a description, and a button that allows you to create borderless tags. Each tag can have its own title and description.
• Card list: Create a list of shadow-bordered cards, each with a title and a brief description.
• Alternate image list: Allows you to alternate images with text. You can choose the position of the images (left or right) and add a title, caption, and description.

Calls to action:

• By default: Allows you to add a title, a description, and multiple action buttons arranged from left to right. You can add buttons with different URLs to encourage the user to take various actions.

Visual content:

• Header with description: Includes a title, caption, and description in a grayish tone. Ideal for dividing sections or providing additional context.
• Images with header and description: Allows you to add two images, with the option to alternate their position (left or right). Additionally, you can include a title and description for each image.
• Embedded video content: Allows you to insert a video from its URL, add a title and description, and choose the video’s position.

4. Creating a complete marketing page

Although you can only select one main component, to create a complete and effective marketing page, it is recommended to use all the available secondary components. This will not only enrich the structure of your page but also enhance the user experience, guiding them smoothly through the information.

Recommended structure for a complete marketing page:

1. Main component: Choose one from the available options (default, visual image, or visual video).
2. Product features: Add one or more components to highlight the benefits of your product (tags, cards, or alternate image list).
3. Call to action: Include action buttons to motivate users to take the desired action.
4. Visual content: Add images or videos with their respective headers and descriptions to enrich the page.

5. Customization and style

Take advantage of the available customization options to adjust margins, element layout, and button styles. This will allow you to design a page that aligns with your brand identity and provides a consistent and engaging experience for users.