Support » Plugin: Yet Another Related Posts Plugin (YARPP) » YARPP 3.3.1: list in two columns, or more.

Viewing 15 replies - 1 through 15 (of 30 total)
  • You might be able to do this via just CSS but, if not, you could do it with a YARPP template:

    I am using a YARP template (yarp-template-post-thumbnail.php), but it does not give such an option and I need help to code a two-column layout.

    This is the content of the template:

    <h3> Related Posts</h3>
    <?php if ($related_query->have_posts()):?>
    <ul class="related-posts">
        <?php while ($related_query->have_posts()) : $related_query->the_post(); ?>
        <li>  <?php $postimageurl = get_post_meta($post->ID, 'image', true); if ($postimageurl) { ?>
                <a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/thumb.php?src=<?php echo $postimageurl; ?>&h=150&w=300&zc=1&q=100" alt="<?php the_title(); ?>" width="300" height="150"/><br /></a>
                <?php } else { ?>
                <a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/thumb.php?src=<?php bloginfo('stylesheet_directory'); ?>/default.jpg&h=100&w=100&zc=1&q=100" alt="<?php the_title(); ?>" width="200" height="100"/></a>
                <?php } ?>
                <a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></li>
                <p class="post_meta"><span class="details"><?php _e('Archived in ', 'woothemes' ); ?> <?php the_category(', ') ?></span></p>
        <?php endwhile; ?>
    <?php else: ?>
    <p>No related posts.</p>
    <?php endif; ?>

    assign width css satements to the related-posts class, with a bit of tweaking you should get it to lie in 2 columns.

    Alternatively you could do it with PHP, but that would involve you modifying that template yourself.

    I would like to continue to use the above template/code, but I’m not a coder, so my question is how to tweak/code so that it displays in 2 columns?

    I use microkid related posts rather than yarp but this should give you a basic outline of css to get columns just change the width until you get the look you want.

    #related-posts ul li{list-style-type: none; font-size: 12px; padding-left: 10px; display: inline-block;
    width: 170px; text-align: center;
    vertical-align: top;}

    As I say I don’t have yarp so you may need to do some adjustments to the above code for your own installation.

    I don’t see where your example fit into the above code…?



    Forum Moderator

    with invalid html output by the plugin (or modificatins to it) as indicated for instance here:
    Line 762, Column 33: document type does not allow element "p" here; assuming missing "li" start-tag

    it is quite impossible to use css to format the output into two columns.

    re-organize the code:

    I tried your revised code and added the styles in .css, but still only one column…..



    Forum Moderator

    unfortunately, you removed the code again, so I have no chance to check what fine tuning might be needed ;-(

    (code suggestion was evaluated with firefox web developer add-on)

    I haven’t removed or changed anything. I have tested only on offline local testbed.

    I have uploaded your revised code to live site now, so you can check it.



    Forum Moderator

    I would have expected a change in the html structure of the related posts output, using my suggested code – and I can’t see it in your example link.

    the code does not seem to get used for this section.

    is that code section a part of the plugin?
    is there a possibility that the plugin does not use this particular code?

    Yes it does.

    Check now – I have renamed the file, so the plugin refers to a non-existing file.



    Forum Moderator

    I see – no images in the ‘related posts’ section.

    can you put the code from the pastebin back into your plugin file?

    somewhere, the changes get lost in the ether 😉


    Perhaps the code is executed prior to the page – try from here:

Viewing 15 replies - 1 through 15 (of 30 total)
  • The topic ‘YARPP 3.3.1: list in two columns, or more.’ is closed to new replies.