I'm not sure I'm approaching this correctly but what I'me trying to accomplish is to have a Dynamic Layer displaying [title] and [excerpt] such that they flow with each other. The [title] may wrap to additional lines, but I always want the excerpt to appear JUST below the title, regardless of whether the title wraps to 1 line or 3. I found I could accomplish this by using this as the Dynamic Layer's content:
<div> <h1>[title]</h1> <p>[excerpt]</p> </div>
Though this "flows" correctly, I lose the font resizing that typically occurs when the parent viewport and container gets resized. You can observe this at the provided URL. Scroll down and look for the pink "grid" with the title "Perspectives" and the word "NEWS".
Are there perhaps some LayerSlider classes I can add to the content elements that would solve this?
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today.
I would like to confirm that we have received your message. Due to the nature of the issue you are experiencing, I will have to consult with my colleagues first. I will get back to you as soon as I can.
We appreciate your patience while we're working towards your ticket.
To make the texts responsive I'd recommend to set them up as two separate layers, that you position under each other. And then set the dynamic 'option' to title / excerpt.
Unfortunately the slider cannot always handle responsively text that is embedded into a complex HTML structure. This is why we recommend the above setup.
Though this makes the text responsive, it doesn't allow the excerpt to flow with the title above it, resulting in either a big gap between title and excerpt to accommodate titles that might wrap to more than 1 line or having the text overlap when the title wraps to more than 1 line.
Unfortunately when a text is broken into two lines, the other separate layer positioned under it will not follow up on this change. However if you write the text as one line, it shouldn't break into two. Could you please show us what exactly would you like to adjust in the slider ?
A picture will help describe what I'm looking to accomplish, which shouldn't be all that uncommon. I want the [title] to be in a header tag, and the [excerpt] in regular body text, and have them flow together. I also want the font size to scale as the container size changes based on the viewport dimensions. See attached images.
Unfortunately we cannot troubleshoot this problem from screenshots. Please provide us with the URL or setup an access, where we can see and investigate this slider.
We have tested the code, and it worked on our end, so we will need to see why isn't it working on your site.
Please try to implement it that way. And in case you still experience problems with it, please set up a temporary WP admin for us so we can make this adjustment.
Ummm, firstly, I think you meant to say "Dynamic" layer type, not "HTML Layer Type". and secondly, I do have the snippet of code saved in a single layer. See screenshot.
I'm not sure I'm approaching this correctly but what I'me trying to accomplish is to have a Dynamic Layer displaying [title] and [excerpt] such that they flow with each other. The [title] may wrap to additional lines, but I always want the excerpt to appear JUST below the title, regardless of whether the title wraps to 1 line or 3. I found I could accomplish this by using this as the Dynamic Layer's content:
<div>
<h1>[title]</h1>
<p>[excerpt]</p>
</div>
Though this "flows" correctly, I lose the font resizing that typically occurs when the parent viewport and container gets resized. You can observe this at the provided URL. Scroll down and look for the pink "grid" with the title "Perspectives" and the word "NEWS".
Are there perhaps some LayerSlider classes I can add to the content elements that would solve this?
Hello cormip,
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today.
I would like to confirm that we have received your message. Due to the nature of the issue you are experiencing, I will have to consult with my colleagues first. I will get back to you as soon as I can.
We appreciate your patience while we're working towards your ticket.
Hello again,
To make the texts responsive I'd recommend to set them up as two separate layers, that you position under each other. And then set the dynamic 'option' to title / excerpt.
Unfortunately the slider cannot always handle responsively text that is embedded into a complex HTML structure. This is why we recommend the above setup.
Though this makes the text responsive, it doesn't allow the excerpt to flow with the title above it, resulting in either a big gap between title and excerpt to accommodate titles that might wrap to more than 1 line or having the text overlap when the title wraps to more than 1 line.
Unfortunately when a text is broken into two lines, the other separate layer positioned under it will not follow up on this change. However if you write the text as one line, it shouldn't break into two. Could you please show us what exactly would you like to adjust in the slider ?
A picture will help describe what I'm looking to accomplish, which shouldn't be all that uncommon. I want the [title] to be in a header tag, and the [excerpt] in regular body text, and have them flow together. I also want the font size to scale as the container size changes based on the viewport dimensions. See attached images.
Thank you. My colleagues and I will look into this to see if we can find anything, and get back to you shortly.
If you use the following HTML code, it should be working:
<span style="font-size: 2em;">[title]</span><br>
<span style="font-size: 0.8em;">[excerpt]</span>
The important thing is NOT to use div, h1, etc elements. But instead, only use spans, and set the initial text size in "em" unit.
That did not work. Title and excerpt overlap. See attached.
Thank you for the feedback. We will check on this and get back to you shortly.
Unfortunately we cannot troubleshoot this problem from screenshots. Please provide us with the URL or setup an access, where we can see and investigate this slider.
We have tested the code, and it worked on our end, so we will need to see why isn't it working on your site.
http://doft.win-soft.com/
Thanks
The problem is that you've created 3 separate layers from the code I've provided.
This code should be inserted into one HTML layer type, as it is, without modifying:
<span style="font-size: 2em;">[title]</span><br>
<span style="font-size: 0.8em;">[excerpt]</span>
Please try to implement it that way. And in case you still experience problems with it, please set up a temporary WP admin for us so we can make this adjustment.
Ummm, firstly, I think you meant to say "Dynamic" layer type, not "HTML Layer Type". and secondly, I do have the snippet of code saved in a single layer. See screenshot.
Thank you for the credentials. We will login, check on this, make some adjustments and let you know of the results.
The code we've provided had to be put into a single DIV. Please check how we've modified the slider.
The dynamic layer type handles the HTML code differently, that is why a single DIV container was needed instead.
Awesome! That was exactly what I was looking for.
For anyone else looking for the solution:
<div><span style="font-size: 2em;">[title]</span><br>
<span style="font-size: 0.8em;">[excerpt]</span></div>
Thank you for the feedback, glad we could be of help. If you need further assistance please let us know.