Flatsome is the top-selling WooCommerce Theme
on the Themeforest website. In this article, Naiba teaches you how to use Flatsome to
build your own website.。
Prerequisites for Building a Website with Flatsome
To use Flatsome as your WordPress Theme, the primary prerequisite is that you must have your own WordPress website. Naibabiji shares many related tutorials, which won't be repeated here.
- Steps to Build a Website
- SiteGround Hosting Tutorial for Installing WordPress Recommended for Foreign Trade Users
After installing the WordPress website, we can use Flatsome to build our own foreign trade website.
Flatsome Usage Tutorial
1. Installing the Flatsome Theme
1. Download the theme file after purchasing from Themeforest
Purchase Address2. Extract the downloaded zip file, then upload the Theme installation package to the WordPress Admin Dashboard for installation. 3. Activate the Theme and enter the setup wizard interface, as shown in the figure below:
4. Follow the wizard's steps. During the process, you will be prompted to enter the key, activate the Child Theme, install Plugins, import content, etc. If you don't know where to retrieve the key,
click here。
After the content import is complete, you will be prompted to upload a logo and select a preset template; choose your preferred demo style. The LOGO image can also be replaced later. 5. Once the import is finished,
After the import is complete, you can choose 'Setup WooCommerce' to configure the e-commerce Plugin, or click 'View your new website' to browse the site.
2. Customizing the Flatsome Theme
Click the customize button on the website homepage to make a series of custom modifications to the Theme.
Here, you can modify and adjust many aspects of the Theme; simply adjust the parameters according to your actual needs. For example, in the Header's Presets, you can select the website navigation bar style, and then in the Header Builder interface, you can drag and choose the content to display in the header.
If your website has users in China, it is recommended to disable Google Fonts in the Typography section under Style. For foreign trade websites, this step is unnecessary, as Google Fonts are relatively richer and more aesthetically pleasing. After completing the custom content settings, click the publish button.
3. Modifying Flatsome Page Layout
For example, if you want to modify the layout of the website homepage again, click the edit button at the top of the homepage, or go to the WP Admin Dashboard, find the homepage page, and edit it. Select 'Edit with UX Builder' to enter the page builder editing interface. As shown in the figure below:
In the figure above, the left navigation shows the layout of your current page. We can see that the top consists of two banners. Click on the content of the first banner to edit the text directly. Clicking the banner's settings options allows you to access specific banner settings, where you can modify the background image and layout. Between sections, you can click the ➕ plus sign to add new sections.
The content that can be added is shown in the figure below:
You can use these functional modules to customize the layout and content of the page yourself. After all content is debugged, click update to publish the new page. Once all settings are complete, you can upload products and launch the website for operation. The above content is what Naiba introduces to everyone:
How to Use the Flatsome Theme to Build Your Own Website Tutorial.
4. Follow the wizard's steps. During the process, you will be prompted to enter the key, activate the Child Theme, install Plugins, import content, etc. If you don't know where to retrieve the key,click here。 
After the content import is complete, you will be prompted to upload a logo and select a preset template; choose your preferred demo style. The LOGO image can also be replaced later. 5. Once the import is finished,
After the import is complete, you can choose 'Setup WooCommerce' to configure the e-commerce Plugin, or click 'View your new website' to browse the site.
Here, you can modify and adjust many aspects of the Theme; simply adjust the parameters according to your actual needs. For example, in the Header's Presets, you can select the website navigation bar style, and then in the Header Builder interface, you can drag and choose the content to display in the header.
If your website has users in China, it is recommended to disable Google Fonts in the Typography section under Style. For foreign trade websites, this step is unnecessary, as Google Fonts are relatively richer and more aesthetically pleasing. After completing the custom content settings, click the publish button.
In the figure above, the left navigation shows the layout of your current page. We can see that the top consists of two banners. Click on the content of the first banner to edit the text directly. Clicking the banner's settings options allows you to access specific banner settings, where you can modify the background image and layout. Between sections, you can click the ➕ plus sign to add new sections.
The content that can be added is shown in the figure below:
You can use these functional modules to customize the layout and content of the page yourself. After all content is debugged, click update to publish the new page. Once all settings are complete, you can upload products and launch the website for operation. The above content is what Naiba introduces to everyone:How to Use the Flatsome Theme to Build Your Own Website Tutorial.
Comments are closed
The comment function for this article is closed. If you have any questions, please feel free to contact us through other channels.