Header section missing on WooCommerce products page - php

Question

So, in my page.php (and other template pages) I have a hero section with a background image and the title of the page. Then, following that, a section where the content goes (with ) all that is inside the loop.
To add WooCommerce functionality I added the below code, as per the official documentation:
// WooCommerce Integration
remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);
add_action('woocommerce_before_main_content', 'my_theme_wrapper_start', 10);
add_action('woocommerce_after_main_content', 'my_theme_wrapper_end', 10);
function my_theme_wrapper_start() {
echo '<section class="page-content large-padding shop-container">';
echo '<div class="grid-container">';
echo '<div class="grid-x">';
echo '<div class="cell entry-content" id="woocom">';
}
function my_theme_wrapper_end() {
echo '</div>';
echo '</div>';
echo '</div>';
echo '</section>';
}
The problem is that, yes, the products appear on the products page and the header and the footer appear, but the previous section (the hero image and title) don't.
What am I doing wrong?
Edit: Here's my page.php code:
<?php get_header(); ?>
<?php while (have_posts()): the_post(); ?>
<section class="page-hero text-center background" style="background-image:url(<?php $src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), '1600×1000', false ); echo $src[0]; ?>);">
<div class="grid-container vertically-aligned">
<div class="grid-x justify-center">
<div class="cell large-9">
<h1 class="m-0"><?php the_title(); ?></h1>
</div>
</div>
</div>
</section>
<section class="page-content large-padding">
<div class="grid-container">
<div class="grid-x">
<div class="cell entry-content">
<?php the_content(); ?>
</div>
</div>
</div>
</section>
<?php endwhile; ?>
<?php get_footer(); ?>
In any case, I've been able to add that section modifying the archive-product.php template from woocommerce. The issue here is that because it's an archive page it doesn't get the attached image to add on the header but the image of the first listed product... is there a way to get the attached image of the Products page?