Add arrows on featured collection slideshow?

[Mattinnovations]

Hello!

My website URL is:

https://drizzilicious.myshopify.com/

password is: drizzy

So I'm trying to edit the featured collection slideshow.. I want to add arrows on the sides so they're more visible..

and also decrease the space between the image and "choose options button" and make the choose options button smaller..

Does anyone know where I can edit these??

Thanks so much,

Matthew Ortalano

[Made4uo-Ribe · Accepted solution]

Hi @Mattinnovations 

I check your website, the arrow is already visible.

To decrease the space between the image and "choose options button" and make the choose options button smaller.

Do you mean like this?

If it is try this one. 

• From your Shopify admin dashboard, click on "Online Store" and then "Themes".
• Find the theme that you want to edit and click on "Actions" and then "Edit code".
• In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.card:not(.ratio) {
    height: fit-content !important;
}
.card__content .button {
    min-height: fit-content;
}
ul#Slider-template--18694670909735__featured_collection {
    margin-bottom: 0px;
}

• And Save. 

[Mattinnovations]

Awesome!! Thank you!!

Just curious - do you know if I can also redirect the choose options link to go to the product page instead of the popup?

Thanks!!

[Made4uo-Ribe]

Welcome, 

For changing the button link. Go to the Online Store > Theme > Costumize > Go to the secntion > click the button > and you will see the image below. 

That you can change the link of the button. 

[Mattinnovations]

It doesn't work with the "choose options" button because that is from a featured collection section - there is no button section to edit. Do you know what I mean?

[Made4uo-Ribe]

For that you need to find the HTML code where it located. So you can change the link.