GOM Sites

On this page, you will find all the necessary documentation to learn the basic concepts about the installation of the template, the plugins, and how it works.

 

 

 

 

This documentation has been created to help you get the most out of the GOM Sites template, making its installation, customization, and use easier. Here you will find detailed instructions to adapt the template to your needs, regardless of your level of technical experience.

 

 

 

 

To install GOM Sites, you must meet the following requirements:

  • WordPress 6.7 o superior.
  • MySQL 5.6 o superior.
  • PHP 8.2 o superior.
  • PHP Memory Limit : 512 M
  • PHP Post Max Size: 516 M
  • PHP Max Input Vars 256M
  • PHP Max Input Vars: 1000
  • Upload Max File Size: 256M
  • Max Execution Time: 300
  • Max Input Time: 300

Choose a Hosting Provider

First of all, you need a hosting provider to store the files of your website. Some popular options are Bluehost, SiteGround, HostGator, and Hosting GOM Network. Select a plan that suits your needs and register a domain name if you do not have one yet.

Download WordPress

Visit the official WordPress website and download the latest version of WordPress. The download will be in .zip file format.

Upload WordPress to Your Hosting Account

For more information on how to upload and install WordPress on your hosting, you can visit the official WordPress documentation.

Log in to Your Envato Account

Open your web browser and go to ThemeForest. Click on the Log In button in the upper right corner of the page. Enter your ThemeForest username and password, then click “Log In”.

Find the Template You Purchased

Hover over your username in the upper right corner to open a dropdown menu. Click on “Downloads” in the dropdown menu. Find the item you want to download. Next to the item, click on the “Download” button. A dropdown menu will appear.

Download the File

Select “Installable WordPress file only” to get the theme .zip file, or “All files & documentation” if you need the full package, including additional files. The selected file will start downloading to your computer. Choose a location on your computer where you want to save the downloaded file. Make sure the download is complete and that the file is saved correctly.

For more information on how to download the template, you can visit the official ThemeForest documentation.

Access Your WordPress Control Panel

Log in to your WordPress admin panel. Note: It is usually located at yourdomain.com/wp-admin.

Upload the Theme

Go to Appearance » Themes and click the “Add New” button at the top of the page. You will be prompted to choose a file. Browse to the theme .zip file downloaded from ThemeForest  and select it. Once done, click the “Install Now” button.

Activate the Theme

WordPress may take a few minutes to upload and install the file. Once completed, you will receive a message indicating that the theme installation was successful. Click the “Activate” button to activate the theme on your website.

For more information on how to activate the child theme of the template, you can visit the official WordPress documentation.

Enter your purchase code

From the WordPress dashboard, go to “GOM Site Theme” — this will take you to the GOM Site dashboard. In this module, you will see three sections: “Licence code,” “System info,” and “Help center.”

We will go to the first section called “Licence code”. It will have a text field where you must enter the license code.

GOM Site

Note: If you do not enter the license when accessing “GOM Site Theme”, not all available modules will be displayed.

GOM Site sin codigo

Activate license

Click on the button “Activate license” to save the changes and be able to see the other modules that “GOM Site Theme” has to offer you.

When the theme has been successfully installed, a message will appear indicating that you need to install a series of required plugins for the theme to function correctly. The message will be:

This theme requires the following plugins: Elementor, Envato Market, GOM Tools Elementor Addons, and One Click Demo Import.
This theme recommends the following plugins: Contact Form 7, WP Super Cache, WPS Hide Login, and Yoast SEO.
Begin installing plugins | Dismiss this notice

These same plugins are included in the theme installation package, and you can find them after installing the “GOM Sites” theme in the left sidebar of the WordPress dashboard by searching for “GOM Sites Theme”.

GOM Sites Theme Module

Press “Install Plugins”, and it will take you to the module where you will find a list of all the required plugins for the theme. At the top, you will have actions that you can perform on the list:

Bulk Actions: You can perform multiple actions on the list at the same time instead of doing them one by one.

The plugins displayed in the list will include both the required ones for the theme’s functionality and additional details such as “Source”, “Type”, “Version”, and “Status”.

Plugins in the List

  • GOM Tools Elementor Addons – GOM Network add-ons for the Elementor plugin.
  • Elementor – The Elementor website builder has it all: drag-and-drop page builder, pixel-perfect design, mobile-responsive editing, and much more. Start now!
  • Contact Form 7 – Another contact form plugin. Simple but flexible.
  • Envato Market – This plugin helps customers receive updates for their purchased premium themes and plugins through Envato Market (ThemeForest and CodeCanyon).

Plugin Installation

Below each plugin title, there will be an “Install” button. You must press it, and the installation process will begin. Once the installation is complete, you will return to the plugin list module. Then, where the “Install” button was previously located, the “Activate” button will appear. Press it, and the plugin will be activated on your site.

Note: If an error occurs when trying to install all plugins using Bulk Actions, try installing them one by one.

Find Your Purchase Code

Go to this Envato help guide to find your purchase code: Where is my purchase code?

Enter Your Purchase Code

From the WordPress dashboard, go to “Your Theme” » “Control Panel”. In the “Purchase Code” field, enter your purchase code.

Activate License

Click the “Activate License” button to save the changes.

What Plugins Are Required?

  • GOM Tools Elementor Addons: GOM Network add-ons for the Elementor plugin.
  • Elementor: The Elementor website builder has it all: drag-and-drop page builder, pixel-perfect design, mobile-responsive editing, and much more. Start now!
  • One Click Demo Import: The best feature of this plugin is that theme authors can define import files in their themes; all you (the theme user) have to do is click the “Import Sample Data” button.
  • Envato Market: This plugin helps customers receive updates for their purchased premium themes and plugins through Envato Market (ThemeForest and CodeCanyon).

Recommended Plugins

  • WPS Hide Login: Protect your website by changing the login URL and preventing access to the wp-login.php page and the wpadmin directory while logged out.
  • WP Super Cache: A very fast caching engine for WordPress that generates static HTML files.
  • Yoast SEO: Improve your WordPress SEO: write better content and have a fully optimized WordPress site using the Yoast SEO plugin.
  • Contact Form 7:  Another contact form plugin. Simple but flexible.

Plugin Modes

There are two modes in OCDI: manual import and predefined demos. In manual import mode, you can select the types of content you want to import by uploading the corresponding files. Predefined demos mode allows you to select one of the demos prepared by the theme authors. The second mode is only available if the theme authors have integrated it with the OCDI plugin.

Available Demos

GOM Site is constantly growing and offers a variety of pre-configured demos to facilitate the creation of attractive and functional websites. These demos include modern and optimized designs for different sectors, such as blogs, online stores, portfolios, and landing pages. Each demo is designed with customization options, compatibility with visual editors, and optimized performance for SEO and speed.

Importar demo

 

Once you select the demo to import, you will be taken to the next step: Plugin installation.

importar demo 1

You will see the list of required and recommended plugins for the demo.The required plugins will have a lock icon next to them and cannot be unchecked. The theme requires these plugins to function correctly, so they must be installed before starting the import process.

The plugins without the lock icon are recommended and can be checked or unchecked as desired. Plugins with a green checkmark are already installed and activated.

Select the plugins you want to install and click the “Continue & Import” button. Before the content import begins, the selected plugins will be installed.

Information

If a plugin fails to install, an error message will appear below, and the import process will not start. You can reselect it and try again by clicking the “Continue & Import” button.

If the problem persists, install and activate the plugin manually, then return to this step to continue with the import.

Once all the selected plugins are successfully installed, the import process will begin.

Manual Import

If the theme you are using does not have an OCDI integration, you will see the Manual Import page.

one click demo one click demo 1

 

Here you can select files to import different types of content. The content you can download includes:

  • Template
  • License
  • Plugins

Once the desired files are selected, click the “Continue & Import” button. This will take you to the import process.

Information about Elementor styles

First of all, you must download the theme zip which contains three files called “demos”, “gom-site”, “gom-site-child”.

GOM Site file

When the theme is installed and you have activated the license, you must import the Elementor styles, the styles are located in the folder “demos”.

estilos de elementor 1

When entering, another folder will be shown called “Theme 1 – Services”.

Estilo de elementor 2

Upon entering said folder, it will show you several files which you must install manually to the GOM Site theme.

Estilo elementor 3

Installation of the file demo-theme5-content.xml

You must go to the manual import option and go to the module called “Manual Demo File Import” and click on the option “Import Content”, then you must look for the aforementioned file inside the folder “Theme 1 – Services”.

importar content

Installation of the file demo-theme5-widgets.wie

You must go to the manual import option and go to the module called “Manual Demo File Import” and click on the option “Import Widgets”, then you must look for the aforementioned file inside the folder “Theme 1 – Services”.

importar wifgets

Installation of the file demo-theme5-customizer.dat

You must go to the manual import option and go to the module called “Manual Demo File Import” and click on the option “Import Customizer”, then you must look for the aforementioned file inside the folder “Theme 1 – Services”.

importar customizer

Installation of the zip file demo-theme5-elementor-kit

For the installation of this zip, you must go to the “Elementor” module and then to the “Tools” option. Several options will appear at the top of the page. You must click on “Import/Export Kit”. This module will show you two options to choose from: the first “Export a Template Kit” and “Import a Template Kit”. You must click on “Import a Template Kit”.

importar estilo elementor

When clicking the “Start Import” button, it will take you to another module where you must upload the zip file.

importar estilo elementor 1

When uploading the file, it will show you a notification message; you must click the “Continue” button.

importar estilo elementor 2

The file will be uploaded and another screen will appear with the information of the uploaded file; you must click the “Next” button to continue.

importar estilo elementor 3

Finally, it will show you all the settings that the zip file will import into the website; you must click the “Import” button to finish loading the style.

importar estilo elementor 4

Import Process

Once the import process begins, you will see the content import screen.

one click demo 2

 

If everything went well, you will see the message “Import completed successfully”.

Importación exitosa

If an import issue arises, you will see a warning screen. This means that most of the import was completed successfully, but some content elements could not be imported.

The list of these failed elements will be displayed on the results page, along with a link to a more detailed error log file.

In that file, you will find more information about the errors (for each type of import: content, widgets, customizer, etc.), the import files used, and more.

 

importar demo 1

How to Get Updates

To receive theme updates, you must install the Envato Market plugin for WordPress. This plugin helps customers receive theme updates quickly and securely.

The installation of this plugin will be prompted directly in the WordPress dashboard after installing the theme. You can also install it manually if you prefer.

Plugin Setup:

Log in to Your Envato Account

Open your web browser and go to ThemeForest.. Click the “Log In” button in the upper right corner of the page. Enter your ThemeForest username and password, then click “Log In”.

Create a Token

Go to this link to generate your personal Envato API token.

Adjust Token Options

First, name the token, for example: “My WordPress Site”. Make sure the following permissions are enabled:

  • View and search Envato sites
  • Download your purchased items
  • List the purchases you have made

Copy the Token

Accept the terms, click the “Create Token” button, and copy the generated token.

Paste the Token

From the WordPress dashboard, go to the “Envato Market Plugin” and paste your token into the field that says “Enter your Envato personal API token”, then click the “Save Changes” button.

How It Works

Once the connection to the Envato API is established in the plugin settings page, a list of available themes will be displayed.

This list will show all WordPress themes that were purchased through Envato Market/ThemeForest.

Any available theme updates can be applied here, in the standard WordPress update page, or via WP-CLI.

You can read the official documentation here.

Guide to Customizing and Managing Your Pages and Elements

In this section, we will explain in detail how to customize and configure the different pages and elements of the GOM Site theme to suit your needs.

You will learn how to modify the structure, design, and key functionalities of each page, from “Headers” to “Footers” or “Templates” you want to include.

Additionally, we will show you how to edit and reorganize content blocks using the Elementor visual editor.

By following these instructions, you will be able to adjust the template efficiently and professionally, ensuring that your website looks attractive, functional, and aligned with your brand identity.

Next, we explain all the functions offered by the header section in GOM Tool Elementor Addons

First, go to the left sidebar in the WordPress dashboard and look for “GOM Tool Elementor Addons”. This will display several options, which are:

  • GOM Tool Elementor Addons: Main module of the plugin.
  • Theme Headers: Module where the list of created headers is displayed.
  • Theme Footers: Module where the list of created footers is displayed.
  • Theme Templates: Module where the list of created templates is displayed.

Theme Headers Module

When you hover over “GOM Tool Elementor Addons”, it will show four options to choose from:

  • GOM Tool Elementor Addons
  • Theme Headers
  • Theme Footers
  • Theme Templates

You must click on “Theme Headers”, and it will take you to the module where the list of created headers is displayed.

At the top of this list, you will find several actions you can perform:

  • Bulk Actions
  • Filter
  • Search Theme Headers

Additionally, you will see the “New Theme Header” button, which will take you to the module where you can create new headers.

Functionality of Each Option:

  • Bulk Actions: Allows you to perform multiple actions on the list at the same time instead of doing them one by one.
  • Filter: Enables you to refine, segment, or limit the list display based on specific criteria.
  • Search Theme Headers: Allows you to precisely search for a created header.
  • New Theme Header: Redirects you to the module to create a new header.

Creating a Header

Once inside the “Theme Headers” module, go to the top section, where you will find the “New Theme Header” button. Clicking it will redirect you to the “New Theme Headers” module.

The first thing you will see in this module is the field where you enter the header title.

To the right, you will find the “Post Attributes” field, which contains several options:

  • Elementor Canvas
  • Elementor Full Width
  • GOM Tools Elementor Footer
  • GOM Tools Elementor Full Width
  • GOM Tools Elementor Full Header
  • Theme

Expand the available options in the field and select “GOM Tool Elementor Headers”. This ensures that the created page is displayed correctly on your website.

After selecting “GOM Tool Elementor Header”, enter the title and press the “Publish” button. Once published, click the “Edit with Elementor” button.

This will take you to the Elementor editor, where you can customize your header in the style you prefer.

Below, we explain all the functions offered by the widgets for your header

Once you are in the Elementor editor, you will see a left sidebar with a list of elements that you can add to your design.

You will find Elementor’s own elements and GOM Tools elements, which are divided into various categories depending on the section you want to create on your website.

In this case, we will explain the widgets for creating your header. First, go to the category named “GOM Tools – Header & Footer”. In that category, you will see two widgets:

  • Navbar
  • Links List

GOM Tools header & footer

Navbar Widget

This widget allows you to create and configure the header of your website. It enables you to add and edit the logo design, menu for desktop and mobile, search bar, and a button.

Header & footer - navbar

Navbar Widget Settings

Once you have added the header to your design, you can customize it according to your needs and preferences.

You can add a logo, menus, submenus, a search bar, buttons, and change colors, fonts, styles, links, and more.

We offer various advanced customization options for the header so that you have complete control over the appearance and behavior of your header.

All Elementor content is divided into “Content” and “Style”. Below, we explain each of them and their respective sections for editing the header:

Content:

Display Options:

  • Layout Style: Field to select the default navbar style (Basic).
  • Scroll Mode: Dropdown field to define the navbar behavior. Options: “Static” or “Fixed”.
  • Logo: Button to enable or disable the logo in your header.
  • Site Title: Button to enable or disable the site title in your header.
  • Menu: Button to enable or disable the menu in your header.
  • Search Bar: Button to enable or disable the search bar in your header.
  • Button: Button to enable or disable a custom button in your header.

Logo:

  • Default Logo: Button to enable or disable the default theme logo or upload a custom logo.
  • Alignment: Field to set the alignment of the logo. Options: Right, Center, Left.
  • Width: Field to adjust the width of the logo area.
  • Main Logo / Mobile Logo: Buttons to select the logo for desktop and mobile views.
  • Select Main Logo / Select Mobile Logo: Options to select the logo for the template.
  • Logo Sizes – Width: Field to adjust the logo width.

Menu:

  • Menu Desktop: Field to select the menu to display in the header for desktop.
  • Alignment: Field to adjust the menu alignment (Right, Center, Left).
  • Menu Mobile: Field to select the menu to display in the mobile header.
  • Alignment: Field to adjust the mobile menu alignment (Right, Center, Left).
  • Menu Sizes – Width: Field to adjust the menu width.

Search Bar:

  • Alignment: Field to adjust the alignment of the search bar (Right, Center, Left).
  • Width: Field to adjust the width of the search bar area.
  • Search Field Placeholder: Field to edit the placeholder text shown in the search box.
  • Form Redirect URL: Field to edit the URL where users will be redirected after submitting a search.

Button:

  • Link: Field to set the button link to redirect users to another section or external resource.
  • Label: Field to edit the button label.
  • Icon: Field to add an icon next to the button text.
  • Width: Field to adjust the width of the button area.

Style:

Header:

  • Padding: Field to adjust the padding. Available for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin. Available for Top, Right, Bottom, Left.

Navbar:

  • Background Color: Field to set the background color of the navbar. On the right, there is a button to select global colors or a custom color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin for Top, Right, Bottom, Left.

Menu:

  • Background Color: Field to set the background color of the menu.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.

Menu Items:

  • Normal / Hover: Field to adjust styles for normal and hover states.
  • Background Color: Field to set the background color of the menu items.
  • Text Color: Field to set the text color of the menu items.
  • Typography: Field to customize the font family, size, weight, and style.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.
  • Border Color: Field to set the border color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin for Top, Right, Bottom, Left.

Sub Menu:

  • Width: Field to set the submenu width.
  • Background Color: Field to set the submenu background color.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.
  • Border Color: Field to set the border color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.

Mobile Menu:

  • Background Color: Field to set the mobile menu background color.
  • Padding: Field to adjust the mobile menu padding for Top, Right, Bottom, Left.
  • Menu Mobile Trigger: Field to customize the mobile menu toggle design (Normal, Active, Open).
  • Icon Size: Field to adjust the icon size of the mobile menu toggle.
  • Toggle Icon Color: Field to set the toggle icon color.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.

Search Bar:

  • Search Form Trigger: Customize the design and styles for the normal and hover states.
  • Background Color: Field to set the search bar background color.
  • Icon Size: Field to adjust the search icon size.
  • Toggle Icon Color: Field to set the toggle icon color.
  • Border, Border Radius, and Border Color: Customize the search bar borders.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Header & Footer”, make sure to save the changes. You can do this by clicking the “Save” button at the bottom of the editor.

Below, we explain all the functions offered by the footer section in GOM Tool Elementor Addons

First, go to the left sidebar in the WordPress dashboard and look for “GOM Tool Elementor Addons”. This will display several options, which are:

  • GOM Tool Elementor Addons: Main module of the plugin.
  • Theme Headers: Module where the list of created headers is displayed.
  • Theme Footers: Module where the list of created footers is displayed.
  • Theme Templates: Module where the list of created templates is displayed.

Theme Footers Module

When you hover over “GOM Tool Elementor Addons”, it will show four options to choose from:

  • GOM Tool Elementor Addons
  • Theme Headers
  • Theme Footers
  • Theme Templates

You must click on “Theme Footers”, and it will take you to the module where the list of created footers is displayed.

At the top of this list, you will find several actions you can perform:

  • Bulk Actions
  • Filter
  • Search Theme Footers

Additionally, you will see the “New Theme Footer” button, which will take you to the module where you can create new footers.

Functionality of Each Option:

  • Bulk Actions: Allows you to perform multiple actions on the list at the same time instead of doing them one by one.
  • Filter: Enables you to refine, segment, or limit the list display based on specific criteria.
  • Search Theme Footer: Allows you to precisely search for a created footer.
  • New Theme Footer: Redirects you to the module to create a new footer.

Creating a Footer

Once inside the “Theme Footers” module, go to the top section, where you will find the “New Theme Footer” button. Clicking it will redirect you to the “New Theme Footer” module.

The first thing you will see in this module is the field where you enter the footer title.

To the right, you will find the “Post Attributes” field, which contains several options:

  • Elementor Canvas
  • Elementor Full Width
  • GOM Tools Elementor Footer
  • GOM Tools Elementor Full Width
  • GOM Tools Elementor Full Header
  • Theme

Expand the available options in the field and select “GOM Tool Elementor Footer”. This ensures that the created page is displayed correctly on your website.

After selecting “GOM Tool Elementor Footer”, enter the title and press the “Publish” button. Once published, click the “Edit with Elementor” button.

This will take you to the Elementor editor, where you can customize your footer in the style you prefer.

Below, we explain all the functions offered by the widgets for your footer

Once you are in the Elementor editor, you will see a left sidebar with a list of elements that you can add to your design.

You will find Elementor’s own elements and GOM Tools elements, which are divided into various categories depending on the section you want to create on your website.

In this case, we will explain the widgets for creating your footer. First, go to the category named “GOM Tools – Header & Footer”. In that category, you will see two widgets:

  • Navbar
  • Links List

GOM Tools header & footer

Links List Widget

This widget, as its name suggests, allows you to create lists of links (such as the lists found in footers) to help users navigate your website.

Header & footer - links list

Links List Widget Settings

Once you have added the list of links to your design, you can customize it according to your needs and preferences.

You can change colors, fonts, styles, links, and more.

We offer various advanced customization options for the link list, so you have complete control over its appearance and behavior.

All Elementor content is divided into “Content” and “Style”. Below, we explain each of them and their respective sections for editing the footer:

Content:

Links

  • Item: Displays the “Add Item” button. Clicking it will open a new section where you can edit link information for the list, including:
    • Label: Field to edit the text label that will be displayed for the link.
    • Link: Field to edit the URL where the link will direct users.
    • Icon: Field to add an icon to the link.

You can continue adding more links by clicking the “Add Item” button or duplicate an existing link by clicking the button on the right side of the section under the “Item Title”.

Style:

Links

  • List Style: Field to edit the style of the list.
  • List Direction: Field to set the list direction (Default or Inline).
  • Vertical Alignment: Field to adjust the vertical positioning of the list.
  • Horizontal Alignment: Field to adjust the horizontal positioning of the list.
  • Background Color: Field to set the background color of the list.
  • Text Color: Field to set the text color of the links.
  • Typography: Field to customize the font family, size, weight, and style.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.
  • Border Color: Field to set the border color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin for Top, Right, Bottom, Left.

Items

  • Normal / Hover: Field to adjust styles for normal and hover states.
  • Vertical Alignment: Field to adjust the vertical positioning of items.
  • Horizontal Alignment: Field to adjust the horizontal positioning of items.
  • Container Width: Field to adjust the width of the container where the item is located.
  • Width: Field to adjust the width of the item space.
  • Background Color: Field to set the background color of the item.
  • Text Color: Field to set the text color of the item.
  • Typography: Field to customize the font family, size, weight, and style.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.
  • Border Color: Field to set the border color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin for Top, Right, Bottom, Left.

Icons

  • Normal / Hover: Field to adjust styles for normal and hover states.
  • Width: Field to adjust the width of the icon space.
  • Background Color: Field to set the background color of the icon.
  • Icon Color: Field to set the icon color.
  • Border: Field to adjust the border for Top, Right, Bottom, Left.
  • Border Radius: Field to set the border radius.
  • Border Color: Field to set the border color.
  • Padding: Field to adjust the padding for Top, Right, Bottom, Left.
  • Margin: Field to adjust the margin for Top, Right, Bottom, Left.

Save and Publish Your Design

Once you have created your custom footer design with “GOM Tools – Header & Footer”, make sure to save the changes.

You can do this by clicking the “Save” button at the bottom of the editor.

Below, we explain all the functions offered by the template section in GOM Tool Elementor Addons

First, go to the left sidebar in the WordPress dashboard and look for “GOM Tool Elementor Addons”. This will display several options, which are:

  • GOM Tool Elementor Addons: Main module of the plugin.
  • Theme Headers: Module where the list of created headers is displayed.
  • Theme Footers: Module where the list of created footers is displayed.
  • Theme Templates: Module where the list of created templates is displayed.

Theme Templates Module

When you hover over “GOM Tool Elementor Addons”, it will show four options to choose from:

  • GOM Tool Elementor Addons
  • Theme Headers
  • Theme Footers
  • Theme Templates

You must click on “Theme Templates”, and it will take you to the module where the list of created templates is displayed.

At the top of this list, you will find several actions you can perform:

  • Bulk Actions
  • Filter
  • Search Theme Templates

Additionally, you will see the “New Theme Template” button, which will take you to the module where you can create new templates.

Functionality of Each Option:

  • Bulk Actions: Allows you to perform multiple actions on the list at the same time instead of doing them one by one.
  • Filter: Enables you to refine, segment, or limit the list display based on specific criteria.
  • Search Theme Templates: Allows you to precisely search for a created template.
  • New Theme Template: Redirects you to the module to create a new template.

Creating a Template

Once inside the “Theme Templates” module, go to the top section, where you will find the “New Theme Template” button. Clicking it will redirect you to the “New Theme Template” module.

This time, you must first select the type of template you want to create.

Go to the “Settings” field, which is located on the right side of the module, and expand the options to choose the template type you want to create. The available options are:

  • Search: The page template for search results within your website.
  • Blog: The layout template that defines the appearance and structure of your blog.
  • Categories: The specific template for category pages on your website.
  • Tags: The page that displays all posts or articles associated with a specific tag.
  • Archives: The page that displays a list of posts organized by a specific category, such as Date (monthly, yearly), Category, Tags, Author, Content Type.
  • Single Post: The individual page for an article or post on your website or blog.
  • 404: The page that appears when a user tries to access a URL that does not exist or has been removed from your website.

Once you have selected the template type you want to create, go to the “Post Attributes” field, which is located in the same column as the “Settings” field.

This field contains several options:

  • Elementor Canvas
  • Elementor Full Width
  • GOM Tools Elementor Footer
  • GOM Tools Elementor Full Width
  • GOM Tools Elementor Full Header
  • Theme

Expand the available options in the field and select “GOM Tool Elementor Full Width”.

This ensures that the created page is displayed correctly on your website.

After selecting “GOM Tool Elementor Full Width”, enter the title and press the “Publish” button.

Once published, click the “Edit with Elementor” button.

This will take you to the Elementor editor, where you can customize your template in the style you prefer.

Below, we explain all the functions offered by the GOM Tools widgets

Once you are in the Elementor editor, you will see a left sidebar with a list of elements that you can add to your design.

You will find Elementor’s own elements and GOM Tools elements, which are divided into various categories depending on the section you want to create on your website.

In this section of the documentation, we will discuss the widgets included in GOM Tool Elementor Addons, which are:

Elementor GOM Tools

  • GOM Tools – Single Post:

    • Single Post Image
    • Single Post Title
    • Single Post Content
    • Single Post Categories
    • Single Post: Related Posts
    • Single Post: Author
    • Single Post: Published Date

GOM Tools single post

  • GOM Tools – Post:

    • Posts
    • Posts Categories

GOM Tools posts

  • GOM Tools – Forms:

    • Contact Form 7

GOM Tools forms

Below, you will find them in their respective modules.

Definition of the Widget

Single Post Image: This widget allows you to add the featured image of the post to the Single Post template.

Single post image

Single Post Image Settings

Once you have added the widget to your design, you can customize it according to your needs and preferences.

You can change colors, fonts, styles, links, and more.

We offer various advanced customization options for your site, allowing you full control over the appearance and behavior of the element.

All Elementor content is divided into “Content” and “Style”. Below, we explain each of them and their respective sections for editing the header:

Content:

Image

  • Show Placeholder: This field allows you to edit the post placeholder, offering two options to select: “Yes” and “No”.
  • Image: This field allows you to select a generic image to display.
  • Image Size: This field allows you to edit the size of the image.
  • Layout Style: This field allows you to edit the style of the image, offering five options to select:
    • “1/1”
    • “16/9”
    • “2/3”
    • “4/3”
    • “21/9”
  • Skip Lazy Load: This field allows you to load the image immediately instead of waiting until the user sees it on the screen.
  • Post Image Width: This field allows you to edit the width of the post image.

Style:

Image

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select global colors or a custom color.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select global colors or a custom color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Single Post”, make sure to save the changes.

You can do this by clicking the “Save” button at the bottom of the editor.

Definition of the Widget

Single Post Title: This widget allows you to add the post title to the template.

Single post title

Single Post Title Settings

Once you have added the widget to your design, you can customize it according to your needs and preferences.

You can change colors, fonts, styles, links, and more.

We offer various advanced customization options for your site, allowing you full control over the appearance and behavior of the element.

All Elementor content is divided into “Content” and “Style”. Below, we explain each of them and their respective sections for editing the header:

Content:

Title

  • HTML Tag: This field allows you to edit the HTML tag of the title. You can select from H1 to H6.

Style:

Title

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select global colors or a custom color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select global colors or a custom color.
  • Typography: This field allows you to customize the font family, size, weight, and style. On the right, there is a button to select the global typography of the page or manually edit the font settings.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select global colors or a custom color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Single Post”, make sure to save the changes.

You can do this by clicking the “Save” button at the bottom of the editor.

Definition of the Widget

Single Post Content: This widget allows you to add the post content to the template.

Single post content

Single Post Content Settings

Once you have added the widget to your design, you can customize it according to your needs and preferences.

You can change colors, fonts, styles, links, and more.

We offer various advanced customization options for your site, allowing you full control over the appearance and behavior of the element.

All Elementor content is divided into “Content” and “Style”. Below, we explain each of them and their respective sections for editing the header:

Content:

Style:

Content

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select global colors or a custom color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select global colors or a custom color.
  • Typography: This field allows you to customize the font family, size, weight, and style. On the right, there is a button to select the global typography of the page or manually edit the font settings.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select global colors or a custom color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H1

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H2

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H3

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H4

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H5

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

H6

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Paragraphs

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Bold Text

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Links

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Lists

  • Unordered List Style: This field allows you to edit the style of the unordered list.
  • Ordered List Style: This field allows you to edit the style of the ordered list.
  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • List Items
    • Background Color: This field allows you to edit the background color of the element. On the right, you will find a button to select the global colors of the page or choose a specific color.
    • Text Color: This field allows you to edit the text color. On the right, you will find a button to select the global colors of the page or choose a specific color.
    • Typography: This field allows you to edit the typography of the element. On the right, you will find a button to select the global typography of the page or manually edit the font family, size, weight, and style.
    • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
    • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
    • Border Color: This field allows you to edit the border color. On the right, you will find a button to select the global colors of the page or choose a specific color.
    • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
    • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Blockquote

  • Background Color: This field allows you to edit the background color of the element. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, there is a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, there is a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Iframe

  • Width: This field allows you to edit the width of the space where the Iframe is located.
  • Height: This field allows you to edit the height of the space where the Iframe is located.
  • Background Color: This field allows you to edit the background color of the element. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, you will find a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Single Post”, make sure to save the changes.

You can do this by clicking the “Save” button at the bottom of the editor.

Widget Definition

Single post categories: This widget allows you to add the categories of single posts in the template.

Single post categories

Single Post Configurations: Single Post Categories

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options for your site, allowing you full control over the appearance and behavior of the element.

All Elementor content is divided into “Content” and “Style”, and we will explain each of them and their respective sections for editing the header.

Content:

Categories

  • Order by: This field allows you to edit the order of the categories by “Name”, “ID”, or “Slug” (ordering by the readable structure of a URL).
  • Order: This field allows you to edit how categories are displayed. The options are “Ascending” or “Descending”.

Style:

Categories List

  • Categories List Style: This field allows you to edit the category style. The available options are “Default” or “None”.
  • Categories List Direction: This field allows you to edit the category direction. The available options are “Default” or “Inline”.
  • List Width: This field allows you to edit the width of the category list.
  • Vertical Alignment: This field allows you to edit the vertical positioning of the category list.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of the category list.
  • Background Color: This field allows you to edit the background color of the element. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Items

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Vertical Alignment: This field allows you to edit the vertical positioning of the items.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of the items.
  • Text Alignment: This field allows you to edit the text alignment. You can choose between “Right”, “Center”, and “Left”.
  • Container Width: This field allows you to edit the width of the container where the item is located.
  • Width: This field allows you to edit the width of the space where the element is located.
  • Background Color: This field allows you to edit the background color of the element. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right, you will find a button to select the global typography of the page or manually edit the font family, size, weight, and style.
  • Border: This field allows you to edit the border, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, you will find a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options to modify: “Top”, “Right”, “Bottom”, “Left”.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Single Post”, make sure to save the changes. You can do this by clicking the “Save” button at the bottom of the editor.

Widget Definition

Single post: Related posts – This widget allows you to add related posts to the template.

Single post related posts

Single Post Configurations: Single Post Related Posts

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options for your site, allowing you full control over the appearance and behavior of the element.

All Elementor content is divided into “Content” and “Style”, and we will explain each of them and their respective sections for editing the header.

Content:

Display Options

  • Posts: Button that you can enable or disable to display related posts.
  • Pagination: Button that you can enable or disable to display pagination.

Posts

  • Layout Style: Field to select the style of the posts, with two options: “List” or “Grid”.
  • Posts to Show: Field to select the number of posts you want to display.
  • Order: This field allows you to edit the order in which posts are displayed. Options are “Ascending” or “Descending”.
  • Order by: This field allows you to edit the order of posts by “Name”, “ID”, or “Slug” (ordering by the readable structure of a URL).
  • Post Body Width: This field allows you to edit the width of the post body.
  • Show Post Image: Button that you can enable or disable to display the post image.
  • Image Size: This field allows you to edit the size of the image.
  • Layout Style: This field allows you to edit the image style, offering five options: “1/1”, “16/9”, “2/3”, “4/3”, and “21/9”.
  • Post Image Width: This field allows you to edit the width of the post image.
  • Show Post Categories: Button that you can enable or disable to display the post categories.
  • Show Post Share Button: Button that you can enable or disable to display the post share button.
  • Message for Share Button: This field allows you to edit a custom message that appears when sharing.
  • Show Post Title: Button that you can enable or disable to display the post title.
  • Title Tag: This field allows you to edit the HTML tag of the title, with options ranging from H1 to H6.
  • Truncate Title: This field allows you to edit the number of characters for truncating the title displayed in the post.
  • Show Post Excerpt: Button that you can enable or disable to display a post excerpt.
  • Truncate Excerpt: This field allows you to edit the number of characters for truncating the excerpt displayed in the post.
  • Show Post Description: Button that you can enable or disable to display the post description.
  • Truncate Description: This field allows you to edit the number of characters for truncating the description displayed in the post.
  • Show Post Call to Action: Button that you can enable or disable to display a CTA button in the post.
  • CTA Label: Edits the CTA button label.
  • CTA Target: This field allows you to edit the type of redirection when clicking the CTA button, with two options: “Same Window” or “Other Window”.
  • Show Post Published Date: Button that you can enable or disable to display the post’s publication date.

Style:

Post

  • Background Color: This field allows you to edit the background color of the element. On the right, you will find a button to select global page colors or choose a custom color.
  • Border: This field allows you to edit the border, with four options: “Top”, “Right”, “Bottom”, “Left”.
  • Border Radius: This field allows you to edit the border radius, with four options: “Top”, “Right”, “Bottom”, “Left”.
  • Border Color: This field allows you to edit the border color. On the right, you will find a button to select global page colors or choose a custom color.
  • Padding: This field allows you to edit the padding, with four options: “Top”, “Right”, “Bottom”, “Left”.
  • Margin: This field allows you to edit the margin, with four options: “Top”, “Right”, “Bottom”, “Left”.

Image

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Border: This field allows you to edit the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.

Categories

  • Normal/Hover: This field allows you to edit the design and styles differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.

Title

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are, “Top”, “Right”, “Bottom”, and “Left”.

Excerpt

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Description

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

CTA

  • Normal/Hover: This field allows you to edit the design and styles differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Width: This field allows you to edit the width of the space where the element is located.
  • Alignment: This field allows you to edit the alignment of the CTA, you can choose “Right”, “Center”, and “Left”.
  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Published Date

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Share

  • Normal/Hover: This field allows you to edit the design and styles differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Width: This field allows you to edit the width of the space where the element is located.
  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Icon Color: This field allows you to edit the icon color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Icon Width: This field allows you to edit the icon width.
  • Alignment: This field allows you to edit the text alignment of the icon, you can choose “Right”, “Center”, and “Left”.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Pagination

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Alignment: This field allows you to edit the alignment of the paginator, you can choose “Right”, “Center”, and “Left”.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Pagination Numbers:
    • Normal/Hover: This field allows you to edit the design and styles differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
    • Width: This field allows you to edit the width of the space where the pagination numbers are located.
    • Height: This field allows you to edit the height of the space where the pagination numbers are located.
    • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a particular color.
    • Text Color: This field allows you to edit the text color, on the right side you will have a button to select the global colors of the page or select a particular color.
    • Typography: This field allows you to edit the typography of the element, on the right side you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
    • Alignment: This field allows you to edit the alignment of the pagination numbers, you can choose “Right”, “Center”, and “Left”.
    • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
    • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
    • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a particular color.
    • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
    • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”.

Save and Publish Your Design

Once you have created your customized design with “GOM Tools – Single post”, make sure to save the changes. You can do this by clicking on the “Save” button at the bottom of the editor.

Widget Definition

Single post: Author: This widget allows you to add the post author in the template.

Single post author

Single post configuration: Single post author

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options that you may need for your site, allowing you to have full control over the appearance and behavior of the element.

All Elementor contents are divided into “Content” and “Style”. We will explain each of them and their respective section for editing the header.

Content:

Author

  • Show Author Avatar: This field allows you to edit the option if you want the author’s avatar to be displayed. You will have two options to select: “Yes” or “No”.
  • Avatar Size: This field allows you to edit the size of the author’s avatar.

Style:

Avatar

  • Width: This field allows you to edit the width of the space where the avatar is located.
  • Background Color: This field allows you to edit the background color of the element, on the right side, you will have a button to select the global colors of the page or select a particular color.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”.

Display Name

  • Width: This field allows you to edit the width of the space where the avatar name is located.
  • Background Color: This field allows you to edit the background color of the element, on the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color, on the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element, on the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”.

Save and Publish Your Design

Once you have created your customized design with “GOM Tools – Single post”, make sure to save the changes. You can do this by clicking on the “Save” button at the bottom of the editor.

Widget Definition

Single post: Published date: This widget allows you to add the post’s publication date in the template.

Single post published date

Single post configuration: Single post published date

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options that you may need for your site, allowing you to have full control over the appearance and behavior of the element.

All Elementor contents are divided into “Content” and “Style”. We will explain each of them and their respective sections for editing the header.

Content:

Published Data

  • Date Format: This field allows you to edit the date format.
  • Date Text: This field allows you to edit the text you want to appear next to the publication date.

Style:

Published Data

  • Width: This field allows you to edit the width of the space where the publication date is located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Save and Publish Your Design

Once you have created your customized design with “GOM Tools – Single post”, make sure to save the changes. You can do this by clicking on the “Save” button at the bottom of the editor.

Definition of the Widget

Posts: This widget allows you to add posts in the template.

Posts- posts

Post Settings

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change the colors, the fonts, the styles, the links, and more. We offer several advanced customization options that you may want for your site, which allows you to have total control over the appearance and behavior of the element.

All the contents of Elementor are divided into “Content” and “Style”, we will explain each one of them and their respective section to edit the heading.

Content:

Display Options

  • Posts: Button that you can enable or disable so that related posts are displayed.
  • Pagination: Button that you can enable or disable so that pagination is displayed.

Posts

  • Layout Style: Field to select the style of the posts, you will have two options to select “List” or “Grid”.
  • Posts to Show: Field to select the number of posts you want to display.
  • Order: This field allows you to edit the order in which the posts are displayed. The options are “Ascending” or “Descending”.
  • Order by: This field allows you to edit the order of the posts according to “Name”, “ID”, or “Slug” (sort by the readable structure of a URL).
  • Post Body Width: This field allows you to edit the width of the post body.
  • Show Post Image: Button that you can enable or disable so that the post image is displayed.
  • Image Size: This field allows you to edit the size you want to give to the image.
  • Layout Style: This field allows you to edit the style that the image will have, which offers five options to select “1/1”, “16/9”, “2/3”, “4/3”, and “21/9”.
  • Post Image Width: This field allows you to edit the width of the post image.
  • Show Post Categories: Button that you can enable or disable so that the categories of the post are displayed.
  • Show Post Share Button: Button that you can enable or disable so that the post share button is displayed.
  • Message for Share Button: This field allows you to edit a custom message that is displayed when sharing.
  • Show Post Title: Button that you can enable or disable so that the title of the post is displayed.
  • Title Tag: This field allows you to edit the HTML tag of the title, you can select from H1 to H6.
  • Truncate Title: This field allows you to edit the number of characters to truncate the title that is displayed in the post.
  • Show Post Excerpt: Button that you can enable or disable so that an excerpt of the post is displayed.
  • Truncate Excerpt: This field allows you to edit the number of characters to truncate the excerpt that is displayed in the post.
  • Show Post Description: Button that you can enable or disable so that the description of the post is displayed.
  • Truncate Description: This field allows you to edit the number of characters to truncate the description that is displayed in the post.
  • Show Post Call to Action: Button that you can enable or disable so that a CTA button is displayed in the post.
  • CTA Label: Edit the label of the CTA button.
  • CTA Target: This field allows you to edit the type of redirection when pressing on the CTA, you will have two options to select “Same Window” or “Other Window”.
  • Show Post Published Date: Button that you can enable or disable so that the publication date is displayed.

Style:

Post

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Image

  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Categories

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the font family, size, weight, style, and more.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Title

  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the font family, size, weight, style, and more.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Excerpt

  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the font family, size, weight, style, and more.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Description

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

CTA

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Width: This field allows you to edit the width of the space where the element is located.
  • Alignment: This field allows you to edit the alignment of the CTA. You can choose “Right”, “Center”, or “Left”.
  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Published Date

  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the font family, size, weight, style, and more.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Share

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Width: This field allows you to edit the width of the space where the element is located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Icon Color: This field allows you to edit the icon color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Icon Width: This field allows you to edit the width of the icon.
  • Alignment: This field allows you to edit the alignment of the icon text. You can choose “Right”, “Center”, or “Left”.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Pagination

  • Background Color: This field allows you to edit the background color of the element, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Border: This field allows you to edit the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color, on the right side you will have a button to select the global colors of the page or select a specific color.
  • Padding: This field allows you to edit the padding, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin, it has four options to edit which are “Top”, “Right”, “Bottom”, and “Left”.

Pagination Numbers

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it (“Hover”).
  • Width: This field allows you to edit the width of the space where the pagination numbers are located.
  • Height: This field allows you to edit the height of the space where the pagination numbers are located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the font family, size, weight, style, and more.
  • Alignment: This field allows you to edit the alignment of the pagination numbers. You can choose “Right”, “Center”, or “Left”.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the border radius. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or choose a specific color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.

Save and Publish Your Design

Once you have created your custom design with “GOM Tools – Posts”, make sure to save the changes. You can do this by clicking the “Save” button at the bottom of the editor.

Widget Definition

Posts categories: This widget allows you to add post categories in the template.

Posts- posts categories

Posts categories configuration

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options that you may need for your site, allowing you to have full control over the appearance and behavior of the element.

All Elementor contents are divided into “Content” and “Style”. We will explain each of them and their respective sections for editing the header.

Content:

Categories

  • Hide Empty Categories: This field allows you to edit the option to display empty categories. You will have two options to select: “Yes” or “No”.
  • Hide Sub Categories: This field allows you to edit the option to display subcategories. You will have two options to select: “Yes” or “No”.
  • Include Categories: Press the “+ Add Item” button. When pressed, a section will expand where you can select the category you want to include. You can add as many categories as you want or copy the same one by pressing the button displayed to the right of the number, which will change according to the number of elements in the selected category.
  • Exclude Categories: Press the “+ Add Item” button. When pressed, a section will expand where you can select the category you want to exclude. You can exclude as many categories as you want or copy the same one by pressing the button displayed to the right of the number, which will change according to the number of elements in the selected category.
  • Order by: This field allows you to edit the order of posts according to “Name”, “ID”, or “Slug” (order by the readable structure of a URL).
  • Order: This field allows you to edit how posts are displayed. The options are “Ascending” or “Descending”.

Style:

Categories List

  • Categories List Style: This field allows you to edit the category style. The available options are “Default” or “None”.
  • Categories List Direction: This field allows you to edit the category direction. The available options are “Default” or “Inline”.
  • Vertical Alignment: This field allows you to edit the vertical positioning of the category list.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of the category list.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Items

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Vertical Alignment: This field allows you to edit the vertical positioning of items.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of items.
  • Text Alignment: This field allows you to edit the text alignment. You can choose “Right”, “Center”, and “Left”.
  • Container Width: This field allows you to edit the width of the container where the item is located.
  • Width: This field allows you to edit the width of the space where the element is located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Categories Sub List

  • Categories List Style: This field allows you to edit the category style. The available options are “Default” or “None”.
  • Categories List Direction: This field allows you to edit the category direction. The available options are “Default” or “Inline”.
  • Vertical Alignment: This field allows you to edit the vertical positioning of the category list.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of the category list.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.

Sub Lists Item

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Vertical Alignment: This field allows you to edit the vertical positioning of items.
  • Horizontal Alignment: This field allows you to edit the horizontal positioning of items.
  • Text Alignment: This field allows you to edit the text alignment. You can choose “Right”, “Center”, and “Left”.
  • Container Width: This field allows you to edit the width of the container where the item is located.
  • Width: This field allows you to edit the width of the space where the element is located.

Save and Publish Your Design

Once you have created your customized design with “GOM Tools – Posts”, make sure to save the changes. You can do this by clicking on the “Save” button at the bottom of the editor.

Widget Definition

Contact Form 7: This widget allows you to add forms in the template.

GOM Tools forms

Contact Form 7 Configuration

Once you have added the widget to your design, you can customize it according to your needs and preferences. You can change colors, fonts, styles, links, and more. We offer several advanced customization options that you may need for your site, allowing you to have full control over the appearance and behavior of the element.

All Elementor contents are divided into “Content” and “Style”. We will explain each of them and their respective sections for editing the header.

Content:

Form

  • Form Shortcode: In this module, you will have only a text field where you can enter the code provided by the Contact Form 7 plugin.

Style:

Form

  • Width: This field allows you to edit the width of the space where the form is located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Labels

  • Show Label: This field allows you to edit the option to display labels in the form. You will have two options to select: “Yes” or “No”.
  • Width: This field allows you to edit the width of the space where the label is located.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Fields

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Placeholder Color: This field allows you to edit the color of the text that appears in the field before the user enters a value.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Submit Button

  • Normal/Hover: This field allows you to edit the design and styles, differentiating between the “Normal” state of an element and its state when the user hovers over it “Hover”.
  • Background Color: This field allows you to edit the background color of the element. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Text Color: This field allows you to edit the text color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Typography: This field allows you to edit the typography of the element. On the right side, you will have a button to select the global typography of the page or manually edit the family, size, weight, style, among others.
  • Border: This field allows you to edit the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Radius: This field allows you to edit the radius that you want to add to the border. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Border Color: This field allows you to edit the border color. On the right side, you will have a button to select the global colors of the page or select a particular color.
  • Padding: This field allows you to edit the padding. It has four options to edit: “Top”, “Right”, “Bottom”, and “Left”.
  • Margin: This field allows you to edit the margin. It has four options to edit: “Top”, “Right”.

Save and Publish Your Design

Once you have created your customized design with “GOM Tools – Contact Form 7”, make sure to save the changes. You can do this by clicking on the “Save” button at the bottom of the editor.