Adding products to WordPress theme

Hello Treehouse students, particularly those more versed in WordPressing than me. :)

I'm building a WordPress theme with WooCommerce for a client.

I have WooCommerce installed and I've put together the building blocks of the theme. But I want products to display as they currently do in my static mockup.

This is a list of images with a price shown contained inside an unordered list for structure. I've spent the morning so far experimenting with ways to get products added to this list. Clearly the WordPress loop drives it.

So I have the index template for the home page, my header and footer templates as well as 3 other uniqute templates for 3 other product ranges. And I need products added in a similar way.

And this is how I'm currently trying to rebuild the list.

index.php
<section class="catalog clearfix">

                <h2>"Hot off the Hook!"</h2>


                <ul class="list">

                <?php

                $args = array(
                    'post_type' => array( 'product' )
                );

                $query = new WP_Query( $args );
                ?>

                    <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post();    ?>

                        <li> <?php 

                        //the_content();

                        the_post_thumbnail();?>

                        <p>Price:</p>



                        </li>

                    <?php endwhile; else :  ?>

                        <p>Oops! We're not picking up any content! </p>

                    <?php endif;  ?>

                </ul>

            </section>

I have CPTUI and Advanced custom fields installed. I've thought that maybe adding them as a Custom Post Type might work. I have a feeling using WP_Query will work somehow but I'm stuck.

Help :-)