<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
Is in template-homepage.php
.
The markup for products comes from several places. I really need to know what you’re trying to do before I can direct you there.
James, because this is the only code in template-homepage:
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
/**
* @hooked storefront_page_content - 10
* @hooked storefront_product_categories - 20
* @hooked storefront_recent_products - 30
* @hooked storefront_featured_products - 40
* @hooked storefront_popular_products - 50
* @hooked storefront_on_sale_products - 60
*/
do_action( 'homepage' ); ?>
</main><!-- #main -->
</div><!-- #primary -->
<?php get_footer(); ?>
you can see why I’m unable to find the html. Apparently, the markup I’m looking for is buried in the line * @hooked storefront_product_categories - 20
. So how do I drill down into that?
What am I trying to do? In this particular case I’m trying to experiment with various category-image sizes, and rearrange neighboring text accordingly. But from here on out I will always need to be able to find whatever html I may choose, for whatever manipulation I may need, for any location on any web page anywhere on my site, for any design reason that may arise.
So where are these ‘hooked’ blocks of code so I can manipulate the html they output?
Following up on my previous post, I found the <section> string in storefront/inc/structure/template-tags.php when I did a search for that html in my WP files. So I got pretty close to the image source part that would let me change image sizes, etc., but a search for any part of <img src="http://4ninths.com/wp-content/uploads/2015/02/music-450x600-150x150.jpg" alt="Music" width="150" height="150">
didn’t give me any search results.
The images I have there now (4ninths.com) are the theme’s stock photos. I know how to change them in admin, but I want total control.
So to revise my question, where would I find the php that generates the “img src” for homepage product categories?
This is exactly why I asked you what you’re trying to do 🙂 In this case you do not need to touch any code to change the image sizes. There’s a setting in WooCommerce for that. Tweak the dimensions there then run the Regenerate Thumbnails plugin and you’re done.
FYI: The product templates actually come from WooCommerce and work in a similar way (functions hooked into actions). Take a look at content-product.php
and content-product_cat.php
for more information.
I appreciate there’s a bit of a learning curve to doing things this way for some folks, but it’s worth it for the flexibility / stability that this solution provides.
EDIT, I am James Koster, didn’t realise I was logged in to our Woo account, sorry for any confusion 🙂
Great advice, thank you!
It all worked great. Now all I need to do is bone up on actions and filters and hooks and I’ve got the control I’m looking for.
I am also using theme
Is it possible to show short description of products on home page with Read More link ?
Thanks
How many storefront @hooked can I use?
Is there any @hooked contact or address?