Agruco – Sidebar Widgets

April 11, 2022

1. Blog Sidebar

This sidebar is located on the blog pages and detailed blog pages. 

  • Please go to WP-Admin > Appearance > Widgets > Main Sidebar
  • Click the Add Widget button > Find Widgets you're looking for and drag it to the sidebar
  • On the demo, we used widgets on the sidebar: video, image, recent comments, and tag cloud

2. Shop Sidebar

The product filter is located on the shop page and single woo-commerce product pages, where you can filter your products by categories, groups, brands, rating, and price.

  • Please go to WP-Admin > Appearance > Widgets > Shop Sidebar
  • Click the Add Widget button > Find the Woocomerce Filter Widget and drag it to the sidebar
  • After that, click to add a new filter

3. Inventory Sidebar

The inventory filter allows you to filter or search advanced products by branch, category, features, storage, type, origin, and price.

  • Please go to WP-Admin > Appearance > Widgets > Inventory sidebar
  • Click the Add Widget button > Find the TemPlaza - Advanced Products Filter Widget and drag it to the sidebar

Agruco – Inventory

April 8, 2022

An inventory page was created to display products with advanced information as a way of attracting shoppers. 

To build the inventory page, it requires you to install and activate the Advanced Products plugin. 

inventory page
Single advanced product

1. Create custom group field and custom field

Before creating advanced product data, you're supposed to create custom group fields and custom fields first. 

Please go to Advanced Products > Custom group fields

Create a field group
  • Enter the field group title
  • Assign it to a parent custom field group to create a hierarchy if needed
  • Assign it to branches (created in the branch section of advanced products)
Create a single field

Field Type:

  • Enter the field label, field name
  • Field type: select a field type available from the drop-down list
  • Required: set where this field is required or optional
  • Default value: you can enter a default value that always appears when creating a new post
  • Placeholder text: enter the text that appears in the input of the field
  • Character limit: set the number of characters limited in the field (or leave blank for no limit)

Custom Field Group: Assign the custom field to a specific Custom Field Group

Field Display: you can enable the custom field to be visible on:

  • Listing view: the page displays all advanced products
  • Search View: the advanced product search on the sidebar

2. Create Branches

Please go to Advanced Product > Branches

  • Enter the branch’s name
  • Assign to a parent branch if needed
  • Upload the branch’s image if required
  • Assign the branch to specific group fields

 

3. Create Advanced Products

Please go to WP-Admin > Advanced Products > Add new products

Here you can configure different elements of the advanced product including property, vegetable info, brochure, pricing

Create content tabs with Tabs element
  • Please create the product content with Elementor. You can use Tabs element to create content tabs: Description, Certificate & Award, Contact & Location
Create FAQs
  • To create FAQs, you can use TemPlaza – Heading to create the heading “FREQUENTLY ASKED QUESTIONS” and TemPlaza – UI Accordion to create questions with accordion style

4. Advanced Products Options

Please go to Agruco Options > Settings > Advanced Products Options

  • Advanced Product Archive
  • Advanced Product Single
  • Advanced Product Related

4.1 Advanced Product Archive

  • Shop Layout: choose a suitable layout (Grid or Masonry)
  • Large Desktop Columns: Set the number of products per row large desktop (1600px and larger)
  • Desktop Columns: Set the number of products per row (1200px and larger)
  • Laptop Columns: Set the number of products per row (960px and larger)
  • Tablet Columns: Set the number of products per row (640px and larger)
  • Mobile Columns: Set the number of products per row on mobile phones
  • Column Gap: Set the size of the gap (gutter) between an element’s columns.
  • Product per page: Set the number of products on the inventory page

4.2 Advanced Products Single

  • Show Office Price: enable or disable the pricing of a product
  • Office Price Label: edit the price label
  • Office Price Form: Choose a form from the list (this form can be created with WP Form plugin)

4.3 Advanced Product Related

  • Show Product Related: enable or disable related products
  • Related title: edit the title of the related products section
  • Number Product Related: set the number of related products displayed
  • Limit Specification: set the number of specifications allowed 

Agruco – Woocommerce Options

April 6, 2022

I. Create product data

The theme supports Woocommerce plugin that is so helpful for you to create your own online store. 

Please go to Dashboard > Products > Add New

II. Configure shop options

Go to Dashboard > Agruco Options > Settings > Woocommerce Options
Here you can see different options to configure Product Catalog, Product Loop, Related Products, Product Notifications and so on. 

1. Product Catalog

Here you're able to configure options to manage the shop page that can be formatted as a masonry or grid layout.

Product catalog - Grid
  • Layout: Select Grid
  • Large Desktop Columns: Set the number of products per row large desktop (1600px and larger)
  • Desktop Columns: Set the number of products per row (1200px and larger)
  • Laptop Columns: Set the number of products per row (960px and larger)
  • Tablet Columns: Set the number of products per row (640px and larger)
  • Mobile Columns: Set the number of products per row o mobile phones
  • Column Gap: Set the size of the gap (gutter) between an element’s columns.
  • Product per page: Set the number of products on a page
  • Shop pagination: Choose a pagination type ( Number, Button Load More or Infinite Scroll )
  • Show title: enable or disable products’ title
  • Show rating: enable or disable the product’s rating
Product Catalog - Masonry
  • Layout: Select Masonry
  • Product per page: Set the number of products displayed on a page
  • Item padding: Set the padding-top, padding-bottom, padding-right, padding-left of product items
  • Item margin: Set the margin-top, margin-bottom, margin-right, margin-left of product items
  • Shop pagination: Choose a pagination type ( Number, Button Load More or Infinite Scroll )
  • Show title: enable or disable products’ title
  • Show rating: enable or disable the product’s rating

2. Product loop

WooCommerce Product Loops enables you to replace your theme's product styles with modern, standardized layouts that help you boost sales.
 
 
Product loop
  • Product Loop Layout: select a layout available on the dropdown list
  • Product Loop Hover: select a hover effect 
  • Feature Icons: check box of icons that will be visible on a product loop (Cart, wishlist, quick view)
  • Always Display Wishlist: enable or disable wishlist
  • Attributes: choose attributes “Taxonomy” and “Rating”
  • Product Loop Taxonomy: choose Category or Brand
  • Show Variations: enable or disable variations
  • Show Variations With AJAX: enable or disable variations with Ajax
  • Show description: turn it on if you want to show products’ description
  • Description length: set the description length

3. Product notifications

Product notifications let you set up order and stock notifications for users.

  • Added to Cart Notice: select a cart style when adding a product to a cart
  • Recommended Products: choose a resource to show recommended products (applied to the cart pop-up style)
  • Recommend Title: edit the title of recommended products 
  • Number of products: set the number of products
  • Cart Notification Auto Hide: set how long the cart notification will go to sleep
  • Added to Wishlist Notification: enable or disable the notification when a product is added to wishlist
  • Wishlist Notification Auto Hide: set how long the wishlist notification will go to sleep (unit: seconds)

4. Single Product

Here are options to configure a detailed product page.

  • Single product layout: select a layout
  • Add to cart with AJAX: enable or disable
  • Sticky Add To Cart: enable or disable
  • Cart sticky position: select a suitable position for sticky cart
  • Product Variable Style: choose a style for product variable
  • Product Taxonomy: show taxonomy above a product title according to category or brand
  • Product Brand type: choose a brand tyle
  • Wishlist button: choose a type of wishlist button
  • Image zoom: enable or disable zooming on a hovered image
  • Image lightbox
  • Thumbnail slides number: set the number of slides on thumbnail images
  • Product meta: select some kind of product meta
  • Content tab position: choose a position where content tabs are located

5. Related products

Related products are displayed automatically by WooCommerce by a random choice. You can show related products by category, tags, or choose products to show as related products on the product details page of a specific product.

Showing related products recommendation brings customer’s attention to other products in your store that they might be interested in.

  • Show Related Products: enable or disable related product
  • Related Title: edit the related title
  • Related Products by categories: enable the option if you want to display related products by categories
  • Related Products by parent category: enable the option if you want to display related products by parent categories
  • Related Products by tags: enable the option if you want to display related products by tags
  • Related Products Numbers: set the number of related products to display

6. Upsells Products

Up-sells are products that you recommend instead of the currently viewed product.

They are typically products that are more profitable or better quality or more expensive. Depending on your theme template, these products display on the single product page underneath the product’s description.

  • Show Upsells Products: enable or disable
  • Upsells title: edit the upsell product title
  • Upsells Products Numbers: set the number of upsell products to display

7. Recent Viewed Products

Recently Viewed Products for WooCommerce displays the products recently viewed by Members and Guests on a separate page.

  • Show Recent Viewed Products: enable or disable
  • Load With Ajax
  • Hide Empty Products
  • Display on page: select a page that recently viewed products will be displayed on
  • Recently Viewed Title: edit the title “Recently Viewed”
  • Read more text: add a read more text if needed
  • Read more url: add a read more url if needed
  • Recently viewed columns: set the number of recently viewed products columns
  • Recently viewed numbers: set the number of recently viewed products displayed

8. Product Badges

Product badges can enhance a customer’s understanding of a product’s main selling points, highlight promotions and products with limited-time offers, improve CTR, and many more sales-boosting benefits.

  • Catalog Badges: allow the badges to be displayed on the catalog page
  • Badges Layout: choose a badge layout
  • Product Badges: enable or disable
  • Enable Sale Badge: enable the option if you want to display a badge for sale products
  • Badges Sale type: choose a badge type for sale products (Percent, text or both)
  • Badge Sale text: enter the badge sale text (Use {%} to display discount percent, {$} to display discount amount.)
  • Enable New Badge: enable a badge for new products
  • Badge New text: enter badge text for new products
  • Product Newness: Display the “New” badge for how many days?
  • Enable Featured Badge: enable the badge of feature products
  • Badge Featured text: edit the text of the featured product’s badge
  • Enable Sold Out Badge: enable the option if you want to display Sold Out badge
  • Badge Sold out text: edit the text of Sold Out badge

9. Cart Page

The Smart Cart for WooCommerce shows a summary of all of the products that a customer has added to the cart, subtotal, shipping and a total price for the order, and a Proceed to Checkout button that directs customers to checkout page. It saves customers' time help business to grow.

  • Update Cart Automatically: enable if you want the cart updated automatically
  • Show Cross-Sells Products: enable or disable cross-sells products in the cart
  • Cross-Sells Products Title: enter the title of the cross-sell products
  • Cross-Sells Products Numbers: set the number of cross-sell products showcased in the cart

 

10. Mini Cart

  • Login type: choose a login type ( Modal or Link )

11. Account Login

  • Login type: choose a login type (Modal or link)
  • Login text: Enter login text if needed
  • Login icon: choose a login icon from the list

 

Agruco – Home 1

April 6, 2022

You have to install the required plugins including Elementor Website Builder, TemPlaza Elements, Advanced Products, Woocommerce

The home page was built with Elementor.
Using Templaza style: Home page

Inventory Search

This part is built with Templaza: UI Advanced Product Filter
To build this product filter, you need to create data for brand and category in Woo-commerce first. 

  • Enter the filter's title and title display: Block
  • Select Custom Field: brand and category
  • Submit text: this is the Seach button text
Filter Position

Filter Positioning

In the Advanced tab > Positioning: here you're able to configure position of the product filter

  • Custom width, position (absolute), and vertical offset


Agruco – Import Demo Content

April 6, 2022

Agruco theme supports users to import its demo content with 1-click. This process requires you to activate the product license purchased on themeforest first. Let’s start!

1. Activate product license

You’re supposed to activate the product license before starting to import the demo content.

  • Please go to Agruco Options > Dashboard > Click “Activate Product“
  • Popup will appear immediately. Click “Proceed” to complete Theme Activation
  • Your license will be visible in the license information box

Click “Active Product” to begin the process
Popup will appear immediately. Click “Proceed” to complete Theme Activation
Product Activation is completed

2. Import Demo Content

After completion of Agruco theme installation, you can start building your awesome WordPress site. It would be easier if you use our demo pages/content/settings instead of starting working from scratch. If you wish to use our demo pages/content/settings then you will have to install demo data and settings as per the installed theme version demo content and configurations.

Warning Importing demo content will import posts, pages, theme options, widgets, images, sliders and other settings. Your existing setup will be replaced with new demo data and settings from the installed theme version demo content and configurations. So we recommend you take the backup of your existing WordPress setup and database for your safety.
John Doe
Designer
2.1 Recommended PHP Settings

We recommend below PHP configurations to avoid errors like blank screen, demo content import fails or theme installation error. You can do below configuration changes yourself or contact your hosting provider and ask them to set below configurations.

  • upload_max_filesize 30M
  • post_max_size 128M
  • max_execution_time 180 (This needs to be increased if your server is slow and cannot import data.)
  • memory_limit 256M
  • max_input_vars 2000

You can check PHP configuration settings by installing WordPress phpinfo() extension in WordPress. You can also contact your hosting provider if you don’t know much more about it.

2.2 Demo Import Requirements

You have to install and activate the required plugins: Advanced Products, Elementor, Redux framework, Templaza framework, UIPro

In the tab "Demo Importer" > click to import demo > Select all required plugins and install them.

When they are all installed and activated, select which part of the theme you want to import: content, media, slider ... and start the process.

Agruco – Edit Footer

April 6, 2022
Agruco Footer

Edit the footer content

1. Home Pages' Footer

Please go to Admin > Agruco Options > Templates > Edit Home page / Home 2 / Home 3 > Layout

  • Home page template is assigned to Home version 1
  • Home 2 template is assigned to Home version 2
  • Home 3 template is assigned to Home version 3

In the layout section, you're supposed to scroll down to edit the Footer elements.

2. Inner pages' footer

Inner pages are assigned to other prebuilt templates: Inventory, Full-width, No Sidebar, and Shop

First, you should check which template the page is assigned to. (By editing a page, check "Templaza options" to find out which template style your page is assigned to.) 

Ex: Service page is assigned to Full-width template, so you're supposed to edit the layout of this template, then changes will reflect properly in front-end. 

How to have the same footer on all pages without editing different templates

In this case, you should edit the footer content of a template (ex: Home page template), then click "Save Section" 

After that, the Footer section will be saved as a sample in the template library

When editing a footer of other templates, you can click add new section > Select the save Footer section in library. This step will save a lot of time 

Agruco – Mega Menu

April 6, 2022

Please follow the steps below to know how to create a mega menu as our demo.

Enable Mega Menu

Pls go to Wp-admin > Appearance > Menus > Select your main menu

By toggling each menu item, you will see a "Menu Options" button > click on it to see all available options

In the menu options, please enable Mega Menu

Here you can configure submenu alignment: Right, Left, Center, Container, or Full.

Mega Menu Builder

After enabling Mega menu, you'll be able to create your own mega menu by using the menu builder below.

Click to manage columns and add appropriate elements.

Agruco – Installation

March 20, 2022

Install Agruco theme through WordPress

Installing a theme through WordPress is an easy and simple process. Follow the below steps to install Agruco through WordPress. Login to your WordPress admin section.

  • Navigate to Appearance > Themes from admin panel’s sidebar.
  • Click on the install themes and click the upload button.
  • Select agruco.zip (Downloaded from ThemeForest) file from your computer and click on “Install Now”
  • Now Activate Agruco theme by navigating to Appearance > Themes and clicking on activate button.

Install the theme through FTP

  • Unzip agruco.zip in the theme folder of the theme package.
  • Upload the extracted folder in the previous step into /wp-content / themes/
  • To activate the theme, go to Appearances --> Themes> and activate it.

Golden Hearts – Installation

November 30, 2021

At first, please make sure your system meets the following requirements

Download Package

Go to Themeforest.net > Your Download page. Please download the package from your download page

Installing Golden Hearts Theme

To install the theme correctly, after downloading the theme package from Themeforest, you need to Unzip the package. There are folders inside.

Install Theme via WordPress Admin

  1. Navigate to Appearances--> Themes
  2. Click Add New button and then hit the Upload Theme button
  3. Click on Browser to upload golden-hearts.zip in Theme folder and click Install Now.
  4. Click Activate to activate the installed themes.

Install Theme via FTP

  1. Unzip golden-hearts.zip in theme folder of theme package.
  2. Upload the extracted folder in previous step into /wp-content / themes/
  3. To activate the theme, go to Appearances --> Themes> and activate it.

Golden Hearts – Home page 3

November 29, 2021

To set up Home Page 3, please make sure you have installed the required plugins including Elementor Website Builder and TemPlaza Elements.

Install required plugins

Steps to Create the Home page 3 demo

Step 1: Create a template site

  • Go to WP-admin > pages > Add new
  • Enter the page's title 
  • Select a templaza style: Home page 3
  • Start to edit the page's content with Elementor

The Home Page was created with different Elementor widgets: Slider Revolutions, Heading, Image, UI Card, UI Text, Button, UI Lightbox, UI Post, Image Carousel, Testimonials

Create a new page and choose a templaza style

Slider Revolution

This section uses Slider Revolution

  • Add a new section with 1 column, drag & drop "Slider Revolution 6" element
  • Select a module from Slider Revolution Plugin
  • Insert this shortcode: [rev_slider alias="slider-home-version-1" slidertitle="Slider Home Version 1"][/rev_slider]
Slider Revolution

About Us section

This section includes UI Text and background image, button and Testimonials.

  • Create a new section with 2 columns, drag & drop those elements into each column
About us

Testimonials

Drag & drop the Testimonials element to the column

Enter the content, choose an image, person's name, title, image position, alignment

  • Go to the Advanced tab > Positioning
  • Width: Inline
  • Position: Absolute
  • Configure offset of both horizontal and vertical orientation
Testimonials

Background image

To edit the background image, please click to edit the column > tab "Style" > background image > Choose an image

  • Position: Center Center
  • Repeat: No-repeat
  • Size: Cover

Our Mission Section

This section includes Templaza - heading, UI Card. Create new sections, drag & drop those elements to them respectively. 

  • Templaza Heading: Enter heading title and content
  • UI Card: create 4 inner columns and add UI Card widgets to them. Enter each card's title and content
UI Card

Upcoming Events Section

This section includes UI Text, Button and upcoming events

UI Text & button:

  • Create a new section with 2 columns, drag & drop UI Text into the 1st column, the other with a button
  • Edit your text and button

Upcoming Events:

  • Create a new section right below the Upcoming Events title, and add the WP Upcoming Events widget to it.

This section will automatically derive upcoming events from Events sector

  • Configure the number of events to show, order, and order by
Configure upcoming events

Our Causes section

This section includes UI Text for the title and UI Posts for Causes articles

  • For the title "Our Causes", please add a new section, then drag & drop UI Text element into it
  • Enter a title and content
  • Continue to add another new section, drag & drop UI Posts element into it
  • Choose a resource, category, and configure the number of columns on devices.
  • Move to Slider Settings, enable the option "Display Articles as Slider"
Our Causes
Enable Slider Option

UI Lightbox

This section was built with Tempaza UI Lightbox element

  • Add a new section and drag&drop UI Lightbox to it
  • Insert a video's URL and choose an icon

Background image

Click to edit the section > tab Style> background > Change the background image

Latest News Section

This section includes UI Text, Button, and UI Posts:

  • Create a new section with 2 columns, drag & drop UI Text into the 1st column, and the other with a button
  • Another new section below will be filled with UI Posts
  • Choose a resource, categories, ordering and configure the number of columns on devices
Latest News