Support » Fixing WordPress » How to build a custom query in Twenty Eleven

  • I am trying to build a custom query that will show 9 posts + 1 sticky post on the bottom of the main page. The other pages would just show 10 regular posts each.

    Can you point me in the right direction on how would I do that?

    Do I need to modify content.php file only?

    Thank you in advance for any info.

Viewing 15 replies - 1 through 15 (of 15 total)
  • By “main page” do you mean your homepage? If so, you could start by looking at your index.php file. Or, if you have your site set to display a static page for the home page, you might want to create a separate template for that page. See:

    I dont have a static page. I think that index.php directs to content.php

    <?php /* Start the Loop */ ?>
    <?php while ( have_posts() ) : the_post(); ?>
    <?php get_template_part( 'content', get_post_format() ); ?>
    <?php endwhile; ?>

    content.php looks like this:

    There is an is_sticky() function on the top. I was trying to make some changes there but I was not able to get to the point where sticky displays on the bottom.

    I think I would need to look at thinks like “Using the WP_Query Object”, “Building a custom query”, “Using query_posts()”, “Uisng get_posts()” etc.

    Unless you want to filter the posts in some way (like only showing one category, exclude one category, etc), you can go into your reading settings, and set the number of posts to show to 9. Then use wp_query to get a single sticky post after the main loop in index.php

    wp_query basically lets you build your own custom loop:

    Thanks. What would I be looking at if I would like to have 10 posts per page (1, 2, 3 etc) and 9 + 1 (sticky) on the main?

    You could use wp_query on your other pages and manually set the posts_per_page to whatever you wanted.

    This is from wp-includes/query.php

    // Put sticky posts at the top of the posts array
      $sticky_posts = get_option('sticky_posts');
      if ( $this->is_home && $page <= 1 && is_array($sticky_posts) && !empty($sticky_posts) && !$q['ignore_sticky_posts'] ) {
       $num_posts = count($this->posts);
       $sticky_offset = 0;
       // Loop over posts and relocate stickies to the front.
       for ( $i = 0; $i < $num_posts; $i++ ) {
        if ( in_array($this->posts[$i]->ID, $sticky_posts) ) {
         $sticky_post = $this->posts[$i];
         // Remove sticky from current position
         array_splice($this->posts, $i, 1);
         // Move to front, after other stickies
         array_splice($this->posts, $sticky_offset, 0, array($sticky_post));
         // Increment the sticky offset. The next sticky will be placed at this offset.
         // Remove post from sticky posts array
         $offset = array_search($sticky_post->ID, $sticky_posts);
         unset( $sticky_posts[$offset] );

    Does it sound like a good idea to modify this one?

    Moderator keesiemeijer



    Never edit core files.

    This is very difficult to accomplish.

    Try it with this in your theme’s functions.php:

    And with multiple loops in your index.php like this:

    consider creating a child theme instead of editing Twenty Eleven directly – if you upgrade the theme all your modifications will be lost.

    Thank you.

    Moderator keesiemeijer



    No problem 🙂

    Did it work?

    Yes. It works. I used a child theme. It is for a network of about 200 blogs, and the only thing I would need to change is to keep the header image from the parent blog in the child theme also. Right now it switches back to the default (tree, chess board, cone etc).

    I know I can re-upload it, but it would be easier to get around this one in the code.

    Moderator keesiemeijer



    Put your default images in your child theme in a folder with this directory structure: themes/mychildtheme/images/headers/

    Put this in your child theme’s functions.php:

    add_action( 'after_setup_theme', 'theme_header_images', 11 ); 
    function theme_header_images() {
    unregister_default_headers( array( 'wheel', 'shore', 'trolley', 'pine-cone', 'chessboard', 'lanterns', 'willow', 'hanoi' ) );
    $folder = get_stylesheet_directory_uri();
    register_default_headers( array(
        'default_image' => array(
            'url' => $folder.'/images/headers/default_image.jpg',
            'thumbnail_url' => $folder.'/images/headers/default_image_thumb.jpg',
            'description' => __( 'Default Header Image', 'twentyeleven' )

    Your header images “default_image.jpg” and “default_image_thumb.jpg” dimensions must be 1000 × 288 and 230 × 66 pixels.

    I created /images/headers folders in themes/twenty_eleven_sticky and uploaded all the files that belong to this folder from the parents theme (chessboard-thumbnail.jpg, chessboard.jpg, hanoi-thumbnail.jpg, hanoi.jpg etc…).

    Then I added the code to functions.php (in the child theme), changed theme to Parent Twenty Eleven, uploaded a header image, and then switched to Twenty_Eleven_Sticky and the image doesnt show…

    I would like to be able to simply inherit the current header image from the Parents theme to the child theme (after switching to Twenty_Eleven_Sticky). Now it just goes back to default images…

    Moderator keesiemeijer



    Not sure why you want to do it that way (by switching themes), but here goes. Put header.php in your child theme and change this:

    <img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />

    to this:

    					$header_image = twentyeleven_parent_image();
    					if($header_image) :
    						echo $header_image;
    					else : ?>
    					<img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />
    					<?php endif; ?>

    And put this in your child theme’s functions.php:

    function twentyeleven_parent_image() {
    	if ( false !== ( $twentyeleven_mods = get_option( "theme_mods_twentyeleven" ) ) ) {
    		if(isset($twentyeleven_mods['header_image_data']) && !empty($twentyeleven_mods['header_image_data'])) {
    			$default = array(
    			  'url'           => '',
    			  'thumbnail_url' => '',
    			  'width'         => get_theme_support( 'custom-header', 'width' ),
    			  'height'        => get_theme_support( 'custom-header', 'height' ),
    			$image = wp_parse_args( $twentyeleven_mods['header_image_data'], $default );
    			if($image['url'] && $image['width'] && $image['height']) {
    				return '<img src="' . $image['url'] . '" width="' . $image['width'] . '" height="' . $image['height'] . '" alt="" />';
    			} else {
    				return false;
    		return false;
    	return false;

    It works. Thanks again.

    Moderator keesiemeijer



    You’re welcome. I’m glad you got it resolved.

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘How to build a custom query in Twenty Eleven’ is closed to new replies.