WordPress.org

Support

Support » Plugins and Hacks » [Resolved] YARPP 3.3.1: list in two columns, or more.

[Resolved] YARPP 3.3.1: list in two columns, or more.

Viewing 15 replies - 1 through 15 (of 30 total)
  • Plugin Author mitcho (Michael Yoshitaka Erlewine)
    Member

    @mitchoyoshitaka

    You might be able to do this via just CSS but, if not, you could do it with a YARPP template:

    http://mitcho.com/blog/projects/yarpp-3-templates/

    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; ?>
    </ul>
    <?php else: ?>
    <p>No related posts.</p>
    <?php endif; ?>
    kevin heath
    Participant

    @ypraise

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

    Plugin Author mitcho (Michael Yoshitaka Erlewine)
    Member

    @mitchoyoshitaka

    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?

    kevin heath
    Participant

    @ypraise

    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…?

    Michael
    Forum Moderator

    @alchymyth

    with invalid html output by the plugin (or modificatins to it) http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ross.no%2Fcommunicate%2F2011%2F08%2F01%2Fnoctilucent-clouds-3%2F&charset=%28detect+automatically%29&doctype=Inline&group=0 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:
    http://pastebin.com/vigwVnKU

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

    Michael
    Forum Moderator

    @alchymyth

    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.

    Michael
    Forum Moderator

    @alchymyth

    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.

    Michael
    Forum Moderator

    @alchymyth

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

    can you put the code from the pastebin http://pastebin.com/vigwVnKU back into your plugin file?

    somewhere, the changes get lost in the ether 😉

    Done.

    Perhaps the code is executed prior to the page – try from here: http://www.ross.no/communicate/tag/noctilucent-clouds/

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