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

 

WP Woocommerce Products

September 21, 2021

WP Woocommerce Products Settings

Under this tab the options are as follows:

  1. Admin label: this helps you identify better than you did with this element. This will guide you while doing further customization. You should name the admin label by keeping the relevance to the purpose of the element you have added. This will surely save you from a lot of hassles.
  2. Widget: Select a widget that is available in the drop-down list.
  3. Widget title HTML element: Select a HTML element for widget title.
  4. Number of products to show: Set the number of woocommerce products that you want to show.
  5. Show: There are 3 available options: All Products, Onsale Products, and Featured Products. Choose a product option to show from the list.
  6. Order by: Choose one of order type that products will be sorted by (Date, Randon, Price or Sales)
  7. Order: Select the ordering of how woocommerce products will be ordered. The result will be displayed in ascending or descending order.
  8. Hide free products: If you created free products with woocommerce, but do not want them to be visible in front-end. Just enable this option.
  9. Show hidden products: Enable this option if you want to show hidden products.
  10. Text align: This feature allows you to set the horizontal alignment of a text. A text can be left or right-aligned, or centered.
  11. Custom class: Write the class name used for writing custom CSS or JS.
  12. Custom ID: Give a custom ID to override the auto-generated ID.

Design Settings

Under this tab the options are as follows:

  1. Background: Select a color or tick on the box "transparent" if you don't want a background color.
    - Background repeat: sets if/how a background image will be repeated.
    - Background size: specifies the size of the background images.
    - Background attachment: sets whether a background image scrolls with the rest of the page or is fixed.
    - Background position: sets the starting position of a background image.
  2. Upload an image if you're interested in decorating the background with an image.
  3. Border: set the thickness of the element border by entering numbers in boxes top, right, bottom, and left.
    There are many border styles including solid, dashed, dotted, double.
    Choose a color for the borderline.
  4. Spacing: Add margin and padding values over the row to improve its appearance on different devices. Spacing units are px, rem, em, and %.
  5. Custom color: select a custom color for the element or otherwise make it transparent. You can set a custom color for text, regular link, hover link and active link.