Archive

Tag: LiteSpeed

How to optimize WordPress site using LSCache Plugin

Learn from Niel Patel as to why slow speed is a killer for your online business and let see how you can easily speed up your website.

WordPress is a free Content Management System (CMS) used by more than 60 million websites, WordPress is one of the most popular CMS solutions. Considering the popularity of this CMS, optimizing WordPress sites to load quickly is very important and sometimes it is difficult. PageSpeed of any website is one of the major factors for both usability and SEO. In this article, we will discuss how you can improve the loading speed of your WordPress site using LSCache Plugin.

Table of Contents

  1. What is PageSpeed or Page Optimization?
  2. Factors that affect the PageSpeed of a WordPress site.
  3. How to improve PageSpeed.
  4. How to check PageSpeed.
  5. Benefits of PageSpeed.

1. What is PageSpeed or Page Optimization?

Basically PageSpeed means that how quickly a web page load when a visitor clicks on the link or types in the URL. Usually, a visitor expects that their pages load quickly and this imparts a good first impression on them. PageSpeed not only creates a good impression but also improve search ranking as it affects the SEO

2. Factors that affect the PageSpeed of a WordPress site:

  1. Un-optimized media (Large-sized images and videos)
  2. Un-used CSS and JS
  3. Un-Minified CSS and JS
  4. Excessive Use of Plugins and Widgets (In-active and unnecessary plugins)
  5. WordPress Theme (Theme Choice is important)
  6. Poor Choice of Hosting Service.

3. How to improve PageSpeed:

Follow the steps mentioned below to improve overall speed of your WordPress site.

3.1 Optimize or Reduce media size:

Use of Images and videos make the content more beautiful and attractive but a common mistake is to upload pictures and video directly without any optimization. Always optimize media like videos and images before uploading it on site for use. Use the latest jpg/jpeg version only, PNGs should only be used when transparency is needed. Lower images result in smaller page sizes hence a boost to Pagespeed.

For the images that have been uploaded already, you can also use WordPress plugins for image optimization.

Most Common Image Optimization Plugins:

  1. LiteSpeed Cache
  2. Imagify
  3. Optimole
  4. ShortPixel Image Optimizer

There are many image optimization plugins on WordPress plugins directory, let see how we can use LiteSpeed Cache plugin to optimize images:

  1. Click on LiteSpeed Cache -> Image Optimization. 
  2. Click on Send for Optimization button until all the images are optimized
  3. Once optimization is completed click on Gather image Data.
  4. Check the Image information section on the right side, it shows the optimization status. Green ticks suggest complete optimization.
Image Optimization
  1. Go on the Image Optimization Settings Option on screen.
  2. Check all the options as shown in the picture.
Image Optimization

3.2 Minify HTML, CSS and JS Files:

Minification of HTML, CSS, and JS files are some of the most common and important steps to increase page speed.  Google PageSpeed Insights and/or any other page speed tool always recommends this.

This issue happens due to the white spaces and extra CSS and JS  on the website page.

You can fix these issues manually or use a WordPress plugin to do so. Some plugins are listed below.

  1. LiteSpeed Cache
  2. Autoptimize
  3. JCH Optimize

Minify CSS and JS using LiteSpeed Cache:

  1. Click on LiteSpeed Cache -> Page Optimization -> JS Settings
  2. Change your settings according to the image below
  3. Follow this guide in case this setting breaks any functionality or visual structure of your site
Js Optimization
  1. Click on LiteSpeed Cache -> Page Optimization -> CSS Settings
  2. Change your settings according to the image below
  3. Follow this guide in case this setting breaks any functionality or visual structure of your site
CSS Setings

3.3 Excessive Use of Plugins and Widgets:

Excessive use of Plugins and Widgets can also slow down your PageSpeed. Always take care of extra and unnecessary Plugins and Widgets. Uninstall all in-active and unused plugins from sites. Never add any unused widgets.

Delete extra/inactive Plugins

  1. Click on Plugins->Installed plugins -> InActive
  2. Click on the Delete option right below the plugin name
Uninstall Plugin

3.4 Theme Choice:

The choice of theme to run the site is very important. Always choose a lite-weight theme for your site. Unlicensed/nulled themes slow down PageSpeed of your site so always use a licensed theme for the site.

3.5 Choice of Hosting service:

Hosting service is one of the main reasons behind the low PageSpeed. To run a  site on a shared server may be good from a financial point of view but it usually fails to deliver good loading times on peak traffic hours. So always use a good web hosting provider for your site to achieve a better PageSpeed, SEO, and traffic.

4. How to Check PageSpeed:

There are many ways to check the page speed of any site. A lot of sites are there to check the Page Speed of any site. Google also offers a tool called Google PageSpeed Insights for this.

Some sites that can help you to check various factors affecting your PageSpeed:

How to optimize WordPress site using LSCache Plugin

5. Benefits of high PageSpeed:

  1. PageSpeed improves search engine rankings
  2. It is important for SEO
  3. It ensures a good first impression on the visitor
  4. Also, help to decrease the Bounce Rate so visitors love to navigate between pages

Read More: HOW TO CHANGE TIMEZONE ON LINUX SERVER

Follow US on Facebook / Twitter  for updates.

How to set custom/extra headers for OpenLiteSpeed while using CyberPanel

Custom/Extra Header can be used for many proposes like:

  1. Content Security policy
  2. Referrer policy
  3. HSTS (Strict-Transport-Security)
  4. Content-type options

If you are using the LiteSpeed Enterprise server you can add Extra headers to your htaccess file and the server will add it automatically just like you used to do with Apache as it is fully Apache Compatible.

However, if you are using OpenLiteSpeed it has to be done via OpenLiteSpeed WebAdmin or by adding it to vHost configuration for the website via CyberPanel.

Table of Contents

  1. Log in to CyberPanel
  2. Open the website Manager
  3. vHost Configuration
  4. Verify Headers.

Here are the steps to add a custom or extra header via vHost configuration from CyberPanel.

1. Log in to your CyberPanel Server

Visit https://<IP Address->:8090

Enter credentials to log in.

2. Open the website manager:

     2.1 Click on the website and then click on the list websites.

Click on website and then click on list websites

      2.2 Click on the manage button in front of your desired website.

Click on mange button in front of your desired website.

3. vHost Configuration :

   

      3.1 Click the vHost conf from the website manager.

Click the vHost conf from the configurations portion in website manager.

      3.2 Find the block name “context” if it is found add extraHeaders value in it like “extraHeaders Access-Control-Allow-Origin *”.

      3.3 If “context ” block not found in vhost conf file Add the following before the rewrite { } portion.

context / {

extraHeaders Access-Control-Allow-Origin *

}

extraHeader

You can add the value of extraHeaders according to your requirement. 

4. How to verify extraHeaders configuration:

To verify extraHeaders configuration follow the steps:

    4.1 Open Network tab:

        1. Vist your website in any browser and open developer tools.

        2. In developer tools click on Networks tab

Open network tab

         3. Click on the file with your domain name. like(abc.xyz)

Screenshot 9

         4. Go to Network Tab and check headers for any request. You should the extra header you added in vHost conf.

Verify vhost configuration

How to set HSTS (Strict-Transport-Security) in custom the header:

HSTS is a web security policy mechanism that helps to protect websites against man-in-the-middle attacks such as protocol downgrade attacks and cookie hijacking.

To set HSTS in custom Header follow the steps:

             => Follow the 1,2 and 3 steps stated above to open the vHost conf file.

             => Add the following before the rewrite { } portion.

context / {

extraHeaders Strict-Transport-Security: max-age=15552000; includeSubDomains; preload;

}

 1. The age parameter tells the browser how long this rule must be cached.
 2. The includeSubDomains should only be added if you want to apply HSTS to subdomains too.
 3. The preload parameter is used for inclusion in Google Chrome’s preload list.

Read More: HOW TO CHANGE TIMEZONE ON LINUX SERVER

Follow US on Facebook / Twitter  for update.