主页wordpress中的2列

时间:2013-03-21 23:34:18

标签: php html css wordpress multiple-columns

我修改了一个wordpress模板,在主页面上留下了两列,结构如下:

enter image description here

但前4个属于另一个类别,而后4个属于另一个

索引代码是:

http://pastebin.com/dMC0saBN

页面是(列已制作,但他们所做的只是重复发布。他们没有订购或过滤)

crossfitlascondes.cl

1 个答案:

答案 0 :(得分:0)

我发生的解决方案是在页面上创建两个循环,由一列到右列和一列到左列分隔。因此,我可以独立处理每个循环的代码,而不会干扰其他列。

索引代码是:

    <?php get_header();?>
<div id="contentslide">
    <?php
        include(TEMPLATEPATH . '/slide.php');
        ?>
</div>
<?php
    get_sidebar();
    ?>
<div id="content">
    <div class="clear">
    </div>
    <div id="contentleft">
    <div id="noticias">Noticias</div> 
    <?php if ( is_home() ) { query_posts($query_string . '&cat=-27'); } ?>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <div class="postleft" id="post-<?php
            the_ID();
            ?>">
            <div class="title">
                <h2><a href="<?php
                    the_permalink();
                    ?>" rel="bookmark" title="Permanent Link to <?php
                    the_title();
                    ?>"><?php
                    the_title();
                    ?></a></h2>
            </div>
            <div class="postmeta">
                <span class="author">Posted by <?php
                    the_author();
                    ?> </span> <span class="clock">  <?php
                    the_time('M - j - Y');
                    ?></span> <span class="comm"><?php
                    comments_popup_link('0 Comment', '1 Comment', '% Comments');
                    ?></span>
            </div>
            <div class="entry">
                <?php
                    if (has_post_thumbnail()) {
                    ?>
                <a href="<?php
                    the_permalink();
                    ?>"><img class="postimgleft" src="<?php
                    bloginfo('stylesheet_directory');
                    ?>/timthumb.php?src=<?php
                    get_image_url();
                    ?>&amp;h=150&amp;w=200&amp;zc=1" alt=""/></a>
                <?php
                    } else {
                    }
                    ?>
                <?php
                    wpe_excerpt('wpe_excerptlength_index', '');
                    ?>
                <div class="clear">
                </div>
            </div>
        </div>
    <?php
        endwhile;
    ?>
    <?php 
        endif; 
    ?>
    <?php
        wp_reset_query();
        ?>
    <div class="navigation">
        <div class="alignleft"><?php previous_posts_link('&laquo; Previous Entries') ?></div>
        <div class="alignright"><?php next_posts_link('Next Entries &raquo;','') ?></div>
    </div>

    </div>
    <div id="contentright">
    <div id="wod">WOD Diario</div>  
    <?php if ( is_home() ) { query_posts($query_string . '&cat=27&'); } ?>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <div class="postright" id="post-<?php
            the_ID();
            ?>">
            <div class="title">
                <h2><a href="<?php
                    the_permalink();
                    ?>" rel="bookmark" title="Permanent Link to <?php
                    the_title();
                    ?>"><?php
                    the_title();
                    ?></a></h2>
            </div>
            <div class="postmeta">
                <span class="author">Posted by <?php
                    the_author();
                    ?> </span> <span class="clock">  <?php
                    the_time('M - j - Y');
                    ?></span> <span class="comm"><?php
                    comments_popup_link('0 Comment', '1 Comment', '% Comments');
                    ?></span>
            </div>
            <div class="entry">
                <?php
                    if (has_post_thumbnail()) {
                    ?>
                <a href="<?php
                    the_permalink();
                    ?>"><img class="postimgright" src="<?php
                    bloginfo('stylesheet_directory');
                    ?>/timthumb.php?src=<?php
                    get_image_url();
                    ?>&amp;h=150&amp;w=200&amp;zc=1" alt=""/></a>
                <?php
                    } else {
                    }
                    ?>
                <?php
                    wpe_excerpt('wpe_excerptlength_index', '');
                    ?>
                <div class="clear">
                </div>
            </div>
        </div>

    <?php
        endwhile;
        ?>
    <div class="clear"></div>
    <?php
        else:
        ?>
    <h1 class="title">Not Found</h1>
    <p>Sorry, but you are looking for something that isn't here.</p>
    <?php
        endif;
        ?>
    <div class="navigation">
        <div class="alignleft"><?php previous_posts_link('&laquo; Previous Entries') ?></div>
        <div class="alignright"><?php next_posts_link('Next Entries &raquo;','') ?></div>
    </div>
    <?php
        wp_reset_query();
        ?>
    </div>
</div>
<?php
    get_footer();
    ?>

和代码CSS(汇总)是

#content {
    float:left;
    width: 665px;
    height:100%;
    padding:10px 0px 0px 0px;
    margin:23px 0px 0px 15px;
    display:inline;
    overflow:hidden;

    }

#contentleft {
    float:left;
    width: 50%;
    height:100%;
    display:inline;
    overflow:hidden;

    }

#contentright {
    float:left;
    width: 44%;
    margin-left: 23px;
    height:100%;
    display:inline;
    overflow:hidden;

    }

#contentslide {
    float:left;
    width: 665px;
    height:100%;
    padding:10px 0px 0px 0px;
    margin:35px 0px 0px 15px;
    display:inline;
    overflow:hidden;

    }