Docs

[3b1a2f46-a516-40cf-beba-b611930e4819]

Hi,

I was wondering if there is a way to make the gallery in a portfolio item auto-scroll?

My client doesn’t thing it is obvious enough that it is a gallery (I do but hey) so if it was automatic it may work best.

Is there also a way to

A) increase the size of the corner navigation arrows?
B) move them to the centre of the image?

Finally I can’t find the code to edit the colour of the lines above/below ‘share this project’?

[3b1a2f46-a516-40cf-beba-b611930e4819]

This reply has been marked as private.

[Christian]

Hey there,

Auto scroll is possible with custom development. Regretfully, that is outside the scope of our support. You might want to contact our trusted partners who caters X setup and customization needs. Please see https://community.theme.co/custom-development/

A. Please add the code below in your Appearance > Customize > Custom > Global CSS

.flex-direction-nav a {
    height: 45px;
    width: 45px;
    font-size: 36px;
    line-height: 47px;
}

B.

.flex-direction-nav a.flex-prev {
    left: 48%;
    transform: translateX(-50%);
}

.flex-direction-nav a.flex-next {
    left: 52%;
    transform: translateX(-50%);
}

Thanks.

[3b1a2f46-a516-40cf-beba-b611930e4819]

Great so far thanks, but they also need to be central vertically?

thanks

[Nabeel A]

Hi again,

Can you please share the URL of the page so we can take a closer look?

Thanks!

[3b1a2f46-a516-40cf-beba-b611930e4819]

This reply has been marked as private.

[3b1a2f46-a516-40cf-beba-b611930e4819]

As well as above could you tell me how to edit the colour of the lines above/below ‘share this project’?

thank you!

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

ul.flex-direction-nav {
    top: 50%;
    position: absolute;
    z-index: 99999;
    left: 0;
    width: 100%;
}
.x-entry-share {
    border: none;
}

Hope that helps.

[3b1a2f46-a516-40cf-beba-b611930e4819]

This reply has been marked as private.

[Rad]

Hi there,

Please add this CSS as well,

@media ( min-width: 767px) {
.flex-direction-nav a.flex-prev {
    left: 15%;
}
.flex-direction-nav a.flex-next {
    right: 2%;
    left: auto;
}
}

Hope this helps.

[3b1a2f46-a516-40cf-beba-b611930e4819]

Sorry I think you must have misunderstood,

I would like to keep the arrows in centre (as they are now appearing on desktop) but at the moment the smaller the device gets the more they overlap each other to a point on mobile where they aren’t legible.

Can you help?

thanks!

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

body .x-flexslider .flex-direction-nav a.flex-prev {
    left: 50%;
    transform: translateX(-47px);
}

body .x-flexslider .flex-direction-nav a.flex-next {
    left: 50%;
    transform: translateX(1px);
}

Hope that helps.

[Author]

Posts