5 easy ways to improve WordPress site loading speed

5 easy ways to improve WordPress site loading speed

The biggest advantage of lowering your website’s loading time is that it will help tremendously in improving site’s usability and user experience which is essential for today’s online business.

There are many ways to get started with top-end optimization. Here are 5 ideas to get you going.

 

1. Get a good Web Host

The major factor that influences the speed of a website is the hosting of your WordPress website.

I have used many servers but the best option in terms of speed and service is without a doubt SiteGround.

They provide excellent loading speed and customer support guaranteed 24/7.

 

2. Use an effective catching plugin

WordPress pages are “dynamic.” This means they’re built on the fly every time someone visits a post or page on your website.

To build your pages, WordPress has to run a process to find the required information, put it all together, and then display it to your user.

A cache plugin generates static pages and improves the site pagespeed 2-5x faster. The cached pages are stored in the memory and when a user makes a request the pages are delivered from the cache. By this the php execution and the database requests are skipped.

There are a lot of good WordPress caching plugins available, but I recommend using either WP Fastest cache (free) or LiteSpeed Cache (free) plugin.

WP Fastest Cache was rated the #1 (free) cache plugin in this Facebook poll.

 

3. Compress your images

According to httparchive, in August 2016 the images are more than 64% of the weight of an average website. Usually they tend to weigh more than all of your CSS, JS and HTML combined!

If you have a website with lots of images you must optimize them to reduce the size. By reducing the image size, you´ll reduce web page size overall and save server´s bandwidth.

There are multiple ways to optimize the images, but doing without losing quality is the smart way. In this article, I’ve covered three types of tools.

Compressor

Compress and reduce your image size up to 90% with Compressor while maintaining high-quality resolution. It supports JPEG, PNG, GIF & SVG and files size limit is 10 MB.

WebP Express

WebP is a raster image format from Google that’s designed specifically for the web. It provides lossless and lossy compression that allows web designers to show richer images at smaller file sizes.

WebP lossy images use predictive coding to encode the image. It reduces the file sizes by looking at the neighboring pixels to predict the values, and then only encodes the differences. Lossy images are up to 34% smaller than the comparable image as a JPEG and 26% than the same as PNG.

 

4. Avoid using unnecessary plugins

Excess plugins can make your job harder and more complicated than it needs to be and could affect the performance as well as the security of a website.

Actually, many times we have installed and activated plugins that we do not even know what they do or how to configure them.

So why do we have them there without doing anything consuming resources?

 

5. Keep your site up-to-date

WordPress is updated frequently. Each update will not only offer new features but it will also fix security issues and bugs. Your WordPress theme and plugins may have regular updates, too.

As a website owner, it’s your responsibility to keep your WordPress site, theme, and plugins updated to the latest versions. Not doing so may make your site slow and unreliable, and make you vulnerable to security threats.

How to fix blurry photos in WooCommerce

How to fix blurry photos in WooCommerce

Many people who have bought some of my WordPress themes ask me How to fix blurry photos in WooCommerce so I´ve decided to make a really fast instructional tutorial.

If you’re having issues with your WooCommerce product images being too small, blurry or too big, this may be because of the image you’ve uploaded do not match your WooCommerce product image settings.

 

 

  1. First of all you should enter site admin panel and navigate to Appearance > Customizer  in your WordPress dashboard.

2. Click on the WooCommerce option and select select Product Images.

3. Under the Products Images tab you should see the Display option, which defines the product images dimensions Width X Height in pixels. We need to change them.

Main Image Width  is for your images on the shop page and for widgets.
Thumbnail with Single is for your images on the single product pages.
Thumbnail cropping 

4. The minimum suggest width for main images is 600px and > 300 px for thumbnails

5. Once you have made your changes to the image dimensions, click ‘Save Changes’.

6. If you change the image dimensions after you have uploaded product images, you will need to download and run the Regenerate Thumbnails plugin just once Regenerate Thumbnails – this is to ensure that all affected images are resized to match the new dimensions.

The end!

That concludes my tutorial for fixing the blurry product images on your WooCommerce shop.

 

How to add an image link in your WordPress sidebar + FREE banners

How to add an image link in your WordPress sidebar + FREE banners

Recently one of my customers asked me How to add an image link in your WordPress sidebar. By default, WordPress has only a text widget so you need adding HTML code manually. But, no worries, if you don’t know HTML, I will show you an easy trick to get around that.

This is really useful if you want put a logo, sponsors and internal links to your website.

 

How to add an image link in your WordPress sidebar

  • In your dashboard, create a new post or page and  and add an image from your library or computer.

how-to-add-an-image-link-in-your-wordpress-sidebar-01-lovely-confetti-tutorial

  • Once you have uploaded and inserted your image, click on the image and then click on the pencil icon (see below).

how-to-add-an-image-link-in-your-wordpress-sidebar-02-lovely-confetti-tutorial

  • A new window will pop up with information about your image. Now you can select Link to – custom URL and enter your URL.  If you want your image to open in a new window, set the target”open link in a new tab”.

how-to-add-an-image-link-in-your-wordpress-sidebar-03-lovely-confetti-tutorial

  • Tab over to the text mode and copy all HTML code.

how-to-add-an-image-link-in-your-wordpress-sidebar-04-lovely-confetti-tutorial

3. Go to Appearance > Widgets and drag-drop a text widget to your sidebar where you want to display the image, add a title text if you like and paste code.

how-to-add-an-image-link-in-your-wordpress-sidebar-03-lovely-confetti-tutorial

  • Delete that post or  save it as a draft for easier editing in case you decide to change things up again in the future.
  • Now visit your site and click on the linked image to verify that the link works as expected.

how-to-add-an-image-link-in-your-wordpress-sidebar-06-lovely-confetti-tutorial

  • You can add more images, delete the spaces between the photos and copy/paste code like my example.

FREE BANNER IMAGES FOR YOUR WORDPRESS SIDEBAR:

And as a bonus, you can download these free banners images in .png and .psd format if you want edit text, colors and images!

free-banners-free-library-how-to-add-an-image-link-to-wordpress-sidebar-lovely-confetti-tutorials

Join our mailing list to get access to our free resource library and download these free bannes instantly!

Get these FREE image banners

How to add a pin it button to your WordPress site + Free button images

How to add a pin it button to your WordPress site + Free button images

In this this posts I show you How to add a Pin it button to your WordPress site. I love Pinterest, I believe It’s a great tool for promoting and driving traffic to your blog.

I confess spend hours there just scanning and pinning. It´s perfect if you are planning your ideal wardrobe or styling for an event, your next living room remodel, or finding a delicious dish to take along to a party, your next DIY project,…

If you’re looking for an easy way to pin images in your blog posts and pages, there is an awesome plugin called jQuery Pin It Button For Images,  that will help you with that. I love this plugin because it allows:

  • Upload your own Pin it button.
  • Choose position where you want show up “pin it” button.
  • Choose if you want to show the “Pin it” button on home page, single posts, single pages or category pages.
  • Disable showing the button on certain posts and pages.
  • Choose level of transparency when you hover over images.

HOW TO ADD A PIN IT BUTTON TO YOUR WORDPRESS SITE:

Install jQuery Pin It Button For Images Plugin

  1. In your WordPress dashboard, hover over Plugins.
  2. Choose “Add new”.
  3. Type “jQuery Pin It Button For Images” in the box and press “Search Plugins”.
  4. Once you have located the plugin, click Install Now.

How to add a pin it button to your WordPress site - Tutorial - 01 - Lovely Confetti WordPress Themes

Configure jQuery Pin It Button For Images Plugin

Selection:

  1. Go to dashboard > Settings and select “jQuery Pin it button images options” and click on the tab Selection at the top of the page.
  2. Choose if you want to show the “Pin it” button on home page, single posts, single pages or category pages.
  3. Save changes.

Visual:

  1. Go to Visual at the top of the page to access the second page of settings.
  2. Asign transparency value, for example 0.5.
  3. Check the box “Use custom image” and then upload your custom Pin it button using the button below.

5. Now you can choose the pin it button position where you want it (Top left, Top right, Bottom left, Botton right or middle) and adjust margins. (I usually choose top left and 20px for margins).

6. Else It´s possible optimize your pin it button for retina displays. In this case, make sure you upload a “Pin it” button that is twice the size you want it to display.

7. Now, save changes.

 

FREE PIN IT BUTTON IMAGES FOR YOUR SITE:

And as a bonus, you can download my free “Pin it” button images for you! If you like these, subscribe to my free library and download the zip files (.png and .psd) so you can change colors in Photoshop to match your brand and use them on your site.

free-pin-it-buttons

Get this Free Pin it buttons

Are we friends on Instagram?

Follow along to check out more of my work and behind the scenes !

 

Feminine WordPress Theme

Hilary portfolio and eCommerce Genesis Child Theme

For pre-sale questions check the FAQS or contact me.

Requirements

This theme is compatible with self-hosted WordPress.org only. You must have domain name and Hosting. It will not work on WordPress.com.

What you recieve
  • Genesis Framework (value 59.95$).
  • Hilary eCommerce and Portfolio Genesis Child Theme.
  • Setup & help docs how to install the template and use it.
  • Demo content files for import widgets and content.
  • 3 promo boxes, Image profile frame, “Pin it button” in .psd and .png format (editable Photoshop).
How it works
  • Buy this theme via Paypal.
  • As soon as your payment is cleared, you´ll recieve an email with package.
  • Unzip the package to access Genesis Framework, Genesis Child theme, link with instructions and extra images.
  • Follow step-by-step link directions that are included in your packgage.
  • Enjoy your new blog!
WordPress Installation (Add-on)

This product is only for customers who purchase one of our premade blog wordpress in this shop.

Would you like me to install your wordpress theme for you in 24hours such DEMO? Not a problem!

  • Installation of theme and Home Page widgets
  • Setup of all Plugins.
  • Setup of Contact Page.
  • Setup Social media icons.
  • Setup Profile picture.
  • Setup your existing logo and/or favicon.
  • Setup Navigation menu
  • Demo content
Refund Policy

Due to the nature of digital products (intangible digital goods), I DO NO accept returns, refunds or exchanges.

Are you looking for a portfolio and eCommerce feminine WordPress Theme for your creative project?

Hilary is a highly flexible, visually stimulating and sophisticated feminine WordPress theme perfect for photographers, creative entrepreneurs and women in business.

Features

  • Woocommerce ready (eCommerce).
  • Filterable portfolio and gallery to display your work (images, videos,..) in 2, 3 or 4 columns.
  • MailChimp, Awber, ConvertKit,.. newsletter plugin compatible.
  • Display your category posts in grid layout (3, 4 or 6 columns).
  • Bottom widget for your Instagram Feed.
  • Landing page template.
  • Flexible Footer Widgets.
l

Customize it

  • Change colors and more than 300 Google fonts to make the theme match your brand.
  • Live theme customizer – see your changes before going live.
  • Front Page with flexible widget areas.
  •  3 parallax image backgrounds to upload.
  • Upload your own logo and favicon.
  • Organize your blog page with multiple layout options; 2 o 3 rows, pots scerpt + featured image or full posts.

Extra features

  • Extra goodies: Pricing table, Call to Action Boxes, Services boxes, Listings, Testimonials, Info boxes, Accoordeon content, …
  • 3 Promo editable Boxes included .psd  and .png format (Portfolio, Shop and Blog).
  • Sticky Navigation on scroll, preloader and “back to top” button.
  • Multiple blog posts layout: 2 o 3 rows, pots scerpt + featured image or full posts.
  • Preloader, make your visitor watch the animation before the site loads.

Seo Friendly

  • Build on the powerful Genesis Framework.
  • 100% responsive design (view the demo).
  • HTML5 Markup.

Here you can view examples of awesome websites of customers who are using these WordPress Themes

Hey there !

Don’t ever miss any of my freebies! Leave me your e-mail address and be the first to know when something new appears on my site.

Pin It on Pinterest