Supercharge Your Website with Jetpack: Part Three of Three
by Suzette Franck, WordPress Evangelist Lead at Media Temple
In the second edition of “Supercharge Your Website with Jetpack”, I covered features such as Blog Subscriptions via email, using Publicize to spread your post across different social networks, and using Sharing to enable social media icons on your site. I also reviewed Jetpack Comments and explained the extra sidebar widgets.
In this final chapter of the Jetpack series, I’ll cover the more advanced modules in Jetpack, including the Photon CDN for images, the built in Stats capability, the Contact Form, and the Image Carousel.
Photon CDN
This feature is pure awesome! It copies your images to different WordPress.com servers around the world, so that when visitors come to your site, the images are served by the server that is closest to them. This speeds up the loading of images, and is completely transparent, which means you don’t have to do anything besides enable it. You will upload pictures like you normally would, insert them into your pages and posts, and then WordPress handles the rest. More details on Photon CDN can be found here.
To enable Photon CDN, just click the Activate button under Jetpack settings for the Photon module, as seen below:
Once Photon has been enabled, you can verify that it is working by right-clicking an image then selecting Open Image in New Tab, or by viewing the source of the image, which should contain http://i1.wp.com/ at the beginning of the url instead of your normal domain. When you see this, it means that the image is being successfully served by the WordPress.com CDN with a decreased load time.
WordPress.com Stats
There are a few great things about this feature that I really love. It powers the Top Posts & Pages widget, the Annual Report, and most importantly, the Site Stats, which can be viewed from your dashboard. As awesome as all of these things are, they do not add an additional load to your server, and their use is transparent to the visitor.
Below is the widget configuration and output for Top Posts & Pages, which is found under Appearances > Widgets. The widget queries the stats to find your most visited posts and pages and displays them on your sidebar as a text list, text with thumbnails, or an image grid with up to 10 entries.
In addition to the nifty graph on your dashboard, you’ll find the full Site Stats by going to Jetpack > Site Stats. Here you’ll see dynamic information about Referrers, Top Posts and Pages, Search Engine Terms, Clicks, and Subscriptions.
Everything is clickable, down to each day of the month, and I encourage you to browse around to see the type of information that is being recorded.
The configuration screen for Site Stats may be accessed by going to Jetpack > Jetpack, then clicking Configure. As seen below, you have several options on this screen, including the ability to hide the Smiley, which collects stats for WordPress.com. The Smiley appears as a small happy face image in your footer. On most business sites this is undesirable, so there is a checkbox to turn it off.
If you want to dig into the Stats deeper, you can read the full documentation here.
Contact Form
One of my favorite features is this slick, easy-to-use custom contact form. I have used many contact form plugins, and this one works very well. Once activated, a small icon appears on the Edit page next to the Add Media button, as below:
Upon clicking the Add Form button, the lightbox below will appear:
When you hover over the minuses on the right of each field, you get the option to move, edit, or click to remove that field completely. The order of fields is via drag-and-drop, and you may add a new field by clicking the Add a new field link under the last field. Clicking the Email notifications tab allows you to change the notification preferences and subject line of the email that will be generated by the form. When you are all set and your form is exactly as you like, click on the blue Add this form to my post. The shortcode to display the form will be inserted into the edit box:
In general, never edit inside the square brackets unless you know what you are doing. To see what the form will look like on your website, click the Preview button. Here is what the form looks like on the default WordPress theme Twenty Twelve:
The form results will be sent according to the form settings, but responses are also stored in the dashboard under the Feedbacks menu. IP Address, name, email, any other fields, and time of submission are all stored as well.
You may be wondering, “What about SPAM protection? Can I add a CAPTCHA or challenge field?”
There is not currently a way to add a CAPTCHA or challenge question, but if Akismet is enabled on your site, it is already working overtime to protect your Jetpack Contact Form from spam submissions.
Image Carousel
The Image Carousel turns your galleries into beautiful full screen slideshow experiences. It works with the gallery shortcode and just needs to be activated to work. You may change the background color from its default black to white and display EXIF data from your camera, if included, by tweaking the settings under Settings > Media:
Once you have uploaded some pictures and inserted the gallery shortcode, your gallery will look something like this:
Clicking an image brings it up in a full screen slideshow. You may advance through the images by clicking on the left or right arrows, and you can close the view by clicking the X in the top left corner.
Summary of Jetpack
Jetpack is a truly amazing plugin with many built-in features that anyone can take advantage of. With its rich social media functionality, website stats, simple contact form, image carousel slideshows, performance-enhancing Photon CDN, and frequent updates and enhancements, you are guaranteed to be riding the wave of the latest WordPress technology. I hope you have been inspired by this Jetpack series to experiment with all the modules, as it can save a lot of time and headache when setting up new and older websites with WordPress.
For more tips and articles on WordPress and web development, please follow me on twitter @mt_Suzette.
Previous Jetpack Articles
Part One
http://weblog.mediatemple.net/2012/12/17/supercharge-your-website-with-jetpack-part-one-of-three/
Part Two
http://weblog.mediatemple.net/2013/01/03/supercharge-your-website-with-jetpack-part-two-of-three/
