Hello,
I would like to know how to change the images in the Better Badder Bigger templete.
I think its in the looper provider content but there is this very long code here, how to manage this ?
Hey @Lyser,
You can delete all that and copy, pasted and edit the following code which is just a shorter version of the demo:
[
"https://pro.dev/img.jpg",
"https://pro.dev/img.jpg",
"https://pro.dev/img.jpg",
"https://pro.dev/img.jpg",
"https://pro.dev/img.jpg",
"https://pro.dev/img.jpg"
]
Notice: Insert your URL in between quotes and remove the comma at the end of the last item.
Thx you !
Is it possible to add a different link for each images ?
Hey There,
Yes, you can use a different link as long as it is the absolute path to the image file.
Cheers.
Sorry, i wasn’t very clear, is it possibe to have a link that redirect to a page when we clic on a image ?
Hello @Lyser,
You need to go to the Image element and you need to enable the Link options.
If it doesn’t work for you please share your details in a secure note. Please provide the following details
- WordPress Login URL
- Admin-level username and password
You can find the Secure Note button at the bottom of your posts
Thanks
Thx @prakash_s but i was talking about having differents redirect links for each image in the looper provider json content
Hello @Lyser,
I would suggest you please add the JSON like this where you need to add the image URL and link URL
You need to add the call image and link using the dynamic content code.
As per the above JSON code, the Image URL can be called using this dynamic content code
{{dc:looper:field key="image"}} Link URL dynamic content code {{dc:looper:field key="link"}}
Hope it helps
Thanks
Perfect, thx a lot !
I try to get the same results as this looper consumer image row (3 images with the right one getting out of the div on the right) and also get the same responsive behavior:
But instead of simple images, i have made custom div image animation, but its not working. I can’t get the same image size as the exemple and the responsive bahavior working both in same time, what 'im doing wrong ?
Hey @Lyser,
Use the Image element instead:
Set a width and height for your DIV elements as well. I made a demo on the page.
Please check it out.
Thx you ! (I put the headline in a div with absolute position and higher z-index to place it in front of image, now the structure of the div is ok with its animations)
Now how do you get the images going out of the div like in section 6 ?
Hey @Lyser,
That’s because of the Div’s Flex Layout setup especially the Wrap = Off setting which lets elements inside it not stack when then overflow.
The images overflow in the Div because their width is 480px. 3 images total + some gap width is more that 1,440px. The Div’s Max Width is only 1200px.
Ok thx christian i see now but what i don’t get is that my div’s layout setup is also wrap off setting but my images don’t exeed the div ? they just go smaller but stay in the div
Hello @Lyser,
Do you want the image to go beyond the DIV element like this?
You will have to set the Overflow of the DIV element to visible.
Thanks.
No the images are ok, no need to change them, i would like to know how to get thoses 3 images to go out of the div like this (section 6) :
(but in my section 5 exemple, the wrap flexbox div is off too but the images keep staying inside the div)
What i want is to understand is how to have my section 5 images the exact same size and responsivness of the themeco template section 6 images (when u shrink theses 3 images (section 6) u can see that that they go smaller but at some point, they stop shrinking to keep the same size even if the screen go smaller, how you do that ?).
Hello @Lyser,
The minimum width should be adjust to a bigger size since your image is smaller.
Hope this helps.
Ok, thx you for your help.