个性化阅读
专注于IT技术分析

WordPress:主页上的多列

我正在尝试创建一个Wordpress网站。设计在这里

我创建了该网站的大部分轮廓, 除了”关注我们”, “自雇”和”进入工作联盟”三个区域。

客户告诉我他想使这3个区域可编辑。

我的模板包含一个索引文件, 页眉和页脚文件以及显而易见的CSS文件。

我使用的是” Multi Edit插件” Multi Edit插件, 但是该指南会这样做, 以便你创建CustomPage。我想我可以做到, 但是我想要的是将我的index.php文件添加到站点的管理端, 然后将模板指向那里或类似的地方。

由于使用多个似乎无法正确完成工作的WP插件使工作变得有些沮丧。


#1


有很多解决方法:一种是Pekka提到的方法, 另一种是使用”自定义页面”模板的方法。

从理论上讲, 上述方法非常相似, 在执行和包含方面存在细微差别。

也许为了更好地回答你的问题, 我将在下面的”自定义帖子模板”上提供一个非常简短的示例大纲。如果你选择进一步增强其他功能, 则可能需要对Wordpress的Codex进行更多的研究:

自定义帖子模板方法

关于图像链接中提供的线框, 我建议你使用类别过滤器将关联的帖子过滤到右列。因此, 首先, 你需要为我建议的方法创建4个类别, 即:欢迎, 跟随, 自雇和消费。

之后, 你的index.php应该看起来像这样:

索引文件

<?php get_header();?>

<!--container-->
<div id="container">

<?php query_posts('category_name=welcome&showposts=1'); ?>

<?php while (have_posts()) : the_post(); ?>

   <!--top-content-->
   <div class="top-content">

       <h2><a href="<?php the_permalink();?>"><?php the_title();?></a></h2>

       <p><?php the_content();?></p>

   </div>
   <!--top-content-->

<?php endwhile;?>

   <!--bottom-content-->
   <div class="bottom-content">

       <!--follow-->
       <div class="follow">

           <?php include(TEMPLATEPATH . '/follow.php');?>

       </div>
       <!--follow-->

       <!--self-employment-->
       <div class="self-employment">

           <?php include(TEMPLATEPATH . '/self-employment.php');?>

       </div>
       <!--self-employment-->

       <!--consortium-->
       <div class="consortium">

           <?php include(TEMPLATEPATH . '/consortium.php');?>

       </div>
       <!--consortium-->

   </div>
   <!--bottom-content-->

</div>
<!--container-->

<?php get_footer();?>

这里发生的是, 我正在对标记为” WELCOME”类别的帖子进行后查询, 并将这些帖子过滤到内容最多的DIV中。请注意, 我的循环刚好在最热门DIV之前开始, 并在紧随其后结束。这意味着循环只会影响该特定的DIV。我还将帖子限制设置为” 1″, 从而将帖子的显示限制为最新帖子。

从那里继续, 你会注意到在最底层的DIV中, 我为每列包括3个不同的文件。这3个文件将是你需要创建的自定义帖子模板, 并具有一个帖子查询以在正确的帖子中进行过滤。自定义帖子模板的示例如下所示:

跟随PHP

<?php query_posts('category_name=follow&showposts=1'); ?>

<?php while (have_posts()) : the_post(); ?>

    <h2><a href="<?php the_permalink();?>"><?php the_title();?></a></h2>

    <?php the_post_thumbnail('bottom-content-thumb');?> <!--you will have to enable featured image thumbs in your functions.php file before you can do this-->

    <span class="read-more"><a href="<?php the_permalink();?>">Continue Reading</a></span> <!--there are other ways to do the read more link, but I'm just giving an example now so yeah-->

<?php endwhile;?>

底部3列的其余自定义帖子模板应与上面类似。如果样式和所有样式都存在变化, 则可能必须转移一些内容并使用CSS。

我想强调, 这不是实现你希望实现的目标的唯一且唯一的方法, 而是它是众多方法之一。我所建议的只是一个示例, 希望对如何利用”自定义帖子”模板开发基于Wordpress的网站提供一些见解。

最后, 我的建议是更深入地研究Codex, 并了解有关自定义帖子/页面模板的更多信息, 因为最终, 如果你选择制作自定义Wordpress模板, 它们将非常有用。

希望我的帖子对你​​来说更清楚了=)

赞(0) 打赏
未经允许不得转载:srcmini » WordPress:主页上的多列
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏