【问题标题】:Custom WordPress theme using Bulma Framework, blog cards not aligning properly使用 Bulma 框架的自定义 WordPress 主题,博客卡未正确对齐
【发布时间】:2019-08-23 13:58:48
【问题描述】:

我正在使用 Bulma CSS 框架制作 WordPress 主题。到目前为止,它运行良好,只是我的博客卡片显示不正确。

我需要它们在一行上垂直对齐,它们在我的练习 html 文件中做得很好,但是将它移到 WordPress 上它们彼此重叠。

接受建议,并仍在学习 WordPress 的工作原理

目前正在 MAMP Pro 服务器上对此进行测试

这是我的代码:

    <?php 

    $args = array(
    'post_type' => 'post',
    //'posts_per_page' => 2, 
    );

    $blogposts = new WP_Query($args);

    while ($blogposts->have_posts()){
        $blogposts->the_post();

    ?>
    <section>
        <div class="container">
            <div class="columns is-multiline is-variable is-4">
                <div class="column is-4">
                    <div class="card">
                        <div class="card-image"><!--Image container-->
                            <figure class="image"><!--The Image-->
                                <img src="<?php echo get_the_post_thumbnail_url(get_the_ID()); ?>"/>
                            </figure>
                        </div><!--Close image container-->
                        <div class="card-content"><!--Container for blog card text-->
                            <div class="content"><!--blog title, excerpt and link to full article-->
                                <h3 class="post_title"><?php the_title(); ?></h3>
                                <p class="excerpt"><?php the_excerpt(); ?></p>
                                <a class="button" href="<?php the_permalink();?>">Read More</a>     
                            </div><!--close content-->
                        </div><!--Close card-content-->
                    </div><!--Close card-->
                </div><!--Close column -->
            </div><!--Close columns-->
        </div>
    </section>

    <?php } ?><!--close while loop-->

【问题讨论】:

    标签: wordpress frameworks content-management-system themes bulma


    【解决方案1】:

    设法通过移动来解决它

    <?php 
    
    $args = array(
    'post_type' => 'post',
    //'posts_per_page' => 2, 
    );
    
    $blogposts = new WP_Query($args);
    
    while ($blogposts->have_posts()){
        $blogposts->the_post();
    
    ?>
    

    分列is-multiline...

    【讨论】:

      猜你喜欢
      • 2021-12-11
      • 1970-01-01
      • 2021-10-15
      • 2021-10-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-07-06
      • 1970-01-01
      相关资源
      最近更新 更多