Support Forum
Hello
I have 2 CPT "Books" and "Photographers". In "Photographers" I want to display their "Books". I succeed it however I am not able to customize it properly.
By default the pictures of the book will be displayed next to each other (let's say there are 3 pictures), which is good. I want to add the title of the book so I add {{ post.title }} it gets next to each 3 pictures. So until here all is normal.
How do I get the title below each pictures and keep the pictures next to each other too? No matter how I put the <div> or <p>, what I get as a result is the pictures below each other (each pictures with the title below). From the below code how do you keep each picture next to each other with the title below?
{% set relationship = attribute( relationships, 'book-photographer' ) %}
{% for post in relationship.to %}
<a href="{{ post.url }}"><img src="{{ post.thumbnail.medium.url }}" width="{{ post.thumbnail.medium.width }}" height="{{ post.thumbnail.medium.height }}" alt="{{ post.thumbnail.medium.alt }}" />
{{ post.title }}
{% endfor %}
Hi,
It looks like you miss the closing <a>
tag.
<a href="{{ post.url }}"><img src="{{ post.thumbnail.medium.url }}" width="{{ post.thumbnail.medium.width }}" height="{{ post.thumbnail.medium.height }}" alt="{{ post.thumbnail.medium.alt }}" /></a>
<h4>{{ post.title }}</h4>
Please re-check it and let me know how it goes.
thanks, I missed the tag.
I used the above corrected code but still, each picture are below each other instead of being next to each other.
Hi,
You can use the flexbox to show pictures next to each other. Get more details here https://css-tricks.com/snippets/css/a-guide-to-flexbox/
I already did, what it dos it puts the text next to the image but still the images are below each other. What am I missing?
{% set relationship = attribute( relationships, 'book-photographer' ) %}
{% for post in relationship.to %}
<style>
.container {
display:flex
}
</style>
<div class="container">
</div>
{% endfor %}
sorry my full code is not showed, please take the code in your mesaage where you mentionned about the tag missing
and by the way it is not resolverd!!!!!!!!!!!!!!!!!
Hi,
Please move the container tag outside the loop, just like
<div class="container">
{% set relationship = attribute( relationships, 'book-photographer' ) %}
{% for post in relationship.to %}
...
{% endfor %}
</div>