Change the link-label to a button instead of an arrow link - dawn theme

Eduard02
Tourist
7 0 1

How can I change the link-label to a button. So currently the label is just a word with an arrow next to it, but I would like for this to be a button (with a background) without an arrow. 

 

So currently I have the 'current link-label' image, but I would like for it to be a button (button image). I saw some code, but that changes the whole design of the > a.link.animate-arrow { < code, but I would like to only change the button style on the multi column section.  

 

Thanks!

Button.png

Current link-label.png

Replies 6 (6)

made4Uo
Shopify Partner
3821 716 1149

Hi @Eduard02,

 

Can you provide your website so we can provide a code specific for you?

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free
Eduard02
Tourist
7 0 1
jeroenvandepol
Excursionist
30 0 3

I have the same issue, I can't find how to change the 'arrow-link' to a square button.  I would guess this is something you can configure. Or do I have to make code changes. I use the theme Dawn. Thanks for your reply.

learner2024
Visitor
1 0 0

I facing the same problem, can you show me how to solve it please

 

jeroenvandepol
Excursionist
30 0 3

Hi,

 

I used this solution.

Not the most "clean" solution, but it works. I would prefer a built in configuration option.

 

Due to the above change, the announcement bar became black, to solve that I added the code below (base.css).

 

a.announcement-bar__link.animate-arrow {
background-color: #fff !important;
}

 

And to remove the arrow, I added the code below (also to base.css)

 

.icon-arrow {

    display: none;

}

 

Michael_rocks
Tourist
3 0 1

Hey Eduardo02 I am facing the same challenge. How did you solve it? Thanks!