NEED HELP tweaking my carousel code please

Site URL: https://www.pianoharbour.com.au/test1

p/w: pianoharbourtest

Hi all,

I'm a total fish with code but Ive manage to create a carousel in a markdown. I have done it the manual way so no doubt it has issues.
At present I am trying to center the navigation arrows.

But also, when I trying and implement the carousel into an actual page I get display issues: see second markdown of https://www.pianoharbour.com.au/test3

Could anyone help me center the arrows, get rid of wasted space before and after the block, and help with the display issue of the markdown please?

If there is someone out there that is good with code, my website is almost finished but needs a few tweaks, I'm happy to buy someone some wine or give a bit of $$ for some assistance.

This won't solve all the spacing/positioning issues but it's a start. One step at a time eh?

For test1 page.

Add the following to Design > Custom CSS.

[data-section-id="601d426c9314e665653ffd46"],
[data-section-id="601d426c9314e665653ffd46"] .content-wrapper,
[data-section-id="601d426c9314e665653ffd46"] .gallery-reel

  {
  
    padding-top : 0 !important;
    
    }

Let us know how it goes.

8 hours ago, creedon said:

Let us know how it goes.

So sorry, I'm not sure where it should go and what it should do.
I have replaced the data section id with the yui id, and deleted the header carousel which probably made it confusing? I am indeed trying to adjust the carousel in the markdown section on the page test1.

This is really the page I am working on: https://www.pianoharbour.com.au/test3

One step at a time is great, I have identified:
SOLVED - markdown section unfolds on top of subsequent content

SOLVED - navigation arrows not centered

- too much spacing before and after all elements of the carousel - also, too much spacing before and after all elements of the two products in the same markdown.

- ideally I'd prefer a different image display where they would be next to each other like on the header of this page; even if it shows only a little bit of each neighboring image would be better than stacked: https://www.pianoharbour.com.au/services

Any help and or suggestions appreciated, I bit more than I can chew. I'm serious about the wine!

Quote

So sorry, I'm not sure where it should go and what it should do.

My bad. I left a step out of the instructions. now added. Maybe I've had a little to much wine? 😀

Quote

I have replaced the data section id with the yui id, and deleted the header carousel which probably made it confusing?

A moving target is harder to hit.

Please if someone can help please feel free.

8 minutes ago, creedon said:

My bad. I left a step out of the instructions. now added. Maybe I've had a little to much wine? 😀

A moving target is harder to hit.

Please if someone can help please feel free.

I have implemented your piece of code replacing the data section id with the block yui of the markdown, is this correct? I guess not but I am in the dark. I haven't noticed any changes

Thanks Creedon 🙂

8 hours ago, Tone said:

SOLVED - markdown section unfolds on top of subsequent content

SOLVED - navigation arrows not centered

- too much spacing before and after all elements of the carousel - also, too much spacing before and after all elements of the two products in the same markdown.

- ideally I'd prefer a different image display where they would be next to each other like on the header of this page; even if it shows only a little bit of each neighboring image would be better than stacked: https://www.pianoharbour.com.au/services

7 hours ago, creedon said:

A moving target is harder to hit.

Please if someone can help please feel free.

@tuanphan@bangank36, any ideas?