Display base font in page hyperlinks

Solved
TheShiz
Excursionist
14 1 3

Hello,

I need help - Hyperlinks are not displaying in the base font that I have set for my page.

I have a hyperlink that I have created in my "Product-Cards" which displays in my Collection Pages.

I have customised the link colours with the below code, however the font type is NOT displaying as the same as what I have set for my body text in the theme customiser.

Can anyone le me know how I can achieve this, is there a line I can put into the below CSS to point/ refer to the same font as the body font that I have selected?

FYI, the body font that I selected in the theme customiser is Quattrocento Sans.

 

Code in Product-Card.Liquid:

<h3 class="card__name h4">{{ product.title }}</h3>
{{ product.description | strip_html }}
<a class="card__link" "text-small" href="{{ product.url | within: collection }}" target="_blank">I want one!</a>

 

Code in Theme.scss.liquid:

.card__link {
margin-right: $gutter / 2;
font-size: rem(16);
line-height: 2;
color: black;
background-color: white;
text-decoration: none;
padding: 0.25em 0.25em;
}

a.card__link:hover { 
  color: white;
  background-color: #FF00AB;
}

 

KetanKumar
Shopify Partner
15927 1752 5860

@TheShiz 

Welcome to the Shopify community!
and Thanks for your question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
TheShiz
Excursionist
14 1 3

Hi Ketan,

Thank-you for your reply.

My store is not launched yet (theshizlist.com) therefore is password protected.

I thought that you might be able to let me know the course of action I need to take from looking at the code? 

Here is a screen capture showing the hyperlink text (highlighted yellow) as opposed to the body text.

snip.PNG

 

KetanKumar
Shopify Partner
15927 1752 5860

@TheShiz 

if you have come at this section product admin so add text editore link or share your password so i will check

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
TheShiz
Excursionist
14 1 3

This is an accepted solution.

I have realised that the font was not different after all.

My CSS was stipulating a font-size larger than that of the body text.

I have since removed the reference to font size, and problem solved!

Thank-you Ketan for your assistance.

KetanKumar
Shopify Partner
15927 1752 5860

@TheShiz 

Great, thanks for your update and support.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes