Grow your CSS skills. Land your dream job.

WordPress search output.

  • # October 27, 2011 at 12:51 pm

    how can i customize the way the search return looks?

    http://attilahajzer.host-ed.net/?s=s

    searching “s” because i know there would be multiple results.

    my sample post shows up, as well as my pages, how can i encorperate the sidebar? am i going to need a page template?

    # October 27, 2011 at 12:58 pm

    this might come as a weird question. but how do i select the posts individually? because in reality they are all h2′s spans, and p’s group together? how would i give the background of just the individual post a background-color, or padding or something?I just want them to be able to be customizable

    # October 27, 2011 at 1:44 pm

    Go into the loop which produces those posts and wrap them in this:

    >

    If you give each post a category it’ll give it a class like ‘category-resume’ which you can then style accordingly.

    # October 27, 2011 at 2:02 pm

    I didn’t see your earlier questions. Search results are displayed using the search.php file. Within that you can add get_sidebar to display it.

    # October 27, 2011 at 2:17 pm

    that would be loop. php? or search.php?

    # October 27, 2011 at 2:36 pm

    Depends on how your set up, but usually the search results page template will be search.php and the loop for outputting the posts will be in loop.php. The appropriate loop from loop.php will be called from within search.php.

    # October 27, 2011 at 2:58 pm

    okay. so where in my loop.php would i put the code. this is what my loop php is.

    < ?php
    /**
    * The loop that displays posts.
    *
    * The loop displays the posts and the post content. See
    * http://codex.wordpress.org/The_Loop to understand it and
    * http://codex.wordpress.org/Template_Tags to understand
    * the tags used in it.
    *
    * This can be overridden in child themes with loop.php or
    * loop-template.php, where 'template' is the loop context
    * requested by a template. For example, loop-index.php would
    * be used if it exists and we ask for the loop with:
    *
    get_template_part( 'loop', 'index' );
    *
    * @package WordPress
    * @subpackage Starkers
    * @since Starkers 3.0
    */
    ?>

    < ?php
    /* Start the Loop.
    *
    * In Twenty Ten we use the same loop in multiple contexts.
    * It is broken into three main parts: when we're displaying
    * posts that are in the gallery category, when we're displaying
    * posts in the asides category, and finally all other posts.
    *
    * Additionally, we sometimes check for whether we are on an
    * archive page, a search page, etc., allowing for small differences
    * in the loop on each template without actually duplicating
    * the rest of the loop that is shared.
    *
    * Without further ado, the loop:
    */ ?>
    < ?php while ( have_posts() ) : the_post(); ?>

    < ?php /* How to display posts in the Gallery category. */ ?>

    < ?php if ( in_category( _x('gallery', 'gallery category slug', 'twentyten') ) ) : ?>

    " title="< ?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">< ?php the_title(); ?>


    < ?php twentyten_posted_on(); ?>

    < ?php if ( post_password_required() ) : ?>
    < ?php the_content(); ?>
    < ?php else : ?>
    < ?php
    $images = get_children( array( 'post_parent' => $post->ID, 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'menu_order', 'order' => 'ASC', 'numberposts' => 999 ) );
    $total_images = count( $images );
    $image = array_shift( $images );
    $image_img_tag = wp_get_attachment_image( $image->ID, 'thumbnail' );
    ?>
    ">< ?php echo $image_img_tag; ?>

    < ?php printf( __( 'This gallery contains %2$s photos.', 'twentyten' ),
    'href="' . get_permalink() . '" title="' . sprintf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ) . '" rel="bookmark"',
    $total_images
    ); ?>



    < ?php the_excerpt(); ?>
    < ?php endif; ?>

    " title="< ?php esc_attr_e( 'View posts in the Gallery category', 'twentyten' ); ?>">< ?php _e( 'More Galleries', 'twentyten' ); ?>
    |
    < ?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?>
    < ?php edit_post_link( __( 'Edit', 'twentyten' ), '|', '' ); ?>

    < ?php /* How to display posts in the asides category */ ?>

    < ?php elseif ( in_category( _x('asides', 'asides category slug', 'twentyten') ) ) : ?>

    < ?php if ( is_archive() || is_search() ) : // Display excerpts for archives and search. ?>
    < ?php the_excerpt(); ?>
    < ?php else : ?>
    < ?php the_content( __( 'Continue reading →', 'twentyten' ) ); ?>
    < ?php endif; ?>

    < ?php twentyten_posted_on(); ?>
    |
    < ?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?>
    < ?php edit_post_link( __( 'Edit', 'twentyten' ), '| ', '' ); ?>

    < ?php /* How to display all other posts. */ ?>

    < ?php else : ?>

    " title="< ?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">< ?php the_title(); ?>


    < ?php twentyten_posted_on(); ?>

    < ?php if ( is_archive() || is_search() ) : // Only display excerpts for archives and search. ?>
    < ?php the_excerpt(); ?>
    < ?php else : ?>
    < ?php the_content( __( 'Continue reading →', 'twentyten' ) ); ?>
    < ?php wp_link_pages( array( 'before' => '' . __( 'Pages:', 'twentyten' ), 'after' => '' ) ); ?>
    < ?php endif; ?>

    < ?php
    $tags_list = get_the_tag_list( '', ', ' );
    if ( $tags_list ):
    ?>
    < ?php printf( __( 'Tagged %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list ); ?>
    |
    < ?php endif; ?>
    < ?php comments_template( '', true ); ?>


    < ?php endif; // This was the if statement that broke the loop into three parts based on categories. ?>

    < ?php endwhile; // End the loop. Whew. ?>




    < ?php /* Display navigation to next/previous pages when applicable */ ?>
    < ?php if ( $wp_query->max_num_pages > 1 ) : ?>
    < ?php next_posts_link( __( '← Older posts', 'twentyten' ) ); ?>
    < ?php previous_posts_link( __( 'Newer posts →', 'twentyten' ) ); ?>
    < ?php endif; ?>

    # October 27, 2011 at 3:03 pm

    Have a read through this part and see if you can figure it out:



    < ?php /* How to display all other posts. */ ?>

    < ?php else : ?>

    " title="< ?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">< ?php the_title(); ?>
    < ?php twentyten_posted_on(); ?>

    < ?php if ( is_archive() || is_search() ) : // Only display excerpts for archives and search. ?>
    < ?php the_excerpt(); ?>
    < ?php else : ?>
    < ?php the_content( __( 'Continue reading →', 'twentyten' ) ); ?>
    < ?php wp_link_pages( array( 'before' => '' . __( 'Pages:', 'twentyten' ), 'after' => '' ) ); ?>
    < ?php endif; ?>

    # October 27, 2011 at 3:12 pm

    < ?php /* How to display all other posts. */ ?>

    < ?php else : ?>

    >
    " title="< ?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">< ?php the_title(); ?>
    < ?php twentyten_posted_on(); ?>

    < ?php if ( is_archive() || is_search() ) : // Only display excerpts for archives and search. ?>
    < ?php the_excerpt(); ?>


    < ?php else : ?>
    < ?php the_content( __( 'Continue reading →', 'twentyten' ) ); ?>
    < ?php wp_link_pages( array( 'before' => '' . __( 'Pages:', 'twentyten' ), 'after' => '' ) ); ?>
    < ?php endif; ?>

    like that?

    # October 27, 2011 at 3:19 pm

    That should work yep, but I’d move the closing to before the last endif, as at the moment it’s within the if statement which is checking whether it’s an archive or search. If it isn’t one of those 2 then it wouldn’t close the div. Give it a go and then view your source and see whether it successfully wraps a div with a unique class around each post.

    # October 27, 2011 at 3:34 pm

    okay.

    # October 27, 2011 at 3:36 pm

    im looking at my loop.php and howcome you removed the permalink?

    # October 27, 2011 at 3:43 pm

    I didn’t, I copied and pasted right from the code you posted. It must have been removed by the css-tricks code formatting when you posted it.

    # October 27, 2011 at 4:48 pm

    @attilahajzer, did you manage to get it to work ok?

    # October 27, 2011 at 7:48 pm

    No. forsome reason the div doesn’t show up AT ALL! in the view source.

Viewing 15 posts - 1 through 15 (of 23 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".