Home>Support>siteorgin post carousel next and previous icon position

siteorgin post carousel next and previous icon position

By Simo, 8 years ago. Last reply by Simo, 8 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hi I am using the vantage theme :):):)

On two different pages I am using pagebuilder and within a row on each page I have inserted the siteorgin post carousel. Both are set up to display different categories and work great, amazingly with my skill set on wordpress. :)

I wanted to move the next and previous “posts” icons so previous is on the left and next is on the right of the carousel and found the code below.

My question is why would it work perfectly for one carousel but on the other it puts the icons together of the right hand side?

////////////////
.sow-carousel-title a.sow-carousel-next, .sow-carousel-title a.sow-carousel-previous {
position: relative;
top: 90px;
z-index: 100;
}
.sow-carousel-title a.sow-carousel-next {
left: 20px;
}
.sow-carousel-title a.sow-carousel-previous {
float: left;
right: 20px;
}
///////////////////

As ever I bow to your superior knowledge and thank you for any assistance.

Simos

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 5 months ago Alex S
    Hi, I Work Here

    Hi Simo,

    Thank you for the kind words! :)

    To be honest, I’m not too sure – I’ll need to inspect the resulting markup to try and spot a difference. Do you have a public URL where we can take a look at what’s going on?

    • 8 years, 5 months ago Simo

      Hi

      Many thanks for the reply.

      http://www.simos.co.uk is a site I am using to test different ideas.

      At the bottom of the landing page is where the carousel has the issue

      http://www.simos.co.uk/recruitment is the page where the carousel works as required.

      Look forward to hearing from you and again thanks.

      Simo

  2. 8 years, 5 months ago Alex S
    Hi, I Work Here

    Hi Simo,

    Okay, so the row housing the working carousel is set to full width stretched, while the non-working version isn’t full width and is also added to a layout builder. Also, there are only two returned results.

    I’m unsure if that’s exactly relevant but that’s all I noticed.

    Please try replacing the above CSS with:

    .sow-carousel-title a.sow-carousel-next {
	right: 24px !important;
}

.sow-carousel-title a.sow-carousel-previous {
	left: -24px !important;
}

.sow-carousel-title {
	position: relative;
}

.sow-carousel-title a.sow-carousel-next, .sow-carousel-title a.sow-carousel-previous {
	position: absolute;
	top: 90px;
	z-index: 100;
}

    How does that look?

    • 8 years, 5 months ago Simo

      Hi Alex,

      I am just having an issue with the hosting site which should be sorted out in about an hour so will try adjusting the page width first; just to see what happens, and then change the code.

      As ever many thanks

      Simos

    • 8 years, 5 months ago Simo

      Hi Alex,

      Seems my hosting site have deleted my wordpress database and so I have to wait 24hrs for them to restore it……..

      I will message you once I have managed to get things sorted..

      Many thanks

      Simos

    • 8 years, 5 months ago Simo

      Hi Alex,

      Finally sorted the hosting people out. :)

      I tried the change in code and the left right arrows ended up at the top of the page?

      I will be double checking and looking at what I can change on the home page i.e. take it out of page builder to see if that does anything.

      Will let you know and many thanks

      Simos

    • 8 years, 5 months ago Simo

      Hi Alexs

      further to my last, I left my code as it is and created the post carousel on another page.

      This worked out as I expected i.e. as the http://www.simos.co.uk/recruitment link.

      On the SIMOS link, I created a new row outside of the pagebuilder and inserted the carousel widget and had the problem again?

      Logic suggests something is hindering it in the simos page???

      Cheers

      Simos

  3. 8 years, 5 months ago Alex S
    Hi, I Work Here

    Hi Simo,

    To clarify, did you remove the old CSS before trying the CSS I provided? I ask as if you didn’t, the CSS will not work.

    Okay so I only saw these differences between the pages: set to full width stretched, while the non-working version isn’t full width and is also added to a layout builder. Also, there are only two returned results.

    Maybe try changing those on the simos to see if it helps?

    • 8 years, 5 months ago Simo

      Hi Alex,

      Sorry for slow response.

      Using chatnsurf.co.uk which has a similar structure to the other site at the moment I:
      Removed the non-working carousel and its row from within the Pagebuilder structure,
      Created another row with a full width setting,
      I DID not change the CSS this time,
      It works:):):)
      On the other site I will play with the testing of it following your advice but at the moment I think it must be a conflict with using it in a pagebuilder structure.

      I will of course feedback to you any findings.

      As ever many thanks for a great theme and support.

      Simos

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More