Question

我正在学习如何使用wordpress API。我是该框架的新手，因此，我决定安装Understrap以使用Bootstrap 4框架并创建一个简单的产品组合网站。经过一番谷歌搜索之后，我开始尝试该代码，但是这个wordpress主题的许多方面对我来说还不清楚。我想在页面上显示一些帖子，并使用bootstrap类标记来设置它们的显示样式。是否有任何有效的教程，或者有人可以向我建议我需要对模板主题文件进行的正确修改？

我试图创建一个名为postpage.php的页面，并在其中包含此代码，但是它不会被wordpress识别为页面的模板模型。代码：

<?php

$args = array(
'posts_per_page' => 6,
'offset' => 0,
'category' => 'portfolio',
'category_name' => '',
'orderby' => 'date',
'order' => 'DESC',
'include' => '', 'exclude' => '',
'meta_key' => '',
'meta_value' => '',
'post_type' => 'post', 'post_mime_type' => '',
'post_parent' => '',
'author' => '',
'post_status' => 'publish',
'suppress_filters' => true
);

$myposts = get_posts( $args );

foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
<li>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</li>
<?php
endforeach;
wp_reset_postdata();
?>

Answer 1

首先，您需要通过在文件顶部添加以下代码来指定这是页面模板：

<?php /* Template Name: Example Template */ ?>

然后它将显示在页面模板下拉菜单中。有关page templates here的更多信息。

为了添加Boostrap类，您需要将foreach语句包装在Bootstrap容器中，然后将ul更改为bootstrap列：

<div class="container">
  <div class="row">
    <?php foreach ( $myposts as $post ) : setup_postdata($post ); ?>
    <div class="col-sm-4">
      <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    </div>
    <?php endforeach; wp_reset_postdata(); ?>
  </div>
</div>

Answer 2

如果要使用自定义布局，则需要制作一个自定义模板，然后将在其中添加一个页面以使用您的自定义模板。您的自定义模板代码会这样

<?php
/* Template Name: Your custom templete */
get_header();
?><?php $the_query = new WP_Query(array(
'category_name'    => 'popular',
'posts_per_page' => '6',
'order' => 'DESC', // Show only the published posts
));?>
<?php if( $the_query->have_posts() ): ?>
<?php while( $the_query->have_posts() ) : $the_query->the_post();?>
<div class="story-info">
<a class="category-name arts texunset" href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
<span class="daycolor" style="background:<?php the_field('colorpost'); ?>;">&nbsp;</span>
<span>
<?php the_title(); ?>
</span>
</a>
<div class="date">
<?php the_time('F jS, Y') ?> &nbsp;|&nbsp;
<i class="fa fa-signal"></i>
</div>
</div>
<hr>
<?php endwhile; ?>
<?php endif; ?>
<?php get_footer();?>

Wordpress Understrap在页面上显示帖子

2 个答案: