-
Hi everyone,
I have been tring to setup the Carousel block for the first time.
Link in the private section.
1. It is a query with a CPT (excerpt and title, no custom fields), and the title is the name at the bottom. But no matter how I configure things I cannot make that title apepar immediately after the text. There is a container within the Loop Item and that container is flex with it set to Flex Start, but that title just will not align the way I want! Also, I have a third field to include a star rating at the top, when I manually add a manual field “*****” and it has a massive bottom margin when I add that (since taken out!)
2. I also want the container to be full height, I have set it to a fixed pixel height, but that is not ideal, I wast each container to be fixed height. I see there is an auto height, but it seems to be ignored (I removed my fix height to test!)
3. Why does it change to only one slide left aligned when I change from slide to fade ?
TIA, Dave
-
Hi Dave,
But no matter how I configure things I cannot make that title apepar immediately after the text.
On the gb-element-f640ecff Container, change Justify Content to Flex Start.
Then select the Text block inside it (gb-text-67e5185a) and remove the Flex Grow, Flex Basis, and Flex Shrink values.
I also want the container to be full height
Select the Carousel Item block and set its Height to auto.
Then set the Height of gb-element-f640ecff to 100%.
Why does it change to only one slide left aligned when I change from slide to fade ?
I’m not sure about that one yet. Could you apply the Fade setting to the Carousel so I can inspect how it behaves?
-
Thanks Alvind,
I have switched it from slide to fade and you can see what I have described.
Note: I have not made the other changes yet.Kind regards, Dave
ps – any reason why the topics in the list here in this support forum are not in most recent date order ? I find it a bit odd!
-
Ah, okay. That’s the default behavior of the Fade transition. It works best when the Carousel’s Slides Per View is set to 1, because the slides are stacked in the same position and fade between each other rather than moving horizontally like the Slide transition. With multiple slides per view, the layout may not behave as expected.
any reason why the topics in the list here in this support forum are not in most recent date order ?
I’ll check with Tom about this.
-
OK thanks, so back to slide.
Cheers, Dave -
No problem!
-
I just went through the changes for the layout (content & height) and all perfect 🙂
Thanks again!
Dave -
Sorry one last question.
Is it possible to have the navigation arrows like on the home page of this dev site ?
Link in private
Dave -
Is it possible to have the navigation arrows like on the home page of this dev site ?
Yes, you can do something like this:
First, select the Carousel block and set its Position to Relative.
Then select the Container that wraps the Carousel Controls and apply these settings:
Display: Flex Justify Content: Space Between Width: 100% Position: Absolute Inset > Bottom: 45% Z-Index: 2Lastly, select the left Carousel Control block and set its Margin Left to –25px. Then select the right Carousel Control block and set its Margin Right to -25px.
-
All good, thanks so much…
Dave -
You’re welcome!
- You must be logged in to reply to this topic.