How to edit a wordpress template?

Question

HTML

Hello! I have a ready-made page template in WordPress, in which the content area across the entire page is divided into a ratio of 3/4 and 1/4, where 3/4 is the content itself, and 1/4 is the sidebar. Template code:

<?php 
/*
*Template Name: Page Machines
*/
?>
<?php get_header(); ?>

    <!-- page-banner-section 
      ================================================== -->
    <section class="page-banner-section">
      <div class="container">
        <h1><?php single_post_title(); ?></h1>
        <?php construct_breadcrumb(); ?>
      </div>
    </section>
    <!-- End page-banner section -->

    <!-- services section 
      ================================================== -->
    <section class="services-section">
      <div class="container">

        <div class="services-box">
          <div class="row">

            <div class="col-md-9">
              <?php 
              while(have_posts()) : the_post();
                the_content(); 
              endwhile;
              ?>	
            </div>

            <div class="col-md-3">
              <div class="services-tabs">
                <?php 
                  if(is_active_sidebar('sidebar-service')){
                    dynamic_sidebar('sidebar-service');
                  }
                ?>
                
              </div>
            </div>

          </div>

        </div>

        
      </div>
    </section>

    <!-- End services section --><!-- footer 
      ================================================== -->
<?php get_footer(); ?>

The content itself on the page consists of several rows with pictures, text blocks and a row with a feedback form (I'm attaching a screenshot for clarity, the form was made using the Contact Form 7 plugin)

I want to change the template code so that the last row with the form is displayed on the entire width of the page and located directly below the row block. Can you tell me how can I rewrite the code to achieve what I want? How can I write a loop so that all the rows in the content area are displayed except for the last one with the form?

Answer 1

You need to call the form directly from the template code under .services-box
the_content();- it displays all the content exactly in the place where it is called. There is no way you can move a piece of content elsewhere without javascript DOM manipulation.

Answer 2

The problem has been resolved. I just put a piece of block code under the loop