We thank you for purchasing our product. Hope our product will be of great help for you to succeed. We appreciate your decision to read the manual before the request for our support.

Puca – Optimized Mobile WooCommerce Theme

Puca is a flexible and customizable WooCommerce Multi-Store WordPress Theme that installs and changes any item in a matter of minutes via Powerful Theme Options, you can also customize Google fonts. No code is easy and simple.

Puca can be used for a variety of purposes, specially built store for the Fashion, Furniture, Electronics,... Puca is fully compatible with all SEO standards helping your business have a high search on Google Search. Each page of Puca is fully compliant, so it can be viewed easily regardless of different screen devices such as desktops, tablets and mobile phones. All that makes your customers have an enjoyable shopping experience.

Puca is a high quality and intelligent design that comes with 350+ different pages that will give you a great choice. You will easily find the best for your purpose without spending too much time.

It features deep integration with WooCommerce core plus several of the most popular plugins:

To install this theme you must have a working version of WordPress. Please refer to WordPress documentation for further instructions. You can download the latest version of WordPress here https://wordpress.org/download/

(for legacy environments also PHP versions 5.3.x will work but it is recommended to be on at least PHP 5.6 and preferably PHP 7.0. WordPress recommends PHP 7)

All of our items come with free support, and we have an advanced ticket system to handle your requests. Support is limited to questions regarding the theme’s features or problems with the theme. We are not able to provide support for code customizations or third-party plugins. If you need help with anything other than minor customizations of your theme, we suggest enlisting the help of a developer.

How To Receive Free Support

  • Step 1 – Go to Ticket System (https://tickets.thembay.com/) and Click Submit a ticket.
  • Step 2 – Provide all requires information: Product Name, Purchase Code, your username on Themeforest.net and URL to your page to verify your license.
  • Step 3 – Provide more details about the problem, descibe, screenshot ...
  • Step 4 – Submit ticket and wait our response (within 14-24 hours)

How to find your ThemeForest Item Purchase Code

To find your licence key/purchase code you need to log into your ThemeForest account and go to your Downloads page.
Locate some of the Themes Kingdom themes you purchased in your Downloads list and click on the Download and next on the License Certificate & purchase code link in drop-down menu.
After you have downloaded the certificate you can open it in a text editor such as Notepad and copy the Item Purchase Code.

After purchasing our theme, you need to go your download area, click on button Download and select download All files & documentation.

After download completed, you need to unzip the package and select the way you want to install the theme.

Once the download is complete, unzip the file and you would see the following packages:

  • Documentation - our detail documentation for the theme
  • Licensing - the theme license
  • Sample Data - the sample data of the demos, you can import it
  • Theme - for manual installation

You can install Puca theme directly in Wordpress Admin or upload files via FTP

Theme Installation via WordPress

Please, follow the steps below to install Puca Theme (Make sure you had extract files).

  • Step 1 – Login to your WordPress Dasrdoard.
  • Step 2 – Navigate to Appearance ► Themes.
  • Step 3 – Click Add New button on top of the page.

  • Step 4 – Then click Upload Theme.
  • Step 5 – Next, Browse to the zip file and click Install now for the theme to be uploaded and installed.

  • Step 6 – After done installing, click Activate the theme

IMPORTANT NOTE

You need install all required plugins after install parent theme. You should only install Child theme after complete install all required plugin.

Watch the video "Theme Installation via WordPress" tutorial

Theme Installation via FTP

Using an FTP software like File Zilla or CuteFTP to upload the theme files to your WordPress site.

The first, extract the theme file "puca.zip", you will have a folder "puca" include all theme files and folders (css, images, fonts...).

Please, follow the steps below to install the theme via FTP:

  • Step 1 – Log into your hosting space (server) via FTP client.
  • Step 2 – In extracted archive folder, find puca.
  • Step 3 – Upload the puca folder to your server in path ROOT/wp-content/themes/.
  • Step 4 – The uploaded path should be like this: ROOT/wp-content/themes/puca/.
  • Step 5 – Login to your WordPress Dasrdoard and go to Appearance ► Themes and activate the Puca theme.
Watch the video "Theme Installation via FTP" tutorial

Install Plugins

Please, follow the steps below to install required plugins:

  • Step 1 - After activating the theme, you will be asked to installed the required and recommended plugins, you can proceed by clicking on Begin installing plugins

  • Step 2 – In the next page, check all the plugins that you want to install then on the drop down Bulk Actions, choose Install then click Install, the plugin installation process will start.

  • Step 3 – Check all the plugins that you want to activate then on the drop down Bulk Actions, choose Activate and click Apply, the plugin installation process will start. Wait for all the plugin activated then you can start customizing your website as you wish

Watch the video "Install Plugins" tutorial

We very happy to provide for customer a new function to import data more quickly. It is "One click import"

With "One click import", customer do not import step by step data as import usual. It import all data like : Content, Widget, Revolution slider, Menu, Customize...

To use the "One click import" function, you need to meet the following requirements:

  • Step 1 - Login to your WordPress Dasrdoard.

  • Step 2 - Go to Tools > Tbay Demo Import

  • Step 3 - Download Demo data

  • Step 4 - Install Demo Data: Select the Demo you want to import all data.

  • Step 5 - Wait to importing success: The import process can take about 10 minutes. Please don't refresh the page.

  • Step 6 - Configure Mega Menu

  • Step 7 - Choose Footer Menu

  • Step 8 - Choose Shop Page: Go to WooCommerce > Settings > Products > General > Shop Page

  • Step 9 - Choose Cart and Checkout Page: Go to WooCommerce > Settings > Advanced

  • Step 10 - Create Variable Products: You can read more here => https://docs.woocommerce.com/document/variable-product/

    Watch the video "Configure Variable Products & Products Filter" tutorial
Watch the video "Installation Theme and Import All Sample Data for new website" tutorial full

If you have a website with data available, follow these steps to use the "Puca" theme for your website.

  • Step 1 - Install and activate theme.

  • Step 2 - Install and activate the required plugins.

  • Step 3 - Go to Tools > Tbay Demo Import

  • Step 4 - Download Demo data

  • Step 5 - Activate skin that you want

  • Step 6 - Create Homepage and Footer as we provide

    Watch the video "Create Homepage and Footer as we provide" tutorial
  • Step 7 - Choose Footer Menu

  • Step 8 - Choose Shop Page: Go to WooCommerce > Settings > Products > General > Shop Page

  • Step 9 - Choose Cart and Checkout Page: Go to WooCommerce > Settings > Advanced

  • Step 10 - Set Homepage default

  • Step 11 - Select Header and Footer default in Theme Options

Watch the video "Installation Theme and Import All Sample Data for website available" tutorial

Each Puca's skin uses a separate data, so if you want to switch between skins you need to reset the data, then import the data again.
Use this plugin to reset the WordPress database : https://wordpress.org/plugins/wordpress-reset/

Step 1 - Install Wordpress Reset plugin.

Step 2 - Reset Database

Step 3 - Select the skin you want to import the data

Watch the video " Use Wordpress Reset plugin if you want import sample data one again" tutorial

After import all data, you can select the homepage you want (select only skin that in the imported data)

Watch the video "Switch homepage in each skin" tutorial

1. Page not found

In this case, you only need to import the data again.




2. If "Download Demos" don't work, you should upload the sample data manually:

- Upload Data to the directory "ROOT/wp-content/uploads/{theme_name}_import/".
- Eg "ROOT/wp-content/uploads/Puca_import/"
- Can use the "WP File Manager" plugin and import as like this video's tutorial or upload files via FTP.

Watch the video "If "Download Demos" don't work" tutorial


3. If you have problems importing the demo ( example : infinite loading, error 505 with when using wordpress importer ) then you may have a problem with the server settings. Please check these:

1. If the import stalls and fails to respond after a few minutes, or it fails with a simple error message like “Import failed,” You are suffering from PHP configuration limits that are set too low to complete the process. You should contact your web host and ask them to increase those limits to a minimum as follows:

  • max_execution_time 3600
  • max_input_time 3600
  • memory_limit 256M
  • post_max_size 64M
  • upload_max_filesize 64M
  • max_input_vars 3000
  • allow_url_fopen on (!important)

You can verify your PHP configuration limits by installing a simple plugin found here. And you can also check your PHP error logs to see the exact error being returned.

2. Also if possible update your PHP version to 7.2

3. Save all config in Woocommerce before import data

After doing this you can reset your database using the WordPress Database Reset Plugin and try to re-import the demo data ( WARNING : Reset the database will make you lost all the data of your current wordpress )

If you still have problem your web host may uses process watching software that prevents bulk processing on their web servers.

If you have problem please submit a ticket and we will help you to import the demo.

You can upload your logo image in the Puca Options. If the logo is not uploaded, then your site name will be used.
Please, follow the steps below to upload your logo:

Step 1 - Login to your WordPress Dashboard.

Step 2 - Go to Puca Options > Header Tab

Step 3 - Upload your logo by clicking on Select Image (our current Puca logo is 112px x 22px).

Choose Mobile Logo here:

1. Creating your menu

Step 1- Login to the WordPress Dashboard.

Step 2- From the 'Appearance' menu on the left-hand side of the Dashboard, select the 'Menus' option to bring up the Menu Editor.

Step 3 - Select Create a new menu at the top of the page.

Step 4 - Enter a name for your new menu in the Menu Name box.

Step 5 - Click the Create Menu button. Your menu is now defined, and you can now add pages to it (steps below).

2. Adding pages to your menu

Step 1 - Locate the pane entitled Pages.

Step 2 - Within this pane, select the View All link to bring up a list of all the currently published Pages on your site. 

Step 3 - Select the Pages that you want to add by clicking the check box next to each Page's title.

Step 4 - Click the Add to Menu button located at the bottom of this pane to add your selection(s) to the menu that you created in the previous step.

Step 5 - Click the Save Menu button once you've added all the menu items you want. Your custom menu has now been saved.

The Screen Options allow you to choose which items you can use to add to a menu. Certain items, like Posts or Products are hidden by default. The Screen Options are located in the top right corner of your WordPress Dashdoard.

3. Assigning a Menu to a Location

Once you've created a menu and filled it with items, it's time to assign it to one of the theme pre-defined locations.

- Go to Appearance > Menus and click Manage Locations.

Menu is assigned after import data by "One click import".

4. Configure Mega Menu

With Tbay Megamenu, you can enjoy creating the Mega Menu you want

Step 1 - Add new Megamenu

Step 2 - Choose Mega menu for parent menu

Watch the video "Configure Mega Menu" tutorial

Go to Apperances -> Settings -> Reading

Config in Front page

Set Up Tbay Footer

Step 1 - From admin Dashboard, navigate to Tbay Footer > Add New Footer

Step 2 - Using Visual Composer backend editor mode then add element to your Footer 

Step 3 - Build your footer style with unlimited layout

Footer layouts for you.

Footer 1.

Front end look like :

Visual Element Layout setting

Step 4 - After create your footers. Choose footer for website in Theme Options.

If you want specific Footer for one of your pages. Please go to your page configuration. Select Footer version you want to display only on that page.

Watch the "Set Up Footer Video tutorial" tutorial

Show Excerpt in the post

- Choose Shop Page: Go to WooCommerce > Settings > Products > General > Shop Page

- Choose Cart and Checkout Page: Go to WooCommerce > Settings > Advanced

- Show Countdown Timer and Video in product

Step 1: Go to Tbay Testimonial from Dashboard then create content of Testimonials

Step 2: Drag Tbay Testimonial elements by using Visual Composer on page you want to display testimonials.

You can choose some setting like title, skin ....

Demo:

Step 1: Go to Tbay Brands from Dashboard then create Brands

Step 2: Drag Tbay Brands elements by using Visual Composer on page you want to display brands.

You can choose some setting like title, number of brands ....

Demo:

1. Create Contact Form.

Use this plugin to make the contact form on contact page. Navigate to Contact - Contact Forms, there is a form named Contact form 1, if you want to create a new form, click on Add New button.

Click on the form title to edit form, copy this code and paste into Form box:

<div class="form-horizontal"> <div class="form-group"> <div class="col-sm-2"><label for="name">Name<span class="required">*</span></div></label> <div class="col-sm-10"> [text* text-799 class:required class:form-control id:your_name akismet:author] </div> </div> <div class="form-group"> <div class="col-sm-2"> <label class="control-label" for="email">Email<span class="required">*</span></label> </div> <div class="col-sm-10"> [email* email-257 class:required id:your_email akismet:author] </div> </div> <div class="form-group"> <div class="col-sm-2"><label class="control-label" for="message">Message</label></div> <div class="col-sm-10"> [textarea textarea-552 class:required id:your_message] </div> </div> <div class="form-group form-group-submit"> <div class="col-sm-2"><label class="control-label" for="your_message"></div> <div class="col-sm-10"> [submit class:btn class:btn-default "submit"] </div> </div> </div>

2. Create Contact Page

Step 1 - Log in to your WordPress Administration Panel (Dasrdoard)..

Step 2 - Click on Pages > Add New.

Step 3 - Give your page a name then Change the Editor to Backend Editor ( you need to have the Visual Composer plugin activated ).

Step 4 - Click on the Add Element button

Step 5 - Select the Contact Form 7 element.

Step 6 - The Contact Form 7 Settings should appear. Select the Form you want to use you can also customize the Color and change the fields layout and button design
Step 7 - Update / Publish your page

Watch the "Configure Contact Page Video" tutorial

3. Add Google reCAPTCHA to Contact Form.

Watch the "Add Google reCAPTCHA to Contact Form" tutorial

1. MailChimp API

The API key for connecting with your MailChimp account. Get your API key here.

2. Form

<div class="mail-style1"> <div class="input-group"> <input id="mc4wp_email" class="form-control input-newletter" name="EMAIL" required="required" type="email" placeholder="Enter your e-mail ..." /> <span class="input-group-btn"> <input class="btn btn-default" type="submit" value="SIGN UP" /> </span> </div> </div>

Watch the "MailChimp Video" tutorial

Puca Theme use Customizer provides an ultra effective and intuitive way to customize theme layout & setting with real-time preview. Bring all of settings to customizer, you do not need to using another theme option anymore

To access Customizer go to your admin Dashboard  Navigate to Appearance >> Customize

Manage overviews such as: Active Skins, Preload Website, Enable Config Image Size.

- Activated Skin: We offer 4 rich choices for you: Fashion (14 demos), Fashion 2 (9 demos), Super Market (3 demos), Super Market 2 (5 demos), Furniture & Decor (24 demos).

- Preload Website: Choose a Preloader Images for your website.

Watch the video "Choose a Preloader Images for your website" tutorial See more the video "Custom Preloader with your logo" tutorial

- Enable Config Image Size: Turn on this function then customize the image size here: Appearance > Customize > WooCommerce > Product Images

Upload Logo, Select your header style, config Sticky Header and Search Form

- Select Header Layout: Each skin provides different types of headers

- Upload Logo: Upload your logo for Desktop and Tablet

- Keep Header: Enable/Disable sticky header

- Search Form: Configure search form that you want

Watch the video "Header Configure in Theme Options" tutorial

Select Footer Layout Type and manage Back to Top button.

- Select Footer Layout: Each skin provides different types of footers

- "Back to Top" Button: Enable or disable "Back to top" button.

Watch the "Footer Configure Video" tutorial

Upload Mobile Logo, Hidden Footer Mobile and config number of products in a row on mobile.

Mobile Header

- Select Mobile Header Layout: Set your header design for mobile devices

- Upload Mobile Logo: Upload your logo for mobile devices

Watch the "Mobile Header Video" tutorial

Mobile Footer

- Show Mobile Footer: Show/Hide Mobile Footer

Watch the "Mobile Footer Video" tutorial

Mobile Menu

Watch the "Mobile Menu Video" tutorial

Mobile WooCommerce

- Product Column: You can choose to show one or two products per line in the mobile

- Show "Add to Cart" Button: Enable or disable in Home and Shop page

- Show Quantity: Enable or disable in Home and Shop page

Watch the "Mobile WooCommerce Video" tutorial

Manage global setting for Blog.

- Breadcrumb: Enable or disable Breadcrumb

Blog Article

- Blog Layout: We provide a lot of different types of blogs

- Left, Right Sidebar: Choose Sidebar for Left or Right on Blog page

- V45 Left, Right Sidebar: Choose Sidebar for Left or Right on Blog page (Only for v4 and v5)

- Columns: Select the number of posts displayed per line

- Image Size: Choose size of the image that you want to show

Watch the "Blog Article Video" tutorial

Blog Post

- Blog Single Layout: Select the layout you want to apply.

- Single Blog Left, Right Sidebar: Choose a sidebar for left or Right sidebar.

- Show Social Share: Show/Hide Social Share on the post page

- Show Releated Posts: Show/Hide Releated Posts

Watch the "Blog Post Video" tutorial

Manage global setting for Woocommerce

- Sale Tag Settings: Optional "Sale label" format as you want

- Show WooCommerce Catalog Mode: Enable/Disable WooCommerce Catalog Mode

- Show Password Strength Meter: Enable/Disable Password Strength Meter

- Mini-Cart Position: Choose the position of Mini-cart that you want.

- Breadcrumb: Enable or disable Breadcrumb

Watch the "WooCommerce Options Video" tutorial

- Product Layout: Select the layout you want to apply.

- Title, Description, Image in category: Enable/Disable title, description, image

- Left/Right Sidebar: Choose a sidebar for left or Right sidebar.

- Display Mode: Choose Grid or List

- Number of Products Per Page

- Product Columns: Select the number of columns to display (from 1 to 6).

- Product Pagination Style: Pagination Number or Load More Button

- Product type fillter: Show/Hide fillter

- Numbered Product on page: Show/Hide Numbered Product

- Product category fillter: Show/Hide category fillter

- Show Second Image (Hover): Show/Hide Second Image when hover

Watch the "Product Archives Video" tutorial

Single product sample layout

Single product custom layout

Other Single Product

Watch the "Single Product" video tutorial

Manage global setting for Portfolio: Portfolio Columns, Projects per page, Portfolio Full Wide, ...

- Breadcrumb: Enable or disable Breadcrumb

Portfolio Archives

- Columns: Select the variation you want to apply on your store.

Portfolio Single

- Single Portfolio Layout: Select the layout you want to apply.

- Show Social Share: Show/Hide Social Share

Watch the "Portfolio Configure tutorial" video tutorial

Manage Other Pages as 404 Page,...

Custom style for theme: Typography, Top Bar, Header, ...

Main: Body Background, Main Theme Color, ...

Typography: Font Source, Google Code, ...

Top Bar: Background, Text Color, ...

Header: Background, Text Color, ...

Main Menu: Link Color, Link Color Active, ...

Footer: Background, Heading Color, ...

Copyright: Background, Text Color, ...

Enable Code Share and Addthis your code. You get your code share in https://www.addthis.com

Watch the "Social Share tutorial" video tutorial

- Custom CSS

- Custom JS

Watch the "Custom CSS/JS" video tutorial

The following is the configuration only for the "Fashion 1" skin

You can configure it at the Widget:

Code CSS if you need to override style it:

.header-bottom-main {
   background: #000;
}
.top-shipping .content {
   color: #fff;
   font-weight: 200;
   font-size: 12px;
}

You can configure it at the Widget:

You can configure it at the Widget:

Code HTML:

<div class="content"><b>(+99) 123 - 456 -789 -</b> U.S.A</div>

You can configure it at the Widget:

You can configure it at the Widget:

The following is the configuration only for the "Fashion 2" skin

You can configure it at the Widget:

Code HTML:

<div class="content"><i class="icon-call-out icons"></i><span>Call us now (+84) 098 260 196</span></div>

You can configure it at the Widget:

The following is the configuration only for the "Smarket 1" skin

You can configure it at the Widget:

Code HTML:

<p class="top-welcome">Welcome to Puca Supermarket.</p>

You can configure it at the Menu:

Change the icons or images here:

You can configure it at the Widget:

The following is the configuration only for the "Smarket 2" skin

You can configure it at the Widget:

Code HTML:

<div class="top-shipping"><i class="icons icon-plane"></i><p>Free shipping for all order over $500.</p></div>

You can configure it at the Widget:

Code HTML:

<ul> <li><i class="icon-envelope icons"></i> contact@example.com</li> <li><i class="icon-phone icons"></i>(+084) 908 8888 8888</li> </ul>

You can configure it at the Menu:

You can configure it at the Menu:

Change the icons or images here:

You can configure it at the Menu:

Change the icons or images here:

The following is the configuration only for the "Furniture" skin

You can configure it at the Widget:

Code HTML:

Hodilay gifts for everyone. Enjoy 70% off for all products only today.<a href="#">View details</a>

You can configure it at the Widget:

Code HTML:

<div class="content"><i class="icons icon-phone"></i><span>Free call (+001) 1234 5678</span></div>

You can configure it at the Widget:

You can configure it at the Widget:

Code HTML:

<span class="copyright">&copy; 2018. By <a href="#">Thembay.</a></span>

Choose Shop Page: Go to WooCommerce > Settings > Products > General > Shop Page

Choose Cart and Checkout Page: Go to WooCommerce > Settings > Advanced

Show Countdown Timer and Video in product

Watch the "Countdown Timer in product" video tutorial

Enable / Disable this feature in Theme Options

Watch the "Display Category Image and Description" video tutorial

Watch the "Configure Variable Products & Products Filter" video tutorial

Watch the "Configure WooCommerce Currency Switcher" video tutorial

Watch the "Configure WooCommerce Sale Label" video tutorial

Watch the "Import Slider Template" video tutorial

Watch the "Slider Revolution Responsive Tutorial" video tutorial

Watch the "How to update Slider Revolution and WPBakery Page Builder?" video tutorial

Watch the "Tbay Element" video tutorial

Watch the "How to update Slider Revolution and WPBakery Page Builder?" video tutorial

Loco Translate provides in-browser editing of WordPress translation files.

It also provides localization tools for developers, such as extracting strings and generating templates.

Watch the "Loco Translate" video tutorial

The easiest way to translate theme to the language of your choice is to use "WPML" plugin.

- To begin, be sure you have the WPML Plugin installed and activated, along with the WPML String Translation plugin.

- To set up WPML the first time, follow their Getting Started Guide.To begin translating, select WPML (in the Dashboard menu) -> String Translation. You should see a list of the strings in the theme (there should be only four), with blue translation links to the right. Click these links to reveal the list of languages you use on your blog and the associated translations.

- How to set and translate main features of the theme

- How to scan strings coming from the theme

- How to translate strings using String Translation

- If adjustment is needed for WPML language switcher please also add this

- If you need more help with WPML plugin. Please go WPML Forum

Watch the video tutorial Watch the video "[Loco Translate] Translate "Shipping" string in WooCommerce" Watch the video "[Puca - Furniture] How to change the text below Coupon in Page Cart"

Puca is created with speed and performance in mind. On it's own, Puca is highly optimized and provides you with the ability to get extremely high speed test scores on tools like GTMetrix, Google PageSpeed Insights, and Web Page Speed Test. Having said this, your site's speed and performance does not entirely rely on the theme and what you put into it also has a great impact on your speed scores. Continue reading below to learn more about site optimization.

When it comes to optimization, Puca plays a much smaller part than you would imagine. Puca is optimized so that it's fast on it's own, but ultimately, user content will dictate how fast your site will perform. Images play a huge factor in speed results, as well as hosting, server, extra plugins, content and more.

For example, if you have a site that's 1100px wide and upload a 2000px image on a page, your page speed score will drop heavily. This is because places like Google or GTMetrix will see a 1100px container that unnecessarily has an image on it that is twice it's size.

Caching and Minification is important in any website. Whenever a user visits your site, a lot of information is requested such as images, styling, as well as retrieving your content from the WordPress database. These factors plus the amount of visitors you have can significantly affect your site's total page loading time. Caching plugins help reduce this by showing your viewers a static version of your site.

These settings are not a one size fits all. The plugins listed below interacts differently with each server, and each situation can be different. Contact your host as well because they may have specific caching rules on their servers.

Below is a list of our recommended cache plugins to optimize your sites speed. These plugins have been tested with Puca, and we find that they work well with the theme. However, please note that these plugins interacts differently with different server setups. We also do not provide support for any issues caused by third party plugins.

CSS Excludes for "LiteSpeed Cache":

/wp-content/plugins/woocommerce/assets/css/woocommerce-smallscreen-rtl.css
/wp-content/plugins/woocommerce/assets/css/woocommerce-smallscreen.css

Recommended Cache Plugins:

Recommended Cache Plugins:

Add the following code to the end of the file

# BEGIN GZIP <IfModule mod_mime.c> AddType application/x-javascript .js AddType text/css .css </IfModule> <IfModule mod_setenvif.c> <IfModule mod_headers.c> SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s,?\s(gzip|deflate)?|X{4,13}|~{4,13}|-{4,13})$ HAVE_Accept-Encoding RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding </IfModule> </IfModule> FileETag INode MTime Size <ifmodule mod_deflate.c> AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript <FilesMatch "\.(css|js|xml|php)$"> SetOutputFilter DEFLATE </FilesMatch> </ifmodule> # END GZIP # BEGIN Cache-Control Headers <ifModule mod_headers.c> <filesMatch "\.(ico|jpe?g|png|gif|swf)$"> Header set Cache-Control "public" </filesMatch> <filesMatch "\.(css)$"> Header set Cache-Control "public" </filesMatch> <filesMatch "\.(js)$"> Header set Cache-Control "private" </filesMatch> <filesMatch "\.(x?html?|php)$"> Header set Cache-Control "private, must-revalidate" </filesMatch> <FilesMatch "\.(js|css|xml|php|gz)$"> Header append Vary: Accept-Encoding </FilesMatch> </ifModule> # END Cache-Control <IfModule mod_gzip.c> mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$ mod_gzip_item_include handler ^cgi-script$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.* </IfModule> <IfModule pagespeed_module> ModPageSpeed on ModPagespeedRewriteLevel CoreFilters ModPagespeedEnableFilters prioritize_critical_css ModPagespeedEnableFilters defer_javascript ModPagespeedEnableFilters sprite_images ModPagespeedEnableFilters convert_png_to_jpeg,convert_jpeg_to_webp ModPagespeedEnableFilters collapse_whitespace,remove_comments </IfModule> <IfModule mod_expires.c> ExpiresActive on ExpiresDefault "access plus 1 month" # CSS ExpiresByType text/css "access plus 1 year" # Data interchange ExpiresByType application/atom+xml "access plus 1 hour" ExpiresByType application/rdf+xml "access plus 1 hour" ExpiresByType application/rss+xml "access plus 1 hour" ExpiresByType application/json "access plus 0 seconds" ExpiresByType application/ld+json "access plus 0 seconds" ExpiresByType application/schema+json "access plus 0 seconds" ExpiresByType application/vnd.geo+json "access plus 0 seconds" ExpiresByType application/xml "access plus 0 seconds" ExpiresByType text/xml "access plus 0 seconds" # Favicon (cannot be renamed!) and cursor images ExpiresByType image/vnd.microsoft.icon "access plus 1 week" ExpiresByType image/x-icon "access plus 1 week" # HTML ExpiresByType text/html "access plus 0 seconds" # JavaScript ExpiresByType application/javascript "access plus 1 year" ExpiresByType application/x-javascript "access plus 1 year" ExpiresByType text/javascript "access plus 1 year" # Manifest files ExpiresByType application/manifest+json "access plus 1 week" ExpiresByType application/x-web-app-manifest+json "access plus 0 seconds" ExpiresByType text/cache-manifest "access plus 0 seconds" # Media files ExpiresByType audio/ogg "access plus 1 month" ExpiresByType image/bmp "access plus 1 month" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" ExpiresByType image/webp "access plus 1 month" ExpiresByType video/mp4 "access plus 1 month" ExpiresByType video/ogg "access plus 1 month" ExpiresByType video/webm "access plus 1 month" # Web fonts # Embedded OpenType (EOT) ExpiresByType application/vnd.ms-fontobject "access plus 1 month" ExpiresByType font/eot "access plus 1 month" # OpenType ExpiresByType font/opentype "access plus 1 month" # TrueType ExpiresByType application/x-font-ttf "access plus 1 month" # Web Open Font Format (WOFF) 1.0 ExpiresByType application/font-woff "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" ExpiresByType font/woff "access plus 1 month" # Web Open Font Format (WOFF) 2.0 ExpiresByType application/font-woff2 "access plus 1 month" # Other ExpiresByType text/x-cross-domain-policy "access plus 1 week" </IfModule>
Watch the "Speed Up WordPress Theme" video tutorial

1. Use Cloudflare For Faster Page Load Speed, CDN, AMP & Security

This is similar to the section above on using CDN’s, but I’ve become so fond of CloudFlare since I discussed it in my best web analytics post that I’ve decided to include it separately here.

To put it bluntly, CloudFlare, along with the W3 Total Cache plugin discussed above, are a really potent combination (they integrate with each other) that will greatly improve not only the speed, but the security of your site.

Watch the "Use Cloudflare For Faster Page Load Speed, CDN, AMP & Security" video tutorial

2. Choose a good host

When starting out, a shared host might seem like a bargain (“Unlimited page views!”). It comes at another cost: incredibly slow site speed and frequent down time during high traffic periods.

If you plan on publishing popular stuff, you’re killing yourself by running your WordPress site on shared hosting.

The stress of your site going down after getting a big feature is enough to create a few early gray hairs: don’t be a victim, invest in proper hosting.

The only WordPress host I continually recommend is…

✓ WP Engine managed WordPress hosting

My sites are always blazingly fast, never have downtime when I get huge features (like when I was featured on the Discovery Channel blog!), and the back-end is very easy to use.

Last but not least, support is top notch, which is a must when it comes to hosting. Take it from someone who’s learned that the hard way.

Head on over to the WP Engine homepage and check out their offerings, you’ll be happy you did.

3. Use a content delivery network (CDN)

All of your favorite big blogs are making use of this, and if you are into online marketing using WordPress (as I’m sure many of my readers are) you won’t be surprised to here that some of your favorite blogs like Copyblogger are making use of CDN’s.

Essentially, a CDN, or content delivery network, takes all your static files you’ve got on your site (CSS, Javascript and images etc) and lets visitors download them as fast as possible by serving the files on servers as close to them as possible.

I pernewyorklly use the Max CDN Content Delivery Network on my WordPress sites, as I’ve found that they have the most reanewyorkble prices and their dashboard is very simple to use (and comes with video tutorials for setting it up, takes only a few minutes).

There is a plugin called Free-CDN that promises to do the same, although I haven’t tested it.

You need to follow these steps to perform the update:
Watch the video tutorial

This method requires more steps and manual work. First, you need to manually download the new theme package from your ThemeForest account. Once you have the new theme package, you can choose to upload the theme via WordPress or via FTP. Please see the information below for how to download new files, and install it via WordPress or via FTP.

How To Receive Free Support
  • Step 1 – Log into your ThemeForest account and navigate to your Downloads tab. Find the puca theme purchase.
  • Step 2 – Click the Download button next to it and either choose to download the Installable WordPress Theme, which is just the WordPress file, or choose to download the Main Files which is the entire package that contains everything.
  • Step 3 – After downloading the files, you need to decide if you want to install the update via FTP or via WordPress. For directions on both methods, please continue reading below.
How To Update Your Theme Via FTP
  • Step 1 – Go to wp-content > themes folder location and backup your puca theme folder by saving it to your computer, or you can choose to simply delete it. Your content will not be lost.
  • Step 2 – Retrieve the puca.zip file from your new ThemeForest download and extract the file to get the updated puca theme folder.
  • Step 3 – After extracting the updated puca theme folder, simply drag and drop the new puca theme folder into wp-content > themes folder location. Choose to Replace the current one if you did not delete the old puca theme folder
  • Step 4 – Lastly, update the included plugins. You will see a notification message letting you know a new version of the plugins are available and need to be updated. Follow the onscreen prompts to update the plugins

IMPORTANT NOTE

If you upgrade through FTP, please visit your WP-admin so any new theme options can be registered. If you do not do this and also have wp-debug turned on, you may see php notices on the front end. They will disappear once you visit the WP admin.

How To Update Your Theme Via WordPress
  • Step 1 – You need to deactivate the current puca theme located in the Appearance > Themes section by activating a different theme. Once you activate a different theme, you can delete the puca theme. Dont worry, your content will not be lost.
  • Step 2 – Retrieve the new puca.zip file from your ThemeForest download. If you downloaded the Main Files from ThemeForest, you need to unzip the archive file you received to get the puca.zip file inside.
  • Step 3 – Upload the puca.zip file to the Appearance > Themes section by clicking on the “Install Themes” tab at the top and then choosing to upload the zip file.
  • Step 4 – Once it finishes uploading, choose to activate the theme.
  • Step 5 – Lastly, update the included plugins. You will see a notification message letting you know a new version of the plugins are available and need to be updated. Follow the onscreen prompts to update the plugins

After updating WordPress 5.0, your WPBakery Edit will not work, follow the instructions in the following video to fix that.

Watch the video tutorial

If "Download Demos" don't work, you should upload the sample data manually:

- Upload Data to the directory "ROOT/wp-content/uploads/{theme_name}_import/".
- Eg "ROOT/wp-content/uploads/cena_import/"
- Can use the "WP File Manager" plugin and import as like this video's tutorial or upload files via FTP.

Watch the video tutorial

There are 2 ways to do this:

1. Turn On "Enable Config Image Size" in Theme Options

Then config in WooCommerce Customize:

2. Override code in child theme Puca

- Active child theme Puca

- Add the following code to the file functions.php

- Active child theme Puca
remove_action( 'after_setup_theme', 'puca_woo_setup' );

Then config in WooCommerce Setting:

* Regenerate Thumbnails with the "Regenerate Thumbnails" plugin.

If "Select Category" drop down list don't show, please follow the following video tutorial

Watch the video tutorial

You can override css by 3 ways below :

1. Use Custom Css in ThemeOptions

2. Install Child theme and override css

The file: ROOT/wp-content/themes/puca-child/style.css

3. Use "Additional CSS" in Customize
Watch the video tutorial

Use Child Themes to Modify Theme

A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme.

Why use a Child Theme?

There are a few reasons why you would want to use a child theme:

  • If you modify a theme directly and it is updated, then your modifications may be lost. By using a child theme you will ensure that your modifications are preserved.
  • Using a child theme can speed up development time.
  • Using a child theme is a great way to learn about WordPress theme development.
How to use a Child Theme?

In this theme, we offer you a sample Child Theme (puca-child.zip). You install it like normal theme.

But you can create your own Child Theme form by following the instructions below

Link instructions How to Create a Child Theme

In case you cannot see the Registration Form on the My Account page or checkout page, it means you need to enable it.

You can find this setting by navigating to WooCommerce >> Settings.

Open Account Tab In the Registration section, make sure the" Enable registration on the "Checkout" page" and  “Enable registration on the “My Account” page” options is checked.

This is what you should be seeing on your screen:

Watch the "Mobile Menu Video" tutorial

Watch the "Mega Menu Video" tutorial

Watch the "Configure WooCommerce Currency Switcher" video tutorial

Watch the "Configure WooCommerce Sale Label" video tutorial

Please set up "Nav Account" menu:

Watch the "Add Google reCAPTCHA to Contact Form" tutorial

Watch the video tutorial

Watch the video tutorial

Watch the video tutorial Watch the video tutorial Watch the video tutorial

/* Fix cart 2 column */
@media(min-width:1600px){
.woocommerce-cart-form .woocommerce-cart-form__contents {
float: left;
width: 70%;
}
.woocommerce-cart-form .tb-cart-total {
float: left;
width: 30%;
clear: none;
padding-top: 0;
margin-top: 0;
border-top: 0;
}
.woocommerce-cart-form .tb-cart-total .cart_totals {
padding: 0 30px;
background: #fff;
max-width: 100%;
}
}
/* Fix Checkout out 2 column */
@media(min-width:1600px){
.woocommerce-checkout form.checkout {
float: left;
width: 100%;
}
.woocommerce-checkout form.checkout .details-check {
float: left;
width: 70%;
}
.woocommerce-checkout form.checkout .details-review {
float: left;
width: 30%;
padding: 0 20px;
}
}
Watch the video tutorial

A product will be more and more perfect if received positive contributions from customers. Many Thanks to All the Contributors:

Nicolas De Rechter

weblion.be

queryamit

Abdul-Rahman Al-Mahaini

mahaini.info

TSHmedia

DijitalC

Ferdinand Holzner

Version 1.4.0 - December 13, 2018

- Compatible with WordPress 5.0
- Compatible Gutenberg Editor
- Compatible with Woocommerce 3.5.2
- Compatible with WPBakery Page Builder 5.6
- Compatible with Slider Revolution 5.4.8.1
- Compatible with WooCommerce Blocks 1.2 plugin
+ [REMOVE] Remove the file "puca\js\jquery.min.js"
+ [REMOVE] Remove the file "puca\js\jquery-migrate.min.js"
+ [REMOVE] Remove the file "puca\woocommerce\content-none.php"
- [FIX] Fix "Alt" bug don't show in addons "vc_single_image"
- [FIX] Fix label "Out of stock" can't translate in the language file.
- [FIX] Fix addon "Categories Tabs 2" in skin "Supermarket 2" Custom link banner does not work
- [FIX] Fix conflict js with "WOOF - WooCommerce Products Filter"
- [FIX] Fix conflict js with "Dokan Vendor"

Version 1.3.6 - November 03, 2018

- [ADD NEW] Add new options "Max number of results show" in Theme Options/Header/Search Form
- Compatible with Woocommerce 3.5.1
- Compatible with WPBakery Page Builder 5.5.5
- Compatible with WooCommerce Variation Swatches(By Emran Ahmed)
- [FIX] Fix bug load more in page shop doesn't work correctly.
- [FIX] Fix bug Instagram doesn't work correctly.
- [FIX] Fix bug "Ajax Search Form" doesn't work select with a category.

Version 1.3.5 - October 09, 2018

- [ADD NEW] Add the file "jquery.unveil.min.js" in folder "js"
- [FIX] Fix bug lazyloadimage compatible with "Load More"
- [FIX] Fix bug Js "Sticky Header" doesn't work correctly.
- [FIX] Fix bug Js "Mini cart" in page cart doesn't work correctly.
- [FIX] Fix some bug style.

Version 1.3.4 - September 24, 2018

- [ADD NEW] Add new options for Preload Image
- [ADD NEW] Add new options "Custom Label featured" in Theme Options/Woocommerce
- [FIX] Fix bug undefined in theme
- [FIX] Fix bug Js Treeview Menu in the Home 21 of "Skin Furniture"
- [FIX] Fix the bugs "deprecated since version 3.0" of Woocommerce

Version 1.3.3 - September 21, 2018

- [UPDATE] Update Document - More clear with lots of videos and images
- [ADD NEW] Add new option "Sale Tag Settings" in Theme Options/Woocommerce
- [ADD NEW] Add new option "Title, Description, Image in category" in Theme Options/Woocommerce/Product archives
- [ADD NEW] Add new option "Show Mobile Footer Icons" in Theme Options/Mobile/Mobile Footer
- [ADD NEW] Add new function Lazy Loading Images
- [ADD NEW] Add new option "Enable LazyLoadImage" in Theme Options/General
- Compatible with WPBakery Page Builder 5.5.4 
- [FIX] Fix can't translate text "cannel", "search" in Smart Menu
- [FIX] Fix a bug Js of "Ohio skin" don't work on firefox
- [FIX] Fix a bug Js Menu Bar don't work on the single product page
- [FIX] Fix a bug the page no result when searching
- [FIX] Fix some bugs about style.

Version 1.3.2 - September 07, 2018

- [ADD NEW] Add the file "jquery.fastclick.min.js" in "js" folder. Reduce the delay on the mobile
- [ADD NEW] Add new options "Enable/Disable redirect add to cart" in Theme Options
- Compatible with Woocommerce 3.4.5
- Compatible with the plugin YITH WOOCOMMERCE ADDED TO CART POPUP
- [FIX] Fix "Custom Js - Header JavaScript Code" in Theme Options doesn't work correctly.
- [FIX] Fix show "Update cart" button in Cart page on Mobile
- [FIX] Fix some bug style.

Version 1.3.1 - August 23, 2018

- [UPDATE] Update Font Awesome 4.7
- [UPDATE] Change the JS files structure
+ [REMOVE] Remove the file "puca\js\jquery.treeview.min.js"
+ [REMOVE] Remove the file "puca\js\modernizr.custom.min.js"
+ [REMOVE] Remove the file "puca\js\waypoints.min.js"
- [FIX] Fix bug in Tbay Custom Images List Categories
- [FIX] Fix bug in Product with Video

Version 1.3.0 - August 08, 2018

- [ADD NEW] Demo Furniture & Decor
- [ADD NEW] Add new config "Enable/Disable "Quantity auto-update" in Cart Page"
- Compatible with WordPress 4.9.8
- [FIX] Fix bug in Register page

Version 1.2.1 - August 01, 2018

- [ADD NEW] Add new options show Logo in all page on mobile
- Compatible with WordPress 4.9.7
- Compatible with Woocommerce 3.4.4
- Compatible with WPML
- [FIX] Fix breadcrumb image don't work in product, blog, pofolio page
- [FIX] Fix Layout Shop Left with Description don't work when config 2 column products in mobile
- [FIX] Fix sale label function
- [FIX] Fix bug RTL Compatible with WPBakery Page Builder 5.5.2

Version 1.2.0 - July 04, 2018

- [ADD NEW] Smart Mobile Menu
- Compatible with Woocommerce 3.4.3
- Compatible with Slider Revolution 5.4.8
- Compatible with WPBakery Page Builder 5.5.2
- [FIX] Fix bug can't update the premium plugins
- [FIX] Fix Mini cart total price
- [FIX] Fix bug pagination, filter on the shop page
- [FIX] Fix bug slow load the thumbnail images on detail product page
- [FIX] Fix quantity in group products
- [FIX] Fix Top Rate in Addon
- [FIX] Fix jump top when clicking menu mobile

Version 1.1.2 - June 20, 2018

- Compatible with Woocommerce 3.4.2
- [UPDATE] Document Requirement
- [FIX] Bug style My Account Page one Multilanguage.
- [FIX] Bug display CODE in Account Detail page
- [FIX] Bug style search button one WooCommerce page.
- [FIX] Bug style Mini Cart when Sticky Header
- [FIX] Bug style Single Product Tabs = Full Text
- [FIX] Bug style RTL product detail
- [FIX] Bug Mobile menu does not show sub-menu level 3 in Puca Smarket 1

Version 1.1.1 - June 08, 2018

- Compatible with WordPress 4.9.6
- Compatible with Woocommerce 3.4.1
- Compatible with Slider Revolution 5.4.7.4
- Update Redux Framework v3.6.9
- [ADD] Add order by for "Tbay Grid Post" element
- [FIX] Move "Top WelCome" and in widget
- [FIX] Bug Style Home 14 in Fashion 1
- [FIX] Bug Default Product Sorting
- [FIX] Bug Style of "My Account" and "Check Out" page in multi-Language
- [FIX] Bug fail when don't active plugin YITH WooCommerce Brands Add-on
- [FIX] Bug Custom Link doesn't work in "Tbay Custom Image List Categories" element
- [Remove] Folder "Plugins"

Version 1.1.0 - May 18, 2018

- Optimize speed on mobile
- [ADD] link download Full PSD: Sample Data\psd\linkdownload.txt
- [ADD] Enable/Disable carousel for each addon in mobile.
- [Fix bug] Style in Cart page, Mini Cart, Single product and Title page in Mobile

Version 1.0.8 - May 03, 2018

- Compatible with Slider Revolution 5.4.7.3
- UPDATE All plugin to the latest version
- [Add] Validation required in input search
- [Add] Custom link for "Tbay Custom Image List Categories" addon
- [Add] Only can review when customers have purchased the product
- [Fix bug] Google custom link fonts
- [Fix bug] Style of Logo on Tablet device
- [Fix bug] Choose Logo in Header Layout 4
- [Remove] Sub category in Header Layout 13

Version 1.0.7 (April 18, 2018)

- [Add] Option show/hide variant in Home and Shop in Theme Options
- [Fix bug] Style Post Page when choose in Reading
- [Fix bug] Style on Safari
- [Fix bug Woocommerce] add_to_cart_fragments 
- [Fix bug] Dont't Show Quantity in mobile [Super Market 01]

Version 1.0.6 (April 14, 2018)

- [Fix bug] Customize color Fashion 1
- [Fix bug] Warning: array_search() and array_splice()

Version 1.0.5 (April 09, 2018)

- Add Custom Fonts (in Theme Options)
- Minify Javascript file
- Fix bug responsive in skin Smarket 2

Version 1.0.4 (April 05, 2018)

- Compatible with WordPress 4.9.5
- Optimize CSS size
- Fix bug: responsive Super Market 01
- Fix bug: can't change the header, footer if set Shop page is Homepage.
- Fix bug: some color don't work in Customize

Version 1.0.3 (April 02, 2018)

- Fix bug style when sticky header

Version 1.0.2 (April 01, 2018)

- Update source data when import "One Click"
- Fix css page check out in mobile button

Version 1.0.1 (March 28, 2018)

- Fix bug when import Sample Data

Version 1.0.0 (March 26, 2018)

- First Release!