[Answer]-Accommodate images according my template format

0πŸ‘

βœ…

I answer my own question, first thanking to rnevius, my problem was on situating my iteration tags in the template, I should has those tags like this:

<div class=" portfolio-page portfolio-4column">
        <ul id="portfolio-list" data-animated="fadeIn">
        {% for Product in products %}
            <li>
                <img src="{{ Product.pimage0.url }}" alt="{{ Product.name }}" />
                <div class="portfolio-item-content">
                    <span class="header">{{ Product.name }}</span>
                    <p class="body">{{ Product.size }}</p>
                </div>
                <a href="#"><i class="more">+</i></a>

            </li>
        {% endfor %}
        </ul>
        </div>

instead of my above question so i can replicate on good form the original style.

πŸ‘€Jhonny

1πŸ‘

You can simply change the ul to an list-inline type:

<ul id="portfolio-list" class="list-inline" data-animated="fadeIn">

But you should really read up on Bootstrap first. It won’t magically format your templates for you.

My suggestion will only work properly if your content has a fixed width, and your images are the proper size.

πŸ‘€rnevius

Leave a comment