Responsive Pro Modules

From the WordPress dashboard navigate to Appearance > Customize to find the following options

Global Settings

Colors & Background

Background Image (Pro)

Background Image for selected box layout

Spacing

Outside Container - You can increase or decrease the outside padding for the selected Layout Style on your website.

Inside Container - You can increase or decrease the inside padding for the selected Layout Style on your website.

Search Style - If you have selected Search Icon as last item in above option then you can select it's style as default or full screen.

Menu Toggle Border Width (px) - Update width for the mobile menu border.

Enable Sticky Header - Check this box if you want to have a fixed header upon scrolling down the page.

Shrink Logo on Scroll - Check this box if you want the logo to shrink upon scrolling down.

Disable Sticky Header on Mobile Menu - Check this if you don't want sticky header on Mobile Menu.

Different Logo for Sticky Header - Check this box if you want a different logo for the fixed header. This will work if you have enabled sticky header.

Logo for Sticky Header - Select a logo for fixed header from here. Make sure the sticky header is enabled to see this feature.

Sticky Header Colors

The following options will be visible on sticky / fixed header which will appear on scrolling.

  • Background Color - Background color for menu.

  • Site Title Color - Color for site title

  • Site Title Hover Color - Hover color for site title

  • Site Tagline Color - Color for site tagline

  • Menu Background Color - Background color for menu.

  • Active Menu Background Color - Background color for active menu.

  • Menu Item Link Color - Text color for menu link text.

  • Menu Item Link Hover Color - Hover color for link text.

  • Sub Menu Background Color - Background color for sub menus.

  • Sub Menu Link Color - Link color for sub menus.

  • Sub Menu Link Hover Color - Link color for sub menus.

Page

Typography

Page Title - Update the typography of the Page Title. You can update following options

  • Font Family - Select font family from large number of Google fonts.

  • Font Weight - Select font weight.

  • Font Style - Select font family style from normal and italic.

  • Text Transform - Select between Default, Capitalize, Lowercase or Uppercase.

  • Font Size - Select font size.

  • Line Height - Give line-height from 1-4.

  • Letter Spacing - Give letter spacing upto 10.

Blog / Archive

Blog/Archive Layouts (Desktop) - Select one of the layout for the blog / archive page.

  • Standard Layout

  • Datebox/Image To Right

  • Datebox/Image To Left

Enable Date Box - Enable datebox on blog / archive page.

Date Box Style - Select style for date box as Square or Round.

Blog / Archive

  • Post Pagination - You can select if the blog page or archive page should display all posts on single page or use the default option for pagination. If the Infinite option is selected first set of blog posts will be displayed and when a user scrolls to the bottom of page next set of posts will be loaded.

Spacing

Outside Container - You can increase or decrease the outside padding for the Blog/Archive on your website.

Inside Container - You can increase or decrease the inside padding for the Blog/Archive on your website.

Typography

Blog Title - Update the typography of the Blog Title on Blog Page from here.

Single Post

Typography

Post Title - Update the typography of the Post Title on Single Post Pages.

Spacing

Outside Container - You can increase or decrease the outside padding for the Single Blog Post on your website.

Inside Container - You can increase or decrease the inside padding for the Single Blog Post on your website.

Colors & Background

Background Image - Background Image for sidebar.

Spacing

Outside Container - You can increase or decrease the outside padding for the Sidebar on your website.

Inside Container - You can increase or decrease the inside padding for the Sidebar on your website.

Layout

Footer Elements - Here you can set the order of Social Icons, Footer Menu, and Copyright Text in which they appear. You need to drag the elements to change their order. Also, you can toggle click on the eye icon in front of each element to show/hide that element in the footer.

  • Hide Powered By Responsive Theme - Select this option to remove the text 'Powered By Responsive Theme'.

Colors & Background

Background Image - Background Image for footer.

WooCommerce

Distraction Free

You can use this feature to enable Distraction Free WooCommerce to hide the header and footer on WooCommerce pages.

  • Disable Header & Footer on Shop Page? : Check this checkbox to disable the header and footer on WooCommerce Shop Page.

  • Disable Header & Footer on Single Product Page? : Check this checkbox to disable the header and footer on WooCommerce single product page.

  • Disable Header & Footer on Cart Page? : Check this checkbox to disable the header and footer on WooCommerce Cart Page.

  • Disable Header & Footer on Checkout Page? : Check this checkbox to disable the header and footer on WooCommerce Checkout Page.

  • Disable Header & Footer on Account Page? : Check this checkbox to disable the header and footer on WooCommerce Account Page.

  • Disable Header & Footer on Product Category Page? : Check this checkbox to disable the header and footer on WooCommerce Account Page.

  • Disable Header & Footer on Product Tag Page? : Check this checkbox to disable the header and footer on WooCommerce Account Page.

Product Catalog Options

Layout

Breadcrumbs - You can enable / disable the breadcrumb on shop page.

Toolbar - You can hide or show the sorting toolbar on shop page from here.

Box Shadow - Give box shadow to product summary box on shop page from here.

Box Shadow Hover - Give box shadow to product summary box on shop page from here on hovering

Shop Product

Product Image Hover Style - Select a hover style for product images on shop page.

Shop Pagination - You can select if the shop page should display all products on single page or use the default option for pagination. If the Infinite option is selected first set of products will be displayed and when a user scrolls to the bottom of page next set of products will be loaded.

Shop Pagination Style - If you have selected the default layout for pagination then you can select the style of the numbers as square or circle.

Event to Trigger Infinite Loading - If you have selected Infinite layout for pagination then you can select how you want to trigger the infinite loading; by scrolling or by clicking a button.

Load More Text - If you have selected event to trigger infinite layout as Click, then you can edit the text of the button from here.

Shop Quick View - You can enable the quick view of product images on hovering on image, on clicking on image, or after summary.

Off Canvas Filter

Enable Off Canvas Filter - You can enable Off canvas filter with this setting. A filter button is added which displays Off Canvas Filter.

Off Canvas Button Text - You can change filter button text here.

Enable Off Canvas Close Button - You can add a close button to the Off Canvas Filter.

Close Button Color - You can change the close button color of Off Canvas Filter.

Close Button Hover Color - You can change close button hover color of Off Canvas Filter.

Native Cart Popup

Enable popup - Enables Native Cart Popup.

Preview Popup in Customizer - Previews the Popup in customizer.

Element Positioning - Here you can set the order of Title, Content, Buttons, and Bottom Text in which they appear. You need to drag the elements to change their order. Also, you can toggle click on the eye icon in front of each element to show/hide that element on the page.

Title Text - Here you can set the title of the popup.

Content - Here you can set the content of the popup. Here you can also use Shortcodes [responsive_woo_cart_items] for items count in cart and [responsive_woo_total_cart] for total amount of cart.

Continue Button Text - Here you can set Continue Button text.

Go to Cart Button Text - Here you can set Go To Cart Button Text.

Bottom Text - Here you can set the Bottom Text of the Popup Cart. You can use the Shortcode [responsive_woo_free_shipping_left] for Woocommerce Free Shipping details.

Popup Width - Here you can set the Popups Cart’s Width for Desktop in px.

Popup Tablet Width - Here you can set the Popups Cart’s Width for Tablet in px.

Popup Mobile Width - Here you can set the Popups Cart’s Width for Mobile in px.

Popup Height - Here you can set the Popups Cart’s Height for Desktop in px.

Popup Tablet Height - Here you can set the Popups Cart’s Height for Tablet in px.

Popup Mobile Height - Here you can set the Popups Cart’s Height for Mobile in px.

Popup Padding - Here you can set the padding of The Popup cart for Desktop, Tablet, Mobile.

Popup Border Radius - Here you can set the border radius of of Popup Cart for Desktop, Tablet, Mobile.

Popup Background - You can set the Popup’s Background color here.

Popup Overlay color - You can set the Popup’s Overlay color here.

Check Mark Background - You can set the Check mark’s Background color here.

Check Mark - You can set the Check Mark’s color here.

Content color - You can set the Popup’s Background color here.

Continue Button Background - You can set the Continue Button Background color here.

Continue Button color - You can set the Continue Button text color here.

Continue Button Border color - You can set the Continue Button border color here.

Continue Button Background: Hover - You can set the Continue Button Background hover color here.

Continue Button color: Hover - You can set the Continue Button text hover color here.

Continue Button border color: Hover - You can set the Continue Button border hover color here.

Cart Button Background - You can set the Cart Button Background color here.

Cart Button color - You can set the Cart Button text color here.

Cart Button Border color - You can set the Cart Button border color here.

Cart Button Background: Hover - You can set the Cart Button Background hover color here.

Cart Button color: Hover - You can set the Cart Button text hover color here.

Cart Button border color: Hover - You can set the Cart Button border hover color here. Bottom Text Color - You can set the Bottom Text color here.

Typography

Here you can update overall typography related for Shop Page Title, Product Title, Product Price, and Product Content. You can update following options

  • Font Family - Select font family from large number of Google fonts.

  • Font Weight - Select font weight.

  • Font Style - Select font family style from normal and italic.

  • Text Transform - Select between Default, Capitalize, Lowercase or Uppercase.

  • Font Size - Select font size.

  • Line Height - Give line-height from 1-4.

  • Letter Spacing - Give letter spacing upto 10.

  • Font Color

Product Options

Layouts

Product Elements

Image Width - Here you can change width of the image on single product pages.

Typography

Here you can update overall typography related for Product Title, Product Price, Product Content, and Breadcrumbs. You can update following options

  • Font Family - Select font family from large number of Google fonts.

  • Font Weight - Select font weight.

  • Font Style - Select font family style from normal and italic.

  • Text Transform - Select between Default, Capitalize, Lowercase or Uppercase.

  • Font Size - Select font size.

  • Line Height - Give line-height from 1-4.

  • Letter Spacing - Give letter spacing upto 10.

  • Font Color

Cart Options

Layouts

Icon - If the cart icon is set to be displayed on all devices, you can choose a different cart icon.

Style - If the cart icon is set to be displayed on all devices, you can choose a style for mini cart.

Color - If the cart icon is set to be displayed on all devices, you can choose a color for mini cart.

Display Cart Title - If the cart icon is set to be displayed on all devices, you can select this if you wish to display cart title alongside mini cart icon.

Display Cart Total - If the cart icon is set to be displayed on all devices, you can select this if you wish to display total cart value alongside mini cart icon.

Last updated