Howdy, folks! Forgive me if this is in the wrong forum.
I’m trying to create product pages that will display all of the product entries, say, 4 to a row, then start the next row, & so on & so forth. Problem is, I really don’t understand how to do that, code-wise. Is there a special add-on I would need? If not, do any of you have a code example that I could start from? Much appreciated! 😊
Take a look at Responsive Grid System.
You’ll need to integrate it into your EE template.
Thank you so much! This is EXACTLY what I was looking for; however, I don’t see how, really, to have it load, by product category, each individual product without having to hand code every single product entry. It’s been a long time since I’ve used EE, so perhaps I’m just missing something.
Have a great day!
Clearly, I’m an idiot. I just do not understand how the categories are supposed to work. It keeps repeating them, and I do NOT want that. I have X amount of categories. I just want them shown, each different one, one time, in the grid fashion. This is what my code looks like. I really don’t mean to sound so stupid, but it’s not as clear for me to understand as those of you that have been using it religiously. :(
Output URL: http://www.thesagefuloak.com/index.php/shoppe/dev
<div class="tsogrid_section group">
{exp:channel:entries channel="products" status="open" show_empty="yes"}
{categories}
<div class="tsogrid_col span_1_of_4"> <a href="http://{path=shoppe/index}">{category_image}</a> </div>
<div class="tsogrid_col span_1_of_4"> <a href="http://{path=shoppe/index}">{category_image}</a> </div>
<div class="tsogrid_col span_1_of_4"> <a href="http://{path=shoppe/index}">{category_image}</a> </div>
<div class="tsogrid_col span_1_of_4"> <a href="http://{path=shoppe/index}">{category_image}</a> </div>
{/categories}
{/exp:channel:entries}
</div>Thanks!!
OK, finally figured out why it was being repetitive with categories (“hmm, I wonder…if I delete this, will THIS happen?”), but I’m still having issues with the grid.
http://www.thesagefuloak.com/index.php/site/shop_start
I’m using the 4 column grid layout (because 2 rows of 4 is what I’m aiming for), but it’s giving me 5 across & 3 on the bottom, and those 3 are indented, which I don’t want, either. LOL
Here’s the code:
<div class="section group">
{exp:channel:categories channel="products" style="linear" parent_only="yes" status="open" show_empty="yes"}
<div class="col span_1_of_4">
<a href="http://{path=shoppe/index}">{category_image}</a>
</div>
{/exp:channel:categories}
</div>Thoughts? Ideas? Miracles? 😉 Thank you for looking, and for the help! 😊
I’m pretty sure you still need to lay our your grid rows for every four items. Something like the following (note: not actually tested) should work:
{exp:channel:categories channel="products" style="linear" parent_only="yes" status="open" show_empty="yes"}
{if count % 4 == 1}
<div class="section group">
{/if}
<div class="col span_1_of_4">
<a href="http://{path=shoppe/index}">{category_image}</a>
</div>
{if count % 4 == 0 || count == total_results}
</div>
{/if}
{/exp:channel:categories}Packet Tide owns and develops ExpressionEngine. © Packet Tide, All Rights Reserved.