Everything You Need to Know About Using Jetpack with WordPress and Divi (Part 1)

Everything You Need to Know About Using Jetpack with WordPress and Divi (Part 1)
Developed by Automattic, the makers of WordPress.com, Jetpack is a really powerful plugin that is easy to use and free to download (with a few premium paid features including VaultPress and VideoPress). Through the Jetpack plugin, you’ll be able to let your self-hosted WordPress website call on the multitude of functions available to websites using WordPress.com.

Having recently received a major update to version 4.3 (and 4.3.1), the new Jetpack plugin ships with a brand new UI that promises a more streamlined experience than its preceding versions, and, as it has been build with React.js (the same JavaScript library that powers WordPress.com as well as the latest Divi 3.0 front-end builder), speed is key and site changes will reflect rapidly.

Some WordPress users swear by Jetpack, singing the praises of the plugin’s multitude of services, while others shy away from it, harboring concerns of package size and the plugins overall effect on a website’s speed.

This blog post aims to discuss the Jetpack plugin in depth and will hopefully aid in assisting you in making a decision as to whether you should download and install the plugin on your website, should it fit your needs requirements. For a full breakdown of all of the Jetpack modules and functions, read the second installment of the article series: Everything You Need to Know About Using Jetpack with WordPress and Divi (Part 2)

WHAT IS JETPACK?

Before discussing Jetpack in detail, it’s worth covering the differences between self-hosted WordPress.org and WordPress.com websites.

Through WordPress.org, your self-hosted website (set up via a third-party hosting service provider such as Go Daddy or Blue Host for example) makes use of the open-source and free WordPress software. This software (including WordPress itself as well as various themes and plugins from both third-party sellers and the WordPress repository) gets downloaded and installed onto your server to form a website. On the other hand, WordPress.com offers full web hosting services on top of WordPress and related software – a “one-stop shop” in a sense.

Websites that are hosted through WordPress.com are able to tap into an ocean of resources that are not available to self-hosted websites. Jetpack bridges this gap by allowing self-hosted websites to share in the functionalities already afforded to sites running on WordPress.com.

Jetpack is a mega-plugin: one single plugin that offers a broad range of features and functionalities, all packaged as one product. Jetpack ships with a number of ‘modules’, each which performs a particular task. These modules have been described at length in the Part 2 blog post of this article series. The various modules can simply be activated or deactivated when required, so you’re able to pick and choose the combination of features that you’d like to include for a site build. The modules vary in form and function, some fulfilling rather hardcore requirements such as displaying website statistics or processing website backups, whereas others are less geared to website health and are more for serving – for example – an aesthetic or UX purpose (such as ‘related posts’, for example). Nevertheless, these modules can be selected at will to best suit your development flow and website longevity.

Over the years, Automattic have made incredible improvements to Jetpack so that the features are truly impressive, and with the latest 4.3 version available (powered by React and boasting a shiny new interface), now would be a good time jump onto the Jetpack bandwagon if you haven’t already done so.

ONE PLUGIN TO RULE THEM ALL

Although WordPress websites are 100% geared to handle plugins, adding a vast collection of them to a single website can sometimes get tricky. There is no real golden rule for plugins, but the general consensus is that less is more, and that plugin selection should be done so with extreme care. From cluttered dashboards to countless updates, having a bunch of plugins on one WordPress website can get messy. A WordPress website oversaturated with plugins is a bit of a hassle from a management perspective, and too, too many plugins can create site insecurities and internal conflicts if not regularly monitored and maintained, especially if they’ve been developed with poorly written code.

With Jetpack being able to offer an extensive amount of features in one single product, the decision to download and install the plugin would technically be a no brainer, especially since it’s developed by the same creators of WordPress.com and so its compatibility with the core functioning of WordPress itself will always be guaranteed. However, it’s worth discussing a few things about Jetpack before making the decision to incorporate the plugin into a site build.

MYTHBUSTING JETPACK

Due to its size and countless modules, Jetpack has received a rather bad reputation for being a ‘bloated’ plugin. With this, a large portion of WordPress users claim that the plugin has an effect on the speed of a website, and will slow down the optimal functioning of a WordPress web presence.

Although the plugin offers an array of features, the likelihood that you’ll need each and every one of the modules activated is incredibly slim, even more so if you’re using a robust theme such as Divi which naturally covers a few of the features. Even though the final packed .zip source files sit at just under 6 GB, the beauty of Jetpack lies in the ability for the user to pick and choose which of the features should be required. With this, only the files pertaining to the activated modules will be loaded onto your site, and the remainder will not.

A number of Jetpack’s modules are geared toward shifting away some of the weight from your server and shifting the heavy loads to the WordPress.com cloud. Photon, for example, makes use of the WordPress CDN (a Content Delivery Network) for your website’s imagery. Here, when you upload an image to the WordPress Media Library, a copy of the same file is created and stored in one of the (really big) WordPress servers. With this, when one of your pages loads, the website will make a database call to the WP CDN to load the image, not your server.

Having been created by the same team responsible for developing WordPress.com, Jetpack is under constant revision in order to keep offering the best possible web development and viewing experiences for a wide range of WordPress users. Automattic carries an extremely high level of credibility as a development firm so a user can rest assured that the current and future versions of the plugin are being handled by the best in the business.

If the concern ultimately lies in site speed, consider downloading and installing Jetpack, then test the plugin with a website speed tester both before and after select modules are activated. Note, when Jetpack first installs, a number of modules are automatically set to active. If you’re still stressed about Jetpack and speed issues, have a read through of this post by the Matt Mullenweg regarding Jetpack speed concerns.

A BRIEF OVERVIEW OF THE JETPACK MODULES

At present, Jetpack ships with over thirty modules in the free plugin (two of which, ValutPress and VideoPress are paid). To read up about all of the Jetpack modules in detail, read the follow-up post here.

 

  • Beautiful Math
  • Carousel
  • Comments
  • Contact Form
  • Custom CSS
  • Custom Content Types
  • Enhanced Distribution
  • Extra Sidebar Widgets
  • Gravatar Hovercards
  • Infinite Scroll
  • JSON API
  • Likes
  • Manage
  • Markdown
  • Mobile Theme
  • Monitor
  • Notifications
  • Omnisearch
  • Photon
  • Post by Email
  • Protect
  • Publicize
  • Related Posts
  • Sharing
  • Shortcode Embeds
  • Single Sign On
  • Site Stats
  • Spelling and Grammar
  • Sitemaps
  • Site Verification
  • Subscriptions
  • Tiled Galleries
  • VideoPress (Paid)
  • Shortlinks
  • Widget Visibility
  • VaultPress (Paid)
As Jetpack only includes files for activated modules, the trick lies in activating a series of essential features. Selecting a powerful theme will also aid in your web development efforts. For example, contact and opt-in forms are readily available through the Divi Builder, so these Jetpack features need not be activated. Also, setting up a child theme to run CSS edits is really simple. Read up about child themes here. Another point to mention with the Jetpack provided CSS editor is that it mimics the same appearance of the Theme Editor console. With this, adding styling changes might be a bit difficult especially for new users as slight errors in code could throw the entire style sheet off. Setting up an external child theme with a style.css stylesheet through the use of an IDE (such as Sublime Text or Brackets) will make scripting far easier because of the color cues provided.
If you’re interested in finding out more about Jetpack’s features, read the follow-up blog post “Everything You Need to Know About Using Jetpack with WordPress and Divi (Part 2)“.

If you’re already sold and are ready to try out Jetpack, read the following download and install instructions below.

HOW TO INSTALL AND CONFIGURE JETPACK

As Jetpack pulls functionality and usage from the WordPress.com resources and servers, there’ll need to be some linkage between your self-hosted website and the WordPress.com cloud, so to begin using Jetpack, you’ll need to sign up for an account via WordPress.com.
Once you’ve got your WordPress.com account in the bag, return to your WordPress dashboard, navigate to Plugins > Add New and search for Jetpack. As Jetpack is created by the WordPress.com team, and also, it’s a really popular plugin, it will more than likely be at the top of the list for plugin download options. Click install, and once the installation is complete, Activate Jetpack.

At present, the Jetpack version 4.3.1 has a really minimalistic UI. Your Jetpack Dashboard will give an overview of core information (Site Stats etc.) relating to your site. To find the Jetpack settings, navigate to Installed Plugins, find the Jetpack plugin and click on Settings. This will bring up an extensive list of all of Jetpack’s various features and allow you to Activate or Deactivate the necessary ones. When hovering over certain features, a ‘Configure’ link will appear and direct you to the relevant area of your WordPress console to configure the feature’s settings. When clicking on one of the features names, a new tab will open and direct you to the Jetpack support site to offer extensive information regarding one of the plugin’s features.

Read through our follow-up blog post “Everything You Need to Know About Using Jetpack with WordPress and Divi (Part 2)” where we explain each of Jetpack’s modules!

We really hope that you enjoyed reading this blog post and that the content above has helped you make a decision toward using Jetpack. If you have any comments or queries below please feel free to share them below!

Thanks for reading!

Lisa-Robyn Keown

Lisa-Robyn is a qualified copywriter and brand strategist from Cape Town, South Africa.