Docs

[yhshin1020]

Hey

I have a convert plug set up on my website and I want to be able to change the font of the text to myriad-set-pro_thin and myriad-set-pro_text, both of which I have already uploaded on my site.

I believe there are css options i can mingle around but unfortunately im not too familiar as to how to change the font of individual block elements. (headings and subheadings).

I would appreciate any help regarding this issue.

Thanks.

[yhshin1020]

This reply has been marked as private.

[Christopher]

Hi there,

I don’t see convertplug element in about us page. Please provide us with URL of page in question.

Thanks.

[yhshin1020]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for pointing that. I don’t see the font-family declared for any element there. I am not sure how are using your custom font but here goes the step by step guide to add custom webfont to your site.

You can add custom fonts to your website using CSS3 @font-face rule. To do this, please review this article: http://css-tricks.com/snippets/css/using-font-face/

Basically you need to add the following code in your child theme’s style.css file (if you haven’t installed a child theme, please visit this to install Child Theme):

@font-face {
  font-family: 'MyWebFont';
  src: url('path-to-your-font-directory/font_name.eot');
  src: url('path-to-your-font-directory/font_name.eot?#iefix') format('embedded-opentype'),
       url('path-to-your-font-directory/font_name.woff') format('woff'),
       url('path-to-your-font-directory/font_name.ttf')  format('truetype'),
       url('path-to-your-font-directory/font_name.svg#svgFontName') format('svg');
}

Replace MyWebFont with the name of your font, path-to-your-font-directory with your fonts directory URL (e.g, http://yourwebsite.com/fonts) and font_name with your font’s name.

Next, whenever you need to use this font, simply use “MyWebFont” (or your custom font name), e.g:

body {
   font-family: 'MyWebFont', sans-serif;
}

Hope this helps. 🙂

Thank you.

[yhshin1020]

Umm, I’ve added the exact same thing in my customiser.

Scroll up and you will see I have added the exact same code.

The css code for body i know, but I want to specifically target the elements inside the Convert Plug.

I hope you understand.

[Rupok]

Hi there,

Please try using the CSS within Child Theme’s CSS as mentioned. At least move the font part to theme CSS and keep it on top of other CSS.

Thanks!

[Author]

Posts