Hi, In Toolset I’ve created a CPT, customer taxonomies and custom fields. In Elementor Templates I’ve created a template page showing many custom fields from Toolset, assigned it to the CPT and incredibly everything works and as I’ve been using Divi for 2 years and tonight’s my first go at Elementor, Astra and Toolset, it’s a miracle (that includes having help from your colleague Christian earlier this evening). BUT.....one of the Toolset custom fields is an image type field that can have multiple instances and the images won’t display on the post page when viewed in a browser.
Using the CPT edit post page I have successfully entered the post field data and published the post. There were several images added to the Toolset image fields area so the post has images saved to it.
In the Elementor template creator window I added an Image Gallery module and under dynamic, Toolset Gallery Field has the key of ‘Girl Images’ ticked automatically, the correct Toolset custom field name, Carousel is selected and it looks like I’ve done everything correctly but there are no images showing on the published page.
Are you able to help please. The site is for an escort agency here in the U.K. so apologies for any nudity in the images if any do pop up.
Many thanks,
Barry.
hidden link
Hi Barry,
Thank you for contacting us and I'll be happy to assist.
In order to see how the content template and image field is set up, I'll need access to the admin area.
Can you please share temporary admin login details in reply to this message?
Your next reply will be private and only you and our support team will have access to it.
Important note: Please make a complete backup copy of the website, before sharing the access details.
regards,
Waqar
Hi Waqar,
In addition to the previous thread, the Elementor Template I used for the Toolset image filed is Girl-001.
Many thanks,
Barry.
Hi Barry,
Thank you for sharing further details.
In the "Gallery" widget's settings (in the template "Girl-001"), the "key" for the image source wasn't selected.
( screenshot: hidden link )
I've selected the corresponding custom field and the images are now showing.
I hope this helps.
regards,
Waqar
Hi Waqar,
Thank you very much for getting the images to show. I don't know what you did though to make it work. The only difference in your screenshot is Toolset Gallery Field (Girl Images). As I had left it (Girl Images) was missing from that string of text, but the key Girl Images did have a tick next to it. So may I know the click here, click there steps you took to change how things were please? Lastly, how do I contain the size of the image container or the images. I want big images but to shrink the viewable size down so the quality is very sharp. Also, there will be tall portrait orientated images and not so tall landscape images but they all need to be the same height when viewed. You can see this in a gallery I created recently using ACF Gallery and PODS here: hidden link
I added as a test image {max-height:500px} in the custom CSS field but this didn't work. Excuse my lack of knowledge with this but are you able to help me make this look exactly how I need, like in the URL above please?
Many thanks,
Barry.
Hi Waqar,
If you can tell me what you did to make the images show I'd be grateful but I think my question about CSS is unfair to ask as it's really for Elementor so I'll ask them about that.
Many thanks,
Barry.
Hi Barry,
Thanks for the update.
When I checked the gallery image's settings, "Toolset Gallery Field" was selected as the source, but the "Key" wasn't.
( before screenshot: hidden link )
The only change I had to made was selecting the "Girl Images" as the "Key" value.
( after screenshot: hidden link )
Your understanding about CSS customization is correct and 1-1 custom code assistance is beyond the scope of support that we provide ( https://toolset.com/toolset-support-policy/ ).
But we do our best to guide in the right direction, whenever possible. To make sure that gallery images stay centered and proportionally confined to a maximum height, you can update your CSS code to:
.elementor-widget-wrap .elementor-widget-container .uael-img-carousel-wrap .slick-slide img {
max-height: 500px;
width: auto;
margin: 0px auto;
}
Following are some useful resources to learn about CSS code customizations:
https://toolset.com/documentation/beyond-the-basics/leverage-existing-styles-and-add-new-css/
hidden link
hidden link
For a new question/concern, please open a new ticket.
regards,
Waqar
Hi Waqar,
I just want to say thank you very much indeed for your support. The issue wasn't even with Toolset but you still took the time to give me CSS code and it works beautifully. Your help is very much appreciated.
Many thanks,
Barry.
You're very welcome Barry and we're here to help!
Glad my message proved useful and feel free to open a new ticket for a different question or concern.
Note: You can mark this ticket as resolved since original concern has been addressed.
Have a great weekend,
Waqar
My issue is resolved now. Thank you!