Woocommerce Custom Product Loop

[Pbalazs89]

Hi there,

I would like to create a custom PHP product loop with PRO. Thing is, I can find the single product page template in the files, but is there anything for this functionality that I could start off with?

Thanks!

** Actually, I can see that you guys use a different method and the page.php file for example is referencing: x_get_view( x_get_stack(), ‘wp’, ‘page’ ); another file.

Where can I find the templates page, or how can I create a custom template in this instance?

[ruenel]

Hello @Pbalazs89,

Thanks for writing in!

We used the woocommerce.php file for the display of all Woocommerce product and page layout. You can check each of the files in wp-content/themes/x/framework/views/{your-stack}/woocommerce.php. For example in Integrity, we have this code:

<?php

// =============================================================================
// VIEWS/INTEGRITY/WOOCOMMERCE.PHP
// -----------------------------------------------------------------------------
// WooCommerce page output for Integrity.
// =============================================================================

get_header();

?>

  <div class="x-container max width offset">
    <div class="<?php x_main_content_class(); ?>" role="main">

      <?php woocommerce_content(); ?>

    </div>

    <?php get_sidebar(); ?>

  </div>

<?php get_footer(); ?>

The woocommerce_content() is the WooCommerce function that is in charge in displaying any contents related to WooCommerce and it’s page. If you want to change something in the product page layout, you will have to modify the content-single-product.php which can only be found in the WooCommerce plugin folder, wp-content/plugins/woocommerce/templates/. Now to get you started in modifying this file, you will need to copy wp-content/plugins/woocommerce/templates/content-single-product.php and place this file in your child theme’s folder wp-content/themes/pro-child/woocommerce/content-single-product.php. To know more how you can modify any of the WooCommerce page templates, please check this out:

• https://docs.woocommerce.com/document/template-structure/

Hope this helps.

[Pbalazs89]

Hi there,

Thanks for the reply. Just to clarify:

• This is a archive-product.php page correct?

Because I’m trying to modify it, but it does not seem to work.
I tried modifying it in the woocommerce folder, and in the child theme folder, just to make sure. But it seems to me like your MAIN SHOP page is using some other file. Could you help?

Basically, what I’m aiming to do, is transform this:

Into this:

I’m not asking for coding help, as I know that’s outside the scope of the support, but pointing me toward which files to modify would be great!

Thanks!

[lely]

Hi @Pbalazs89,

You might need to understand how woocommerce is coded first.

Yes, that seems to be a shop page.
For ease of templating and updating, woocommerce built it piece by piece. What you are trying to update is the content inside the product loop which is this file: \wp-content\plugins\woocommerce\templates\content-product.php
Inside that template are different action hooks. Those hooks are defined on \wp-content\plugins\woocommerce\includes\wc-templates-hooks.php. Hooks override by the theme can be found here: \wp-content\themes\x\framework\functions\plugins\woocommerce.php

This might help: https://developer.wordpress.org/plugins/hooks/