Archives

WordPress Tips

How to make your site comply with Euro’s GDPR policy – Easy Steps

June 2, 2018

On 25 May 2018, the GDPR (European Union’s General Data Protection Regulation) officially takes effect.  In summary, if your site has user login/register features and is storing user data, and your site is serving EU’s users, you must provide a way for users to delete their own account & data.

In WordPress 4.9.6, in back-end, there is a feature that allows logged-in users to do that. You will find two links in Tools > Export Personal Data and Erase Personal Data.

So, update your WordPress as soon as possible to prevent GDPR violation.

However, that link is only available in back-end and not every sites allow users to visite the admin panel. What should you do to allow users delete personal data from front-end? There is a simple way: using Delete Me Now plugin. The best thing is it’s free and easy to setup.

  • Step 1: Install and activate the plugin from Plugins > Add New > search for Delete Me Now
  • Step 2: Open any page that is accessible by logged-in users (if your site provide login/register feature, this page should be already available). Add this shortcode to the page content

[plugin_delete_me]

  • Step 3 (optional): If case you cannot find the page in step 2, use additional shortcode such as Conditional Tag Shortcode . The page content should be like this

[is_user_logged_in][plugin_delete_me][/is_user_logged_in]

That’s it. Now you are ready to meet GDPR’s requirements. Tell us what you think about this solution 🙂

News

Where is my Envato Purchase Code?

January 16, 2018

To get access to our Ticket System at http://ticket.cactusthemes.com, where  you have dedicated support, you will need a PURCHASE CODE. A purchase code is a text string provided by seller (Envato or CactusThemes) to verify your payment of item.

On Envato, you can get your purchase code from Envato Downloads page. For ThemeForest, it is https://themeforest.net/downloads. You will see a list of your purchased items. Click on each item and find the “License Certificate & Purchase Code” link

After download the file, open it and get the purchase code inside

Hope this helps!

News

“a.cookie is not a function” error in WooCommerce 3.2.5

December 7, 2017

In the latest version of WooCommerce 3.2.5 (as of today), there is an error which may cause all of javascript code on your site to stop working. If you hit F12 to open the inspector window, you will see this message in the console log

Uncaught TypeError: a.cookie is not a function
at HTMLDocument. (cart-fragments.min.js?ver=2.6.14:1)
at i (jquery.js?ver=1.12.4:2)
at Object.fireWith [as resolveWith] (jquery.js?ver=1.12.4:2)
at Function.ready (jquery.js?ver=1.12.4:2)
at HTMLDocument.K (jquery.js?ver=1.12.4:2)

It’s not your fault or your theme, it’s related to WooCommerce. They have changed from jQuery Cookie to Vanilla JS Cookie https://github.com/js-cookie/js-cookie in to work with latest version of jQuery in WordPress 4.9+. The updated file is cart-fragments.min.js but tthe minified file (.min.js) is not re-minified. Only the raw file cart-fragments.js has the new code. To fix this error, you can open /woocommerce/assets/js/frontend/cart-fragments.js , copy all the code, and open an online minify tool such as https://www.minifier.org/  to get the minified code. Copy the minified code and replace all code in the .min.js file. Voala, it should work the issue.

An easier option: wait for WooCommerce to update  😉

News

Build a premium video content blog with VideoVIP wordpress theme

December 6, 2017

VideoVIP – Premium Video Content WordPress Theme – has just been released recently. It’s our third theme in the video-related category, beside VideoPro and TrueMag. It gives you another choice in building video site: simple to use, easy to setup, and complete package (ie. no extra plugins needed). The main idea of VideoVip is for selling Subscription: you have premium videos and users need to subscribe (pay per months or days) to view those content.

Subscrib to unlock

Subscrib to unlock

Why you need this theme when you can upload videos to YouTube or Vimeo and earn $$$ via ads? Well, first, you have full control of your site so you can upload any videos as you want. Second, YouTube and Vimeo do not give you solution to sell premium videos via subscription. Using VideoVIP on a WordPress site of your own, you have full control of your vdeos and setup payment as you want.

Here is how it works. You setup your payment gateway settings (only once when first install). You upload your premium videos and choose Lock to require subscription. Users who want to view Locked Videos need to subscribe to the payment plan. You can have both FREE and PREMIUM videos at the same time.

Easy to setup

VideoVIP supports YouTube, Vimeo and self-hosted videos. In general, you should use self-hosted videos (ie. upload your own video file to server) for Premium content. No one wants to pay for videos which they can watch for free from YouTube and Vimeo, right? (or do they?) Anyway, a normal scenario would be: you add free videos (from YouTube, Vimeo or upload your own videos) to build content and generate traffic. After having visitors, add premium videos and turn on subscription. This will be easy in VideoVIP as the package includes a video importer which can import videos from existing YouTube or Vimeo channels.

Locked Video

Locked Video

However, if you already have visitors (such as from your own YouTube channel), you can add only VIP videos on your site. It will be your premium content channel besides your free channels on YouTube. For example, a singer who wants his fan to subscribe and view newest videos can use VideoVIP for sure. Fan will have access to latest videos before other ones.

One more interesting thing in this theme is that, it supports various video player including JW Player, FV FlowPlayer, BZ Player and Elite Player. They have their own advertising network. So if you don’t want to sell subscription, you can also turn on advertising mode. That’s quite flexible, isn’t it?

Payment history

In our imagination, VideoVip is suitable for personal blogging, video bloggers, video producers, and content creators. However, we believe that you have more use-cases to apply to VideoVip. Please share your idea or suggestion so we can improve the theme.

 

WordPress Tutorials

Increase request timeout for IIS 6 with FastCGI module

September 21, 2017

If you are hosting PHP on IIS (Windows Server) using FastCGI, there is case that you meet script timeout issue even the max_execution_time value in php.ini is high enough. The error is as below screenshot

The reason is that FastCGI module has its own timeout setting. In IIS7, it’s called ActivityTimeout and you can configure in IIS > FastCGI Settings > Activity Timeout

However, in IIS 6, there isn’t an option like that. To change the request timeout, you can go to C:\Windows\System32\inetsrv\config, open ApplicationHost.config. You will find this section

<fastCgi>
<application fullPath=”…\php-cgi.exe”/>
</fastCgi>

What you need to do is to add activityTimeout parameter to the module, like this

<fastCgi>
<application fullPath=”…\php-cgi.exe” activityTimeout=”3600″/>
</fastCgi>

Now restart your IIS, it will work!

WordPress Tips

Turn on off WP DEBUG mode in WordPress

September 15, 2017

WordPress has a feature to DEBUG code (finding bugs) in developing environment. When this option is turned on, developers will see all notices and errors that come from the code. That’s great for deveoping themes and plugins.

However, when come to production environment, that option should be turned on. It’s because sometimes the notices or warnings are harmless to your site. You may install many plugins and many of theme do not care about notices or warnings. If the messages (of those notices and warnings) appear on the screen, users will feel uncomfortable. In some cases, those messages can break the site layout.

Thus, it is recommended to turn of DEBUG mode in live site. To do that, open /wp-config.php file (at the root folder of your site). You will see this line of code

define(‘WP_DEBUG’, false);

Change the value from true to false (and vice versa) to turn it off/on

define(‘WP_DEBUG’, true);

Remember to save the file. You can do this by using a file manager tool (often provided by your hosting) or a FTP app. The DEBUG mode will be handy if you see your site breaks in the middle of rendering the layout or you see a white/blank page. Turn it on, copy the message (of fatal errors) and send it to your technical supporters.

WordPress Tips

How to get higher Google PageSpeed grade over 90

September 6, 2017

To evaluate a website performance, people often use tools like Google PageSpeed Insights or Ping Dom. These online tools analyze your site content and give a grade based on various indexes such as Server Response Time, Optimize Images or Minify CSS.  A good grade is above 85 for Google PageSpeed and 90 for PingDom. Below are some tips to get higher score with Google PageSpeed (and consequently, Ping Dom)

  1. Server Response Time
    Server response time measures how long it takes to load the necessary HTML to begin rendering the page from your server, subtracting out the network latency between Google and your server. The only way to improve this index, is to upgrade your server. A stronger server will process faster and return results quicklier. Two components you should be aware of are CPUs and RAM. A SSD storage is even better (than normal HDD one). How many are enough? It depends on your site features. A shopping site is of course needs more CPUs than a personal blog. Try to upgrade your server until the response time goes below 1sOf course, make sure your theme and plugins code is optimized before looking for a stronger server. If you feel your site response is too long abnormally, it may come from the code itself. Try to disable theme and plugins one by one to detect the reason and switch to a better one.
  2. Minify HTML, CSS and HTML, enable Compression, Caching
    These indexes are quite easy to get high grade. Most caching plugins can do this for you automatically, such as W3 Total Cache or Super Cache plugin. Just install the plugins and turn on the cache & minify options, then you are ready to go.You can combine using Autoptimize plugin to minify HTML, CSS and HTML before caching. This plugin works very well with above two. One small note is that, sometimes there is a javascript file (or CSS, or HTML) which has improper piece of code. After minifying, the minified file breaks. As a result, the site doesn’t work. In one case, there is a missing ; (semicolon) at the end of the line so the minified lines is not valid anymore. You will need experience to detect the file having the issue, fix it, or ignore the file from minified files list.If you use a shared host (such as Google Daddy Managed WordPress), there is case that the caching setting doesn’t work. That’s because the caching module is not installed on your server. Readmore about this issue here. If you can, change the server.
  3. Prioritize visible content
    Google says: “If the amount of data required exceeds the initial congestion window (typically 14.6kB compressed), it will require additional round trips between your server and the user’s browser”. It is tricky. In many cases, you cannot do anything. It depends on your site design alot. It means the first 14.6kB compressed content of your site must be enough to render first page so visitors can see content quickly. So for example, if you leave a big image in the top of the page, browser will try to load the image instead of loading other text content. If  you use a lot of javascript to generate page layout, then visitors must way until all assets (image, javascript files) are downloaded before they can see anything. That will make “Prioritize visible content” index get a bad gradeTo improve this, there are 2 ways:
    • Structure your HTML to load the critical, above-the-fold content first. Don’t let your content and layout be mostly affected by javascript
    • Reduce the amount of data used by your resources, by compressing, minifying, or reduce number of images
  4. Optimize Images 

    This index is both easy and difficult. To get higher grade in this index, make sure your images are compressed (enough to look good on web) before uploading to your WordPress site. In addition, use proper image size (without resizing using CSS). For example, you should use 1280×900 px images in a place where it only needs 600x400px. That will give you bad grade in PageSpeed.That sounds easy? Yes. However, today we talk a lot about responsive website. It means the site must look good on mobile or smaller screens, at the same time page size must not be too big. On a responsive site, sometimes an image turn from 50% width into 100% width to adapt with new screen size. As a result, sometimes we need to prepare bigger image size than it actually needs. That will downgrade your PageSpeed scrore! A technical solution is to use responsive image (with srcset property). Basically you declare many sizes in a single place. When browser detects different screensizes, it will choose to load appropriate image sizes. Read more here. However, it’s not a perfect solution. When you resize your browser (on PC), there are cases at which the width does not match with any of previously declared values. Browser will still use small images at bigger places (or vice versa), thus images are stretched or shrinked making your site looks bad.

    Therefore, you will need exchange the responsiveness of your site with getting higher grade in this index. Re-design the layout in different screens so you can reduce number of image sizes needed. A great tip for you: focus on screen 1280px (HD screen), it is the size that Google PageSpeed grades your site.

    Well, one more good tip: if you already compress your images before uploading, but you still see warnings about a list of images which need to be compressed, don’t be panic. It’s because Google has a better compress algorithm than the tool you use. It thinks images can be compressed more. To overcome that, look for the link at the end of the result

    “Download optimized image, JavaScript, and CSS resources for this page.”

    Click on that link, you will be able to download optimizes resources that Google prepare for you. Re-upload images and you will get better result

Final words: although getting a higher grade at Google PageSpeed is a good thing, don’t let it fool you. There are many debates or dicussions saying that, the score doesn’t has any meaning. The only one that you need to focus is the loading speed and user experience. Anyway, the tool gives you indications to improve your sites, that’s great enough!

WordPress Tips

Visual Composer conflict with Skrollr lib of theme

May 21, 2017

If your theme uses Skrollr library, there is a chance that it will break the parallax effect of Visual Composer’ (VC) row element. The reason is that VC also uses Skrollr.  Because this library only inits once, when VC Row tries to init Skrollr, it returns the previous object inited by your theme (VC’s JS is loaded after your theme’s JS file).

In addition, VC row uses JS to add “data-” properties to parallax row, so the previous Skrollr object cannot detect these properties. As a result, VC parallax row does not work.

To fix this, you will need to trigger the Row Behavior function of VC again so Skrollr can understand “data-” properties of parallax row again

$(document).on(‘vc_js’, function(){
vc_rowBehaviour();
});

The “vc_js” event is trigger after all VC functions have been called.

Let me know if this solution works for you.