Jetpack

“Hear it from us first”: Why every site should run Jetpack

Jetpack is a WordPress plugin that helps you optimise your site on various fronts: traffic, development and user experience amongst others. There is one feature however which I feel is critical: Jetpack Monitor. Simply put, Jetpack Monitor keeps tabs on your site and alerts you the moment that downtime is detected.

angryclients2

Like a lot of people who work in web, before I joined the Jetpack team I did quite a bit of client work: both freelance and at agencies. For me the absolute worst thing in this business is receiving a call from a client, most likely while you’re relaxing on a beach or just waking up, desperately asking you to fix her site because she’s losing money, clients or brand value while her site is down.

Jetpack Monitor might not do away with the frantic scrabbling you’ll need to do to fix the site but it will put you back in the driving seat. Because you get notified first you can turn the tables around and call your client yourself, calmly saying “Hey, as I’ve been keeping tabs on your site I noticed it just went down 10 seconds ago. Don’t panic, I’m on it.” At times the problem might even be a trivial one meaning that you can actually call your client and say that its already sorted!

Of course the same applies if you maintain your own site. You’ll get notified by us rather than by one of readers (or customers) making it more likely you can fix the problem before it affects too many of your users.

That’s it. With Jetpack Monitor, if your site goes down, you’ll hear it from us first.

Its entirely likely, indeed desirable, that you will turn this feature on when you install Jetpack and then never think about it again. But if, for whatever reason, your site or your client’s site does go down you will be thanking your lucky stars this feature is enabled.

Try Jetpack for yourself by connecting it to your site or by downloading the plugin files directly if you prefer that route. Oh, and do let us know in the comments if you have any questions or suggestions.

Posted in Features | Tagged , , , | 13 Comments

How to improve your User Experience using Jetpack

Jetpack has a ton of features (more than 30) that help you improve your WordPress site or blog in many ways – both for yourself as administrator as well as for your readers. Today I’m going to focus on eight Jetpack features that you can use to improve the User Experience of your site so that visitors find it easier to navigate and stick around longer.

Performance and Stability

It can seem like a no-brainer but the absolute worst user experience when visiting a site is when the site doesn’t work at all or takes a long time to load. Jetpack comes with two must-have features that stop this from happening:

  1. Photon
    Turning on Photon means that all your images get automatically served to users from the WordPress.com content delivery network (CDN) which means faster images for your readers (and less load on your host). To turn it on all you have to do is go to the Jetpack page in your blog dashboard and click the Activate button for Photon. And if you’re a developer, you can also speed up your theme with Photon.

  2. Monitor
    All sites go down once in a while. It could be your database, your host, some rogue code – whatever the reason, your visitors don’t really care, they just want to see your stuff! Jetpack Monitor will keep tabs on your site, and alert you the moment that downtime is detected so that you hear it from us first.

 

Mobile Devices

If you keep tabs on your traffic you’ve probably noticed you’re getting more and more visitors browsing your site from a mobile device: smart phones and tables of all shapes and sizes. Jetpack provides two features that help you make the reading experience on these devices significantly better:

  1. Mobile theme
    Jetpack comes with a responsive theme that works instantly on all mobile browsers. It also comes with various options and settings that enable you to choose exactly how you’d like your mobile browsing experience to work.

  2. Custom CSS
    Jetpack’s Custom CSS feature lets you tweak your site’s appearance to your heart’s content in a way that doesn’t break your theme when an upgrade is released. In addition, you can also create custom CSS for your mobile theme, further refining your mobile experience.

 

Interaction

Finally the last set of features deal with enabling your visitors to interact with your site, content and the community in a smoother fashion:

  1. Likes
    This feature puts a “Like” button on your posts and is a way for people to show their appreciation for your content. Enabling it is a short two-step process.

  2. Related Posts
    This feature pulls relevant content from your blog to display at the bottom of your posts. If the feature is enabled, a section of related posts appears just underneath your Likes (if you’ve turned these on). Just activate the feature from your Jetpack dashboard to turn them on but you can also customize how they display.

  3. Infinite Scroll
    Infinite scroll simply means that when a visitor scrolls to the bottom of your posts page Jetpack will automatically load the next set of posts without requiring clicking on any buttons. Activating it is similar to “Related Posts” above but not every theme supports it.

  4. Jetpack Comments
    When someone reads an article on your site and wants to comment, they can now use one of their existing social networking accounts to post a comment. No longer do they need to create yet another account and profile! You can also customize how Jetpack Comments display.

 

That’s it! Eight Jetpack features that can help your visitors have a more pleasurable experience when visiting your site. If you’ve not used Jetpack before, read our step-by-step installation guide here to try it out for yourself.

If you are a Jetpack user already please tell us what you think in the comments and, if you’d like to get involved by writing a guest post about Jetpack get in touch!

Posted in Features, Tips & Tricks | Tagged , , , , , , , , , , | 13 Comments

Indispensable Jetpack features for theme developers

Jetpack offers a number of great features for theme developers that help you cut down both development time as well as load times. Most of these features work right out of the box, but you can also get under the hood to apply tweaks and customisations that really take your theme to the next level.

This article introduces you to:

  1. Speeding up your theme with Photon
  2. Showcasing posts with Featured Content
  3. Automatically loading posts with Infinite Scroll
  4. Instantly applying a Mobile Theme
  5. Customising CSS
  6. Providing Sharing functionality
  7. Integrating Social Links
  8. Showing similar content with Related Posts
  9. Additional resources

 

1. Speeding up your theme with Photon

Jetpack for developersPhoton is a free image CDN offered by Jetpack. As soon as Photon is enabled, it automatically serves the images found in posts and pages from WordPress.com’s speedy servers around the globe.

But did you know that you can use it to save bandwidth and speed up load times for images within your theme, too? You can link to a Photon-ized version of an image by calling the jetpack_photon_url() function. Its quite straightforward and we’ve put together some step-by-step instructions to make it even easier.

 

2. Showcasing posts with Featured Content

Featured Content SettingsFeatured Content is one of Jetpack’s lesser known features. But it’s a really powerful tool for theme development because you can use it to create a completely custom area in your theme for users to showcase posts. The appearance and placement is completely up to you, the theme author.

Your users can then specify which posts to show in that area simply by selecting a tag of their choice. There’s even an option to hide the tag from post meta and tag clouds.

Whether you are building an image slider on your homepage, or want to allow users to highlight specific posts, Featured Content makes it easier than rolling your own custom functionality. You can see a few examples of the feature in action here.

 

3. Automatically loading posts with Infinite Scroll

With Infinite Scroll active, users no longer have to click a link to get to the next set of posts on archive pages. Instead, your theme loads the next set of posts automatically into view when the reader approaches the bottom of the page. You’ve probably seen similar functionality on other sites, and thanks to Jetpack, it’s a snap to add it to your theme.

 

4. Instantly applying a Mobile Theme

Jetpack Mobile Front PageMobile internet usage is growing exponentially and any theme worth its salt should work on mobile devices. That’s why you’ll be happy to know that Jetpack ships with a full Mobile Theme ready-to-go out of the box.

Just use the .mobile-theme CSS class to style the mobile theme or take things a step further and use jetpack_is_mobile to target mobile visitors.

That way you can build the best user experience for your theme, no matter what device visitors are using.

Check out this article on customizing Jetpack’s mobile theme to learn more.

 

5. Customising CSS

If you’ve published a theme before you most likely know that users often want to customize its appearance. Savvy users might create a child theme, but more often than not, users will simply edit your theme’s files directly.

revision_listThat can get messy when you release a theme update that overwrites users’ modifications. But thanks to Jetpack, a much more user-friendly alternative is available through the Custom CSS feature which also includes a revision history.

After activating the feature, a ‘Custom CSS link’ is added to the Appearance menu in the Dashboard. From there, users can add their own Custom CSS, without touching the theme’s files. They can even use their favorite CSS pre-processer, as support for both SASS and LESS is built right in.

 

6. Providing Sharing functionality

The Sharing feature allows you to add social media sharing buttons to your theme. There are multiple display options built in and you can opt to use your own custom styles as well.

In this way you can integrate social sharing buttons in your theme, and keep complete control over their appearance. You can even alter the functionality with some jQuery magic. Our friends over at ThemeShaper have a great article with more information about this.

 

7. Integrating Social Links

Jetpack also makes it easy to include Social Links within your theme. After a user connects their social media accounts through Publicize, you can automatically use links to their accounts in your theme. You can add support with add_theme_support() and then use the Theme Modifications API to pull the data into your theme.

 

8. Showing similar content with Related Posts

Related posts in visually striking modeRelated Posts is one of Jetpack’s newer features. When activated, this adds a section to single posts that includes automatically generated links to similar content.

By default the section appears at the bottom of your content, but you can also move it to the top with a filter. In addition users can add a shortcode wherever they want the section to appear.

This means that you can include styling for the Related Posts section in your theme and then users are able to drop in a custom Related Posts section that matches the rest of their site wherever they want.

 

9. Additional resources

Finally, we’d love to see what you’ve done yourself and what you think of Jetpack. If you have questions, comments or your own tips drop us a comment below! In addition to that, we’re always open to suggestions, so feel free to get in touch. Thanks for flying with Jetpack!

Posted in Features, Tips & Tricks | Tagged , , , | 6 Comments

How to install Stats and Analytics on your WordPress site with Jetpack

If you run a website you probably want to know how many visitors you’re getting. So, unsurprisingly, Jetpack’s WordPress.com Stats is one of the most popular features we offer! This feature gives you the ability to quickly see how many visits your site gets, what posts and pages are most popular and where your visitors are coming from.

There are many plugins and services that provide statistics, but data can be overwhelming. WordPress.com Stats makes the most popular metrics easy to understand through a clear and attractive interface. Plus, you can use them in conjunction with other analytics plugins and services.

This article covers:

  1. How to enable your stats
  2. View and understand your stats
  3. Configure and customize your settings
  4. What about Google Analytics?
  5. Installing Jetpack

 

1. Enabling your Stats

WordPress.com Stats are automatically enabled when you activate and connect Jetpack to WordPress.com: no additional setup required! (See the last section for help installing Jetpack.)

smiley

How do you know it’s working? We add a little smiley face at the bottom of your webpage like the one on the right. (Note: From Jetpack version 3.1 onwards the smiley won’t be on by default. You can turn it on and off yourself as described in the Configure and Customize your Settings section below.)

If you’re saying to yourself “Whoa! That’s big!”, don’t panic: in fact it’s quite tiny. Here the smiley in its actual size: actualsize

It’s pretty small. However, we do give you the choice of turning the smiley display off: see the Configure and Customize your Stats section below to find out how.

 

2. View and Understand your Stats

Now that your stats are enabled and running, you can view them in a number of different ways with Jetpack.

  1. Add to Main Dashboard
    You can add the stats module to your main Dashboard screen to give you at-a-glance site views as soon as you log in. On your main Dashboard screen, you can enable the Site Stats widget by opening your Screen Options tab and check the Site Stats box.

    jp-stats2-edit

    Then you can see your site visits, most viewed pages, and search terms people used to find your site at a glance. Handy, right?

    Jetpack Dashboard Stats

    The Site Stats widget on your Dashboard.

  2. In-Depth Stats
    Get more in-depth stats from your Dashboard by visiting Jetpack –> Stats from the menu bar on the left hand side. Here you can see information about Referrers, Top Posts & Pages, Search Engine Terms, Subscriptions, and Clicks.

    This is a great way to see what content is popular on your site so that you can write more about the topics that your visitors really like.
     

  3. Enhanced Stats
    WordPress.com Stats

    Country view stats on WordPress.com

    To get even more information on Stats, you can click the “Show Me” button next to the “Did you know you can view enhanced stats on WordPress.com?” text at the top of your Dashboard stats page to view your stats on WordPress.com.

    By visiting your stats page, we bring you even more information about your site including your best total views per day, your all-time views and comments totals, and features like Views By Country which shows you where in the world your posts are being seen!

    You can also look at stats per day, week, and month. Find out even more about the Jetpack Site Stats – including on what we don’t track through Jetpack – on the WordPress.com documentation page.

 

3. Configure and Customize your Settings

Everything we’ve covered up to this point is turned on by default when you activate and connect Jetpack to WordPress.com.

But did you know that you can also do some custom configuration of stats? Go to Jetpack –> Settings in your dashboard, find the WordPress.com Stats feature in the alphabetized list, and click the “Configure” link that appears when you hover your mouse over it:

configure_stats

In the next screen, you’ll see a number of options for configuring your stats. I’ll cover each one more in depth below.

configure_jetpack_options

  1. Admin Bar
    Checking this box will add the stats “Sparkline” to your admin bar when you’re viewing the front end of your site. If you’re in the wp-admin part of your site, this will not display.

    It looks like this (highlighted in green):

    stats_chart

    These lines represent the last 48 hours of page views for the current blog, with darker lines indicating nighttime page views. Each line spans a time period of two hours. The number that appears when you hover over the Sparkline is the overall highest amount of views per hour during the most recent 48 hour period.

    You might ask why you would need this. It’s a great way of seeing you site’s activity at a glance so that you can quickly note any unusual traffic activity when you’re not in your Dashboard.

  2. Registered Users
    You can choose whether or not to track site visits or site page views from logged in users. You can even specify different user groups that you want to track – or not to track – stats for.

    If you want to know how often your Editors are on your website, you can track it by checking the box next to Editor. It’s that simple!

  3. Smiley
    Remember how I mentioned earlier about how you could hide the stats smiley? (Although I’m not sure why you would, it makes the world a better place!) But, if you want to hide the smiley from displaying on your website, then you can check the box here.
     
  4. Report Visibility
    By default, Stats can only be viewed by logged in, Administrator users. This hides stats from other registered users who are not Administrators.

    If you want other user groups (Editor, Author, Contributor, or Subscriber) to have the ability to view stats, you would have to opt-in those user groups by checking the box next to the user group you want to add. (Note: you cannot uncheck stats visibility for Administrator users.)

 

4. What about Google Analytics?

One of the more common questions we get about Jetpack is: “I want to use Google Analytics! Do I have to disable WordPress.com Stats in Jetpack?”

No!

You can use both on your WordPress installation. The benefit of using WordPress.com Stats is that you can see a snapshot of your blog's activity right from your Dashboard. If you want to use another analytics service you can certainly do so. WordPress.com Stats works great alongside Google Analytics and other stats tracking services.

 

5. Installing Jetpack

To see WordPress.com Stats working on your site you will need to install the Jetpack plugin. (Note: Jetpack works with self-hosted WordPress sites. If your site or blog is hosted at WordPress.com you already have access to all Jetpack features!)

There are two ways of installing the Jetpack plugin:

  1. The simplest way is install it directly from your Dashboard. You can find step-by-step instructions here.
  2. Alternatively, if you’re an advanced user, you can download the plugin files (.ZIP) and install it manually.

I hope this has helped you learn more about Jetpack’s WordPress.com Stats feature. If you have any questions please feel free to leave a comment below.

Posted in Features | Tagged , , , , | 3 Comments

Let Users Showcase their Posts with Featured Content

Featured Content Settings

The power of showcasing content

Featured Content is a great way to let users highlight their most important posts. Our Theme Wranglers use it often on WordPress.com, but this awesomeness is available to all theme developers.

The concept is simple: each theme can determine where and how Featured Content is displayed. Then, right from their blog’s dashboard, users can specify a tag to determine which posts to showcase in the Featured Content area. Users can even specify how many posts they want to show, and decide if they want to hide the tag from post meta and tag clouds.

Featured Content in Action

If you’ve been following the development of the Twenty Fourteen theme, you’ve seen the prominent featured posts section on the front page. This area was created with Featured Content! The user specifies which posts they want to feature, and the theme does the rest of the work. Check it out here.

Twenty Fourteen

Another great example of Featured Content is the rotating header on the Superhero theme. In Superhero, Featured Content was coupled with Flexslider to create the beautiful post slider that you see at the top of the front page.

Superhero Theme

The possibilities really are endless. Photography themes can use Featured Content to display beautiful photos, and business sites can highlight their most important news and alerts. Best of all, users don’t have to worry about Custom Post Types or theme-specific categories or tags. They simply set a tag, and the theme handles the rest.

Add Featured Content in a snap

Adding Featured Content to your theme is a piece of cake. You can find all of the information you need to get started on the Featured Content support page.

Keep in mind that Featured Content is designed to spotlight content right on your theme’s homepage. If your theme includes a front-page.php file, that’s the only template file to which you’ll need to add the Featured Content area.

Do you have a great idea for Featured Content? Or have you done something cool with it on your own site? Let us know! We’d love to see how Featured Content is being used in the wild!

Posted in Features, Tips & Tricks | Tagged | 4 Comments

Jetpack 2.7: Share your content on Google+

We recently released a slew of Google+ integrations for WordPress, and mentioned that Google+ Publicize support would be coming soon to Jetpack users. Publicize makes it easy to share your new posts on other social networks (like Facebook and Twitter). Using it is a great way to build your readership and expose your content to new audiences.

Well, the wait is over — we’re excited to announce that you can now share your latest content on your Google+ Profiles and Pages!

Improved overall performance

Jetpack 2.7, which has just been released, adds Publicize to your site. In order to connect your account(s), head to your dashboard, then go to Settings → Sharing. Clicking on the “Connect” button next to the Google+ logo will prompt you to authenticate your account. Once you have, you can start enjoying the benefits of publishing your content to Google+ — just make sure that you’ve enabled the Publicize module.

Jetpack 2.7 also contains multiple bugfixes and other little features. You can view a full changelog of these updates by visiting this page.

We hope you enjoy Jetpack 2.7!

Posted in Features, Releases | Tagged , , | 44 Comments

Jetpack 2.3.5: Share Your Path Moments with Publicize

Jetpack 2.3.5 is out and contains an update to our Publicize feature! Our Publicize feature is a quick, simple way to build your readership and share your latest content automatically on other social networks, including Facebook, Twitter, Tumblr, and LinkedIn.

Working with our good friends at Path, we’re excited to announce that you can now connect your WordPress blog and Path account. Once connected, when you create new content on your site, a Path “moment” will also be created, with a link back to your site.

Read the Path announcement on WordPress.com to find out more.

Posted in Features, Releases | 6 Comments

Photon and Themes

Theme crafters often ask whether Photon — the free Image Content Delivery Network module in Jetpack — can be used to speed up page loads and save on bandwidth when delivering images from their themes. The short answer: Yes! Read on for the how-to.

(more…)

Posted in Features, Uncategorized | Tagged , , | 20 Comments

Jetpack 2.3: Omnisearch, Social Links, and DIY Debugging

Version 2.3 of Jetpack has launched! New features like Omnisearch, Social Links, the Debugger, and more give you powerful, simple ways to customize and administer your Jetpack-powered site.

Ominsearch

Omnisearch

Omnisearch: one search box, global results. Don’t waste time digging for that one comment with the useful link — or was it a post you saw it in? Search once and get results from all of your posts, pages, comments, and plugins.

It’s also incredibly simple to let other plugins offer search results for when a user does a search. Do you have a plugin to build forms? Let Omnisearch provide your users with relevant points of contact from their visitors. Shopping cart plugin? Use it to find individual orders or products. Omnisearch is easy to extend via WordPress’s native Filters API to create a comprehensive search experience within your Dashboard.

Social Links

Social Links

Are you using a theme that supports Social Links? Now, you can configure your social icons directly from the Customizer (just make sure you’ve connected your social services using Publicize first).

Debugger

Debug Module

Debugging your Jetpack connection has never been easier. Activate the Jetpack Debugger, find out why Jetpack isn’t working for you, and submit a help request directly from your Dashboard. Our support folks can see the test details, helping them hone in on the issue more efficiently.

Other Enhancements

In addition to these features, you can now customize the “submit” button text on contact forms, as well as captions used by slideshows

(We’ve also spent a lot of time fixing bugs. For a complete list of changes, take a look at the changelog.)

If you’re already running Jetpack, head to your dashboard to update to 2.3. Otherwise, download Jetpack today!

Posted in Features, Releases | Tagged , , , , , | 15 Comments

Tiles and Circles and Squares, Oh My!

Jetpack has lots of different modules that do all sorts of fun and interesting things to supercharge your self-hosted WordPress site. Not everyone uses all of these modules, though — with so much good stuff, it’s easy to miss something. To help you discover all the great things you could be doing with Jetpack, we’ll be highlighting the most-overlooked modules and the modules we get asked the most about. First up: Tiled Galleries!

Are you tired of plain old thumbnail galleries? Are row after row of tiny squares getting you down? Do you spend tons of time using photo editing software to create more interesting layouts for your images? Well have no fear, Tiled Galleries are here! Jetpack lets you display images in a variety of bold, elegant layouts with just a few clicks.

To insert a gallery into a post or page, the first thing you need, of course, are some images. Do you want to showcase your recent trip to New Mexico? Or maybe that new puppy you got? Any collection of images can be turned into a Tiled Gallery, whether you uploaded them to your site weeks ago or are just uploading them now.

Then, make sure that you’ve enabled the Tiled Galleries module in Jetpack. Activate it by going to the Jetpack page in your dashboard, and click the blue “Activate” button on the Tiled Galleries card.

Next, you’ll want to insert a new gallery into your page or post. To add a gallery, click on the “Add Media button,” and then on “Create Gallery” on the top left. You can then either upload new images or select images that are already in your media library. Choose the images you want, then click on the “Create a Gallery” button on the bottom right. Once you’ve created the Gallery, you can drag-and-drop the pictures to put them in the order you want them to appear in.

Now the fun part: choose the layout style that you want for your gallery, in the “Gallery Settings” area on the right, and let the Tiled Galleries module work its magic. You can have:

Square Tiles

or Circles

and my favorite, Tiled Mosaic

Great pictures, aren’t they? And they look smashing in the Tiled Galleries. Jetpack takes care of all the cropping and arrangement, and your site visitors can click any tile to pull up the full image.

I hope this inspires you to turn your regular Thumbnail Galleries into stylish Jetpack-powered Tiled Galleries!

Do you have any questions about Tiled Galleries? Is there a particular Jetpack module you’d like to learn more about? Let us know!

Posted in Features, Tips & Tricks | Tagged , , , | 23 Comments
Follow

Get every new post delivered to your Inbox.

Join 62,230 other followers