How To Change The Default Number Of Featured Posts Displayed In The WordPress Twenty Fourteen Theme

I just came across a great question in the WordPress.org Forums. It went something like this.

How do I change the default maximum number of featured posts displayed in the WordPress Twenty Fourteen Theme.

Accomplishing this task is not immediately obvious, but it’s not complicated. Here’s how.

What Is Featured Content In Twenty Fourteen?

The Twenty Fourteen theme gives users the ability to show off a number of posts on the Home page. Users can choose to display featured posts either in a grid layout or in a slider.

By going to Appearance > Customize, and locating the Featured Content section in the Customizer panel, it’s possible to select either Grid or Slider as the presentation options for the featured content.

Featured Content With Grid Option Of Customizer Panel In Twenty Fourteen Theme
Featured Content With Grid Option Of Customizer Panel In Twenty Fourteen Theme
Featured Content With Slider Option Of Customizer Panel In Twenty Fourteen Theme
Featured Content With Slider Option Of Customizer Panel In Twenty Fourteen Theme

In addition, you can enter a tag so that Twenty Fourteen singles out posts using that particular tag as being featured posts, or you can leave the relevant textbox blank. In the latter case, Twenty Fourteen will pick out Sticky Posts as the featured content to display on the main page.

To see these settings being applied, users only need to assign the appropriate tag to the posts they want to display as featured when the post is being created or edited, or designate them as sticky from the Publish box to the right of the post editor.

Publish Box In WordPress Post Editor
Publish Box In WordPress Post Editor

In this post, I’m only concerned with the Grid display option of the Featured Content.

By default, the maximum number of posts Twenty Fourteen displays is six. In the image below, my page only shows four posts, because this is all I have in my local WP install. If I had more, let’s say, ten featured posts, the page would show six featured posts in the grid.

Default Maximum Number Of Featured Posts Displayed In Twenty Fourteen Theme
Default Maximum Number Of Featured Posts Displayed In Twenty Fourteen Theme

However, let’s say we’d like to display only three featured posts. One easy way to do this, would be to assign the appropriate tag only to three posts.

This is all well and good, but we don’t want to rely on manual adjustments. We’d love to have our theme do this automatically. If you’re interested, here’s what you need to do to accomplish this task.

#1: Create A Twenty Fourteen Child Theme

You’re going to modify a piece of functionality in the Twenty Fourteen theme, therefore a child theme is mandatory.

If you need some guidance on how to do this, please refer to this Codex article on how to create one.

#2: Create A functions.php File

Inside your child theme, create a new functions.php file where you can add pieces of functionality to your child theme.

#3: Modify Theme Support Settings For Featured Content

Open functions.php of your child theme inside a code editor, and add this chunk of code.

<?php

// Add support for featured content.
function twentyfourteen_child_setup () {
  // This will remove support for featured content in the parent theme  
  remove_theme_support( 'featured-content' );
  
  //This adds support for featured content in child theme 
  //with a different max_posts value of 3 instead of default 6  
  add_theme_support( 'featured-content', array(
    'featured_content_filter' => 'twentyfourteen_get_featured_posts',
	'max_posts' => 3,
  ) );
}

//Action hook for theme support 
add_action( 'after_setup_theme', 'twentyfourteen_child_setup', 11);

The Twenty Fourteen theme leaves users the ability to modify the default maximum number of posts shown on the main page by changing the value of the second parameter of the add_theme_support function.

The code snippet above, deactivates the parent theme’s support settings for featured content and then reactivates theme support for featured content with a modified number of maximum posts. Now your child theme shouldn’t display more than three featured posts in the grid, no matter how many posts have been tagged with the appropriate tag or have been designated as Sticky.

Lower Default Maximum Number Of Featured Posts In Twenty Fourteen Theme
Lower Default Maximum Number Of Featured Posts In Twenty Fourteen Theme

My Theme Still Shows Six Featured Posts … What Can I Do?

It’s possible that you don’t see any changes in your child theme after you’ve performed the steps outlined above.

If this is the case, try one of the work-arounds below, one after the other, starting from the first one.

Toggle Between Slider And Grid In The Customizer

Head over to Appearance > Customize, locate the Featured Content section and perform the following steps.

  • Change the setting from Grid to Slider and save. Refresh the page in the browser
  • Reset the setting from Slider back to Grid and click Save & Publish in the Customizer. Refresh the page in the browser.

Get Your Hands On The Parent Theme (But Only Temporarily)

If by doing the above the new maximum number of featured posts doesn’t stick, try the following.

  • Open functions.php in the parent theme, but keep your child theme as the active theme.
  • Find the function twentyfourteen_setup() function in functions.php of the parent theme. Inside this function, locate the code that adds theme support for featured content (around line 108 of your code editor).

    add_theme_support( 'featured-content', array(
      'featured_content_filter' => 'twentyfourteen_get_featured_posts',
      'max_posts' => 6,
    ) );
    

    Change the max_posts value from 6 to 3. Save and refresh your page in the browser to check that your child theme is now displaying no more than three featured posts.

  • If you now see that no more than three featured posts are being displayed, go back to functions.php in the parent theme and reset max_posts back to its original value, six. Save the document.
  • Refresh your browser, and make sure your child theme still displays three featured posts. If it does, your modifications have stuck and your task has been successfully completed. Congratulations!

To Sum Up

In this post I’ve shown how to modify a piece of functionality in the WordPress Twenty Fourteen theme using functions.php.

In particular, I’ve shown how to change the default value of six to the maximum number of featured posts displayed in the blog listing’s page.

The specific instance considered here was about lowering the maximum number of featured posts from six to three. However, you can apply the same technique to increase that number. After all, displaying a full-page grid of posts would result in an interesting and contemporary layout.

How did this technique work for you? I’d love to hear all about it in the comments below.
Advertisements

21 thoughts on “How To Change The Default Number Of Featured Posts Displayed In The WordPress Twenty Fourteen Theme

      • ah i see! thanks for the guide by the way – helped me with my site over at http://www.wilflare.com πŸ˜€
        any idea what’s the “11” for? sorry I’m still rather clueless with these things (do I really need that line of code?)

        by the way, I tested this – and it seems like we don’t have to switch between grid and slider to enable the new changes – just head on to theme > customizer, the moment the site shows up in the preview, the new changes should be enabled/reflected on the main site itself!

      • Hey Wilflare, your site is coming along quite well, congratulations!
        The number 11 is the priority with which your code hooks into the action hook with respect to other scripts that use the same hook. I use it to make sure that my scripts get executed after the Twenty Fourteen’s scripts. This further ensures that my modifications stick.

        If your changes are visible on the Customizer right away, that’s brilliant! The switching and whatever I added at the end of the article are just work-arounds in case the changes are not visible right away – for some reason it’s been known to happen on occasion. Clearing the cache would be one more simple thing to try out as well, perhaps the first thing to do when changes to a web page are not apparent.

        Thanks for your comments.

    • Hi Kristie,
      It looks like the menu has undergone an overhaul that ended up in a bit of a mess. I can’t see the problem from CSS alone, perhaps the menu is conflicting with something. Try deleting it and creating a new menu.

  1. HI Maria,

    Here’s a query with your method above: I’ve made the changes to my site, but want the featured content to display my latest posts. I’ve tried asking this in the wordpress forums but no one seems bothered to answer me. As it stands, my latest posts are queueing up at the bottom of my homepage and my content is going stale! I know I have latest posts in the side bar, but it’s not really where I want my current content to be displayed. I am using a child theme of wordpress twenty fourteen.

    Thanks,

    Clarissa
    http://www.newjewishconvert.co.uk

    • Hi Clarissa,
      Thanks for stopping by.

      I’ve had a look at your website and it seems to me that if you’d like your featured content to appear in the featured area at the very top of the page you need to add a tag of featured to the post from the Appearance > Customize panel, in the Featured Content section at the bottom of the Customizer menu.

      Either this or you need to make your post sticky from the post editor panel. To do this, open your latest post for edit, in the Publish box to your right click on Visibility Edit. Here you see a checkbox with the label ‘Stick this post to the front page’. Check the box and save your post. This should ensure that your post is in the featured area. Having your posts in the featured area doesn’t happen automatically by publication date. This seems to happen, however, in the regular posts display. In fact, your first post there is dated 5th February, and it seems to be the latest post.

      I hope this solves your problem. For more help, don’t hesitate to get in touch πŸ™‚

  2. Ach – perhaps I didn’t explain. Actually what happens to my home page is that my latest posts appear at the bottom (users have to scroll down to find them) while the featured content stays static. I automatically have my posts tagged with the “featured” category so that they appear in the featured area. But from what I can understand, the featured grid or slider area shows the first six posts with the featured category, and displays the rest below. This means my featured content becomes stale, when in actual fact what I want is a grid with featured posts that are my latest posts too. Do you know the code that I’d need to get my theme to select the first six newest posts from my featured content each time someone views my homepage?

    Thanks for looking – I didn’t expect you to reply!

    Clarissa
    http://www.newjewishconvert.co.uk

    • Hi Clarissa,
      It’s a pleasure for me to reply to my readers and simple politeness to reply to emails in general. I think you explained the problem quite well. The thing is that the functionality you’re looking for is not native to Twenty Fourteen, it needs to be custom made. However, you can achieve the same result manually: remove the featured tag to older posts and add it to your newest posts. It’s a bit more tedious but the end result is the same.

  3. Thanks for the great article. I was looking to increase the number of posts from 6 to 15 using the grid, does this code works for it as well? Also, I got a little stock on creating the functions.php file, can you specify or refer a source that can help? Thank you

    • Hi Mapache,
      Thank you for leaving such a nice comment.

      The trick should work for increasing the number of featured posts too. To create functions.php, simply open your text or code editor, create a new file and call it functions.php inside your child theme. At the very top of the file, without any spaces, add an opening PHP tag, like so: <?php. Then add your code as explained in the article. If you’re looking for more, here’s a great reference:
      http://www.wpbeginner.com/glossary/functions-php/

      I hope this has been helpful πŸ™‚

  4. Hi Maria, and thanks for your excellent article and instructions. Just wondering if there’s a way to re-position the grid UNDER a new featured post, rather than in the default position at the top of the page? If this is easily achieved and not too time-consuming for you to explain, would be most appreciative of your advice.

    Cheers
    rolanstein

    • Hi Boomtownrap,
      Thanks for your great comment! I haven’t looked into the Twenty Fourteen theme for a while, however my guess is that the change you require should be done by modifying a template file’s markup and make CSS style adjustments where necessary. I don’t know how comfortable you feel modifying PHP template files and writing CSS code, so I’m not sure how easy you’d find the task. As for me, it’s a matter of digging into the files again and figure out a solution. Cheers!

      • OK, ta Maria (or Maria Antonietta?). I’m not currently capable of doing what it evidently required without help, but you’ve now pointed me in a direction to research.
        Cheers!

  5. I too would like to increase the number of grid items.
    But my websites are all on wordpress.com —what I mean is that they are hosted by WordPress.
    Your idea about changing the Child Theme, is that only for people who download all the theme code from wordpress.org and then load it onto some other host computer (to maintain their own site)?
    Or will it work for me too?
    In which case, how do I get access to the child theme, and then create a new functions.php file?

    • Hi there, thanks for your comment. My tutorial applies to self-hosted WordPress.org themes, not to themes hosted on WordPress.com. In fact, on WP.com you don’t have access to the directory where files and folders are hosted, therefore you can’t create and upload themes, child themes, plugins, etc. You only have access to what WP.com gives you access to, which is mostly their own themes, the post and page editors and the image gallery. If you upgrade, I think you can add CSS-only modifications to your chosen theme. With self-hosted WordPress.org themes, you have total control of your website, including what you upload on your server. I hope this helps πŸ™‚

Have your Say

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s