WordPress.org

Ready to get started?Download WordPress

Forums

Blogroll split into 2 columns? (6 posts)

  1. PhaZZed
    Member
    Posted 4 years ago #

    Hi All,

    I am wondering if there is a way to split links into 2 columns? I have done this with categories before, with the code below, but can't adapt it to work with blogroll links.

    <?php
    $cats = explode("<br />",wp_list_categories('title_li=&echo=0&depth=1&style=none'));
    $cat_n = count($cats) - 1;
    for ($i=0;$i<$cat_n;$i++):
    if ($i<$cat_n/2):
    $cat_left = $cat_left.'<li>'.$cats[$i].'</li>';
    elseif ($i>=$cat_n/2):
    $cat_right = $cat_right.'<li>'.$cats[$i].'</li>';
    endif;
    endfor;
    ?>
    <ul class="left">
    <?php echo $cat_left;?>
    </ul>
    <ul class="right">
    <?php echo $cat_right;?>
    </ul>

    Any advice would be appreciated?

    Thank you!

  2. Sophiehound
    Member
    Posted 4 years ago #

    I'm looking for the same thing. I also used the cat code above, and for my categories that works.... don't seem to be able to do the same with the blogroll.

    Have you had any luck since posting?

    Ta, H

  3. digitalartempire
    Member
    Posted 4 years ago #

    looking for a solution too - how to split the links widget ??

  4. digitalartempire
    Member
    Posted 4 years ago #

    hey - I found this -

    http://wordpress.org/extend/plugins/wp-multicollinks/

    plgin seems to work finr - you can split more than just your blogroll too -

    hasnt been updated since 2008 but still looks good -

    let me know how it works : )

  5. livelearncreate
    Member
    Posted 4 years ago #

    Hello everyone!
    The WP-Multicollinks plugin works pretty well but it just flows the links horizontally, this is actually really easy to do with CSS. Don't get me wrong it is a great plugin.

    However, I have been looking for a similar solution but I want the links to be evenly distributed between 3 columns and it lists them like so:

    (Column 1)  (Column 2)  (Column 3)
    Link 1        Link 4        Link 7
    Link 2        Link 5        Link 8
    Link 3        Link 6        Link 9

    So I have cooked up a solution I want to share. I'm not a PHP 'Expert' by any means but this is working well for me.

    Keep in mind you will need to alter it somewhat for 2 or 4 columns.

    <?php
    $term = get_term(2,'link_category') ;
    
    $columns = round($term->count / 3);
    $col1ct = $columns+1;
    $col2ct = ($columns * 2)+1;
    
    $linkCount = 1;
    
    echo "<div id=\"linkCols\"><div id=\"col1\" class=\"col\">";
    
    $linksX = get_bookmarks( array());
          foreach ($linksX as $bookmark){       
    
          	if($linkCount == $col1ct){
          		echo "</div><div id=\"col2\" class=\"col\">";
          	}
          	elseif ($linkCount == $col2ct){
          		echo "</div><div id=\"col3\" class=\"col\">";
          	}
          	?>
                    <a id='relatedlinks' href="<?php echo $bookmark->link_url; ?>" target=_blank>
                              <?php echo $bookmark->link_name; ?>
                          </a> <br /><br />
                        <?php 
    
            if($linkCount == $term->count){
          		echo "</div></div>";
          	}
          	      	$linkCount++;
          	}
    
            ?>

    I put this code directly into a page template—you could easily create a function or a shortcode I imagine.

    If you have any questions I will do my best to check this post.
    I hope this helps.

    *ian

  6. wekko
    Member
    Posted 3 years ago #

    livelearncreate's solution is nice, but I changed it a bit. I wanted the link categories to be shown too. Also, I didn't want to split up the categories. That means not every column will have the same height (except when they have the same amount of links) but that was not a big of a deal for me. If you still want that you should combine mine and livelearncreate's code.

    <?php
                $nrOfColumns = 5;
    
                $terms = get_terms('link_category', 'orderby=name') ;
    
                $rowsPerColumn = round(count($terms)/$nrOfColumns);
    
                for($i = 0; $i<$nrOfColumns; $i++) {
                    echo '<div class="column" id="column-' . $i . '">';
                    for($j = ($i * $rowsPerColumn); $j<($rowsPerColumn * ($i+1)); $j++) {
                        if(!isset($terms[$j]))
                            continue;
    
                        $bookmarks = get_bookmarks('category=' . $terms[$j]->term_id);
                        ?>
                        <h2><?php echo $terms[$j]->name; ?></h2>
                        <ul>
                            <?php
                            foreach($bookmarks as $bookmark) {
                                echo '<li><a href="' . $bookmark->link_url . '">' . $bookmark->link_name . '</a></li>';
                            }
                            ?>
                        </ul>
                        <?php
                    }
                    echo '</div>';
                }
             ?>

    The corresponding CSS:

    #footer div.footer-menu .column { float: left; width: 170px; margin-right: 10px; }
        #footer div.footer-menu .column ul { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px dotted #ccc; }
      #footer div.footer-menu h2 { font-size: 10pt; color: #fff; margin: 0; font-weight: bold; }

    You can change the number of columns by changing the $nrOfColumns variable to a different number. Also note the column width and margin width in the first line of the CSS.

    Frank

Topic Closed

This topic has been closed to new replies.

About this Topic