Thank you for choosing Gravia WordPress theme to build your WooCommerce website.
Getting Support
↑ Back to topSupport for this theme is available through our support portal. Our team aims to respond within 24 hours on business days. On weekends or holidays, responses may take longer, but we will assist you as soon as possible. Feel free to reach out with any questions or issues — we’re always ready to help!
Installation & Demo Content Import
↑ Back to topTo create a site with Gravia, you must install the Gravia theme and WooCommerce plugin.
Installation
↑ Back to top- In your Dashboard go to Appearance > Themes.
- Click on the Add New button on top.
- Click Upload New button on top.
- In the new interface click Choose File and browse your computer to locate electronics-and-gadget-shop-theme-for-woocommerce.zip file you downloaded.
- Click Install Now.
- After installation Activate the theme.
Recommended plugins
↑ Back to top- WooCommerce: The official WooCommerce plugin is required to display the modal cart and products. It includes many other necessary blocks for any website.
- WP Form : The plugin is recommended for creating contact forms.
- WP Super Cache: The plugin is recommended for caching entire site.
Importing Demo Content
↑ Back to topTo import the demo content, follow these steps to install and set up the necessary plugins using the ODCI (One Click Demo Import) plugin.
- Install the Required Plugins: The One Click Demo Import and WooCommerce plugins are required to import the demo content. To install them, follow these steps:
- Go to Appearance > Install Plugins.
- Select both the One Click Demo Import plugin and WooCommerce.
- Choose Bulk Actions > Install and click Apply.
- Wait for the installation to complete, click Return to the Dashboard. Now you’re ready to import the demo content.
- Import Demo Content: After activating the required plugins, proceed to import the demo content:
- Go to Appearance > Import Demo Data.
- Click the Import Demo Data button.
- Then, click Continue & Import to start the process.
- The demo content, including pages, posts, images, and settings, will be imported and automatically set up to match the demo.
Setting a homepage
↑ Back to topAfter installation is completed, you can set one of the pages imported as your homepage. To set your home page:
- In your admin panel, go to Settings > Reading
- Select A Static Page option for the Your homepage displays option.
- In the dropdown, choose the page you want set as home.
Site logo setup
↑ Back to topFollow these steps to set up your site logo for a WordPress block theme directly from the front-end of your site.
- Open the Site Editor While viewing any page on your site, ensure you are logged in with the admin bar enabled. In the admin bar at the top of the screen, click the Edit Site button. This will open the Site Editor directly in the current template.
- Locate the Site Logo Block Once in the Site Editor, find the Site Logo block within the template you’re editing. This block is usually located in the header area.
- Upload or Select Your Logo Click on the Site Logo block to upload a new logo or select one from your media library. Ensure the logo is appropriately sized and formatted.
- Save Your Changes After setting up your logo, click Save in the top-right corner to apply the changes across your site.
Navigation setup
↑ Back to topSetting up your site’s navigation is a key step in ensuring that visitors can easily navigate through your content. Follow these steps to create and customize a navigation menu using the Site Editor.
- Locate the Navigation Block Within the Site Editor, find the Navigation block, usually located in the header area of your template. This is where you will create and manage your menu.
- Create a New Menu Click on the Create a new menu link within the Navigation block. This will allow you to start building your menu from scratch.
- Add Menu Items Begin adding menu items by clicking the + icon. You can add links to pages, posts, categories, or custom URLs that you want to include in your navigation.
- Save Your Changes Once you’ve added all the necessary items, click Save in the top-right corner to apply the changes to your site.
Changing site header template
↑ Back to topTo update or change your site’s header template, follow these steps within the Site Editor.
- Open the List View Panel Ensure you are in the Site Editor. Open the List View panel, which displays a listing of blocks on the page. This panel is typically found on the left side of the editor.
- Select the Header Block In the List View panel, locate the header block. Click the three-dots button at the end of the header block name to access additional options.
- Replace the Header Template From the submenu that appears, click Replace. This will open the “Choose a Header” modal.
- Choose a New Header Template In the “Choose a Header” modal, browse through the available header templates and select the one you want to use.
- Save Your Changes After selecting the new header template, click Save in the top-right corner of the editor to apply the changes to your site.
Changing shop page template
↑ Back to topTo update or change the template for your shop page, follow these steps within the Site Editor.
- Access the Settings In the Site Editor, click the Settings button located beside the Save button in the top-right corner of the screen.
- Go to the Template Tab In the settings panel, click on the Template tab to view template options.
- Select the Shop Page Template Expand the Design option group to reveal available templates. Choose the template you want to apply to your shop page.
- Save Your Changes After selecting the desired shop page template, click Save in the top-right corner to apply the changes.
Product listing setup
↑ Back to topTo configure the product listing on your site, you’ll use the Products block, which is essentially a Query block. Follow these steps to change or filter the product listing.
- Select the Products Block In the Site Editor, locate and click on the Products block. This block is used to display a listing of products and is based on the Query block functionality.
- Access Block Settings With the Products block selected, look for the block settings panel usually located on the right side of the editor. Here you can customize various options for the product listing.
- Change or Filter the Product Listing In the block settings panel, you’ll find options to change or filter the product listing. You can adjust the Query settings to filter products by categories, tags, attributes, or other criteria. You can also choose how many products to display and set other display options as needed.
- Save Your Changes Once you have configured the product listing to your satisfaction, click Save in the top-right corner to apply the changes to your site.
Using Patterns in Custom Design
↑ Back to topIn WordPress, a pattern is a pre-designed layout made up of blocks like text, images, buttons, and columns. These patterns allow you to quickly add ready-made designs to your pages without starting from scratch. Using patterns saves time and helps create attractive pages easily, without the need for coding or design skills. This theme includes built-in patterns, making it even faster to design and customize your site.
Steps to use patterns in the editor
- Open the editor: Go to Pages or Posts in your WordPress dashboard and select the page, post, or use the Site Editor to choose the area you want to edit.
- Add a New Block: In the editor, click the “+” button to add a new block where you want to insert a pattern.
- Select “Patterns”: From the block options, click on the “Patterns” tab to view the available patterns.
- Choose a Pattern: Browse through the patterns and select one that suits your design. Click on the pattern to insert it into your page.
- Customize the Pattern: Once the pattern is added, you can easily customize it by editing text, images, or other block elements to match your content.
- Save Your Changes: After making your changes, click Update or Publish to save your work.
Theme global style setup
↑ Back to topTo configure the global styles for your theme, you will edit the theme settings through the Site Editor. This enables you to apply consistent styling across your entire site.
- Access Global Styles In the Site Editor, click on the Styles button located at the top-right of the screen. The button is represented by a circle with half white and half black.
- Edit Global Settings In the Styles panel, you can modify various global settings. This includes settings for colors, typography, spacing, and other design elements. Adjust these settings to apply global styles across your site.
- Preview and Adjust Preview the changes as you make adjustments to ensure they align with your design preferences. Make any necessary tweaks to get the desired look.
- Save Your Changes After finalizing the global styles, click Save in the top-right corner to apply the changes to your theme.
Templates & Patterns
↑ Back to topHere is a list of built-in templates and patterns for quick and easy use.
- Address Card
- Brands – Layout 1
- Content Area – Left Sidebar
- Content Area – Right Sidebar
- Content Section – 1
- Content Section – 2
- Content Section – 3
- Content Side Header
- Cover Link – Horizontal
- Cover Link – Large
- Cover Link – Vertical
- Discount Section
- Features Section
- Payment Icon – Outline
- Payment Icon – Solid
- Posts – Layout 1
- Posts – Layout 2
- Posts – Layout 3
- Posts – Layout 4
- Posts – Layout 5
- Posts – Tiny Layout 1
- Pricing Item
- Pricing Table
- Product Feature List
- Product Review Section – 2
- Product Review Section
- Product Specs Table
- Products – Layout 1
- Products – Layout 2
- Products – Layout 3
- Products – Layout 4
- Products – Layout 5
- Products – Layout 6
- Products – Layout 7
- Products – Layout 8
- Products – Layout 9
- Pros & Cons – Small
- Quick Info
- Service Team
- Subscribe – Layout 1
- Super Sale Section
- Archive – Layout 1
- Archive – Layout 2
- Archive – Layout 3
- Archive – Layout 4
- Archive – Layout 5
- Blog – Layout 1
- Blog – Layout 2
- Blog – Layout 3
- Blog – Layout 4
- Blog – Layout 5
- Page – Right Sidebar
- Header – Style 2
- Header – Style 3
- Header – Style 4
- Header – Style 5
- Header
- Product Archive – Layout 1
- Product Archive – Layout 2
- Product Archive – Layout 3
- Product Archive – Layout 4
- Product Archive – Layout 5
- Shop – Layout 1
- Shop – Layout 2
- Shop – Layout 3
- Shop – Layout 4
- Shop – Layout 5
- Shop – Layout 6
- Shop – Layout 7
- Single – 1 Column
- Vendor Brands