如何编辑 php 让图像出现在屏幕左侧

问题描述 投票:0回答:1

我对 php 知之甚少,几乎没有引导程序,但我正在尝试更新 WordPress 模板来调整图像在页面上的显示位置。该网站使用高级自定义字段插件,以便能够在整个网站中使用相同的框架。 php 使用这些字段并添加循环和 if 语句来更改图像所在页面的哪一侧。 这个是我正在调整的模板的网页

我正在尝试使蓝色“服务”部分中的图像显示在左侧而不是右侧。这是该部分的 php:

 <?php get_template_part('waves/blue', 'top-one'); ?>
        <div id="about-wrapper" class="wrapper">
        
           <div class="wrapper">
            <div class="<?php echo esc_attr( $container ); ?> back-forth-text-image">
                <?php $sections = get_field('lirtb_sections'); ?>
                <?php $numOfRows = count($sections) - 1; ?>

                <?php foreach($sections as $skey=>$section){ ?>
                    <div class="row <?php echo($skey < $numOfRows ? 'margin-bottom-double sm-margin-bottom-half' : '') ?>">
                        <div class="col-12 col-md-6 <?php echo ($skey % 2 != 0 ? 'pl-5' : '')?>  bft-text padding-right-half">
                            <div class="bft-text-container">
                                <h6 class="sans-serif font-weight-bold emphasis no-margin"><?php echo $section['lirtb_title'] ?></h6>
                                <h3 class="h2"><?php echo $section['lirtb_header']?></h3>
                                <div class="first-p margin-bottom-half">
                                    <?php echo $section['lirtb_text']?>
                                </div>
                                <?php if(
                                        isset($section['lirtb_button_text']) &&
                                         !empty($section['lirtb_button_text']) &&
                                         isset($section['lirtb_link']) &&
                                         !empty($section['lirtb_link'])){?>
                                <a href="<?php echo $section['lirtb_link'] ?>" type="button" class="btn transparent"><?php echo $section['lirtb_button_text'] ?></a>
                                <?php } ?>
                            </div>
                        </div>

                        <div class="col-12 col-md-6  bft-image sm-margin-bottom-quarter">
                        <div class="row">
                            <img src="<?php echo $section['lirtb_image']['url']?>" />
                        </div>  
                        <div class="row">
                            <img src="<?php echo $section['lirtb2_image']['url']?>" />
                        </div>
                        </div>
                    </div>
                <?php } ?>
            </div>
        </div>
        </div>
        <?php get_template_part('waves/blue', 'bottom-one'); ?>

我不需要循环,因为它只是蓝色背景中的一个部分,所以我尝试将循环取出,但事情就从那里开始了……提前致谢!

php wordpress bootstrap-4 advanced-custom-fields
1个回答
0
投票

最好使用CSS来进行这种更改,但只需更改保存图像的div的位置,您就可以首先显示它们,如下面的代码。另外,不要删除“foreach”,它处理数据库中的数据。

 <?php get_template_part('waves/blue', 'top-one'); ?>
        <div id="about-wrapper" class="wrapper">
        
           <div class="wrapper">
            <div class="<?php echo esc_attr( $container ); ?> back-forth-text-image">
                <?php $sections = get_field('lirtb_sections'); ?>
                <?php $numOfRows = count($sections) - 1; ?>

                <?php foreach($sections as $skey=>$section){ ?>
                    <div class="row <?php echo($skey < $numOfRows ? 'margin-bottom-double sm-margin-bottom-half' : '') ?>">
                        <div class="col-12 col-md-6  bft-image sm-margin-bottom-quarter">
                        <div class="row">
                            <img src="<?php echo $section['lirtb_image']['url']?>" />
                        </div>  
                        <div class="row">
                            <img src="<?php echo $section['lirtb2_image']['url']?>" />
                        </div>
                        </div>
                        <div class="col-12 col-md-6 <?php echo ($skey % 2 != 0 ? 'pl-5' : '')?>  bft-text padding-right-half">
                            <div class="bft-text-container">
                                <h6 class="sans-serif font-weight-bold emphasis no-margin"><?php echo $section['lirtb_title'] ?></h6>
                                <h3 class="h2"><?php echo $section['lirtb_header']?></h3>
                                <div class="first-p margin-bottom-half">
                                    <?php echo $section['lirtb_text']?>
                                </div>
                                <?php if(
                                        isset($section['lirtb_button_text']) &&
                                         !empty($section['lirtb_button_text']) &&
                                         isset($section['lirtb_link']) &&
                                         !empty($section['lirtb_link'])){?>
                                <a href="<?php echo $section['lirtb_link'] ?>" type="button" class="btn transparent"><?php echo $section['lirtb_button_text'] ?></a>
                                <?php } ?>
                            </div>
                        </div>
                    </div>
                <?php } ?>
            </div>
        </div>
        </div>
        <?php get_template_part('waves/blue', 'bottom-one'); ?>
© www.soinside.com 2019 - 2024. All rights reserved.