Setting different title-text positions on slideshow banner

Hi all,

I've got a bit of an issue.

I have a slideshow banner implemented on my site. Style wise, I want the first image to have the hero on the left, and the text on the right (Capture 1, attached).

I want the SECOND image in my slideshow to have the hero on the right and the text on the left (Capture 2, attached).

However, when I was on the second image settings, and I set the text position to the left, it then also moved the text position on my first image (Capture 3, attached).

As you can see, this looks wrong. Is there no way for me to be able to set a specific text position on each image, separately from the other images?

Thanks in advance!

Nick

@nickelus Hi Nick, Would it be possible to share your site URL so I can take a look? Thanks!

Hi Lesum,

Of course.

@nickelus The hero images on each banner slide are currently set to 100% width, covering the entire slide. As a result, the positioning of the hero image cannot be adjusted as you indicated. However, we can reposition the text to either the left or right through custom code implementation.

One potential solution could be the modification of the hero images themselves using tools like Photoshop or Canva to ensure the athlete or human figure is correctly positioned. For example, you can place the athlete on the right side for the first hero image. Then, we can implement custom code to move the text to the desired right-aligned position.

Hi Lesum,

Thanks so much for your reply.

I'm not sure I quite understand. 

I am happy with the positions of the girl in each slide. 

In slide one the jumping girl should be on the left, with the text on the right (as in my first attachment).

In slide two, the girl is on the right and the text should be on the left.

The problem is that when I move the text to the left, in slide two, it also affects the text in slide one, making the text now cover the jumping girl.

Is there code you can suggest that will allow me to position the text differently on each slide image?

Thanks again for your help! 🙂

Hi Creedon,

Thanks so much for your help - this appears to have worked!

So to confirm, if I wanted to change anything on slide 3, I would change the nth value to 3. Correct?

Can you elaborate on what you mean by ''You might want to get a little more space around the card with the built-in setting as when the viewport gets narrow the text overlays the arrows.''?

Specifically the 'space around the card' comment?

Many thanks!

Quote

if I wanted to change anything on slide 3, I would change the nth value to 3. Correct?

Yes.

Quote

Can you elaborate on what you mean by ''You might want to get a little more space around the card with the built-in setting as when the viewport gets narrow the text overlays the arrows.''?

I believe there is a setting that you can set that adjusts the padding around the text. I noticed that when the viewport got narrow the text overlapped the arrows with your current setting.

Ah that makes sense.

Thank you so much for your help Creedon - I really appreciate it!