Shopping cart

close
Menu
close
Start typing to see products you are looking for.

HTML Blocks usage

Document navigation

HTML Blocks usage

As our theme comes with WPBakery Page Builder we find it usefull to create a custom post type where you can build your own static HTML blocks and place it anywhere through the site using shortcode or widget.
Find this functionality in admin panel -> HTML Blocks. After adding some blocks you will see a shortcode for this block, place it at any other page, widget, footer etc.

APPLICATION

HTML block is added by means of HTML block WPBakery Builder

This option allows adding elements not covered by Header Builder chart, for example, Popup, Icons, Countdown Timer.

A mega menu expands the default WordPress drop-down menu allowing to show a sales product, images, nice menu items. Mega menu block can be set in Appearance -  > Menu -> Select Menu -> Enter menu item - > Set the HTML block from the dropdown list.

HTML block can replace the textual message and include banners, images, and other elements from WP bakery page builder or Elementor. Inserting HTML ID shortcode, it is necessary to consider the "Text color scheme" option that influences color of the content of the block.

Theme Settings -  > Shop ->  Empty cart text

This option allows adding some additional elements: links, buttons or other content on the empty cart page.

The promo pop-up is configured in  Theme Settings   - > General - > Promo popup

The promo popup may contain any content such as Hot or Sales product information, Subscription or Contact form and other content as per business need.

The Header Banner is enabled and configured in Theme Settings   - > Shop - > Header banner

The option is the best for all kinds of notifications,  icons, buttons, popup, countdown.

The contetn will appear before Default "Thank you page" content. There is option to disable default WooCommerce order details on the Thank You page, and leave only custom cuntent of the HTML block.

Theme Settings   - > Single product  - > Add to cart options - > Before "Add to cart button" & After "Add to cart button" These fields are useful to place additional information applied for all the products in the best place of the product page.

This option allows adding Buttons, Pop-up or other content.

Theme Settings  - > Single product   - > Tabs - > Additional tab content is presented as Shipment and Delivery tab on Product pages on the Demo sites

Below the view of the Shipping and Delivery tab on the front-end:

This tab can have any title and content which will be shown globally on all the products.

Each product page has the option to add a custom tab individually for the product. This tab will appear in the line with Description, Reviews, Additional information. This tab main contains special conditions or any other product specifications.

Extra content block:  the dropdown allowing to choose and set any HTML block created. The option is provided in the Product Settings (custom metabox from theme) of product pages

Extra content position: After content, Before Content, Prefooter

Demo

This option allows to create a promotional page or landing page due to the flexibility of locations and unlimited content volume which is possible to be inserted

HTML block may be inserted to a page, post, product, HTML block, product page by means of WPBakery page builder element Raw HTML:

The best and correct way  HTML block  adding is to save it as a template and insert from the template library:

Saving  the whole HTML block as a template:

Saving a section from the HTML block:

Saving a row  from the HTML block:

Inserting the template:

Category page, Attribute page, Tag page by means of inserting HTML block shortcode into the Description field:

This option allows creating and eye-catching banners in categories/attributes/tags descriptions, here is the DEMO of how it may look like

Woocommerce filter attribute widget is visible only on the shop/product categories pages. WoodMart provide the option to include product categories and attribute filters on any page by means of Custom filter forms

One of the ways to implement is to show the filters in a page sidebar: Custom filters are added to an HTML block, and then this HTML block can be displayed in any sidebar by means of WOODMART HTML Block widget in Appearance > Widgets:

If you want to display different content for mobile devices, for example, to show the light version of a page, you can create the page in the HTML block and then choose and set it from the drop-down in the Mobile version HTML block in the Page Settings

Scroll To Top