About us Font

Hey rebecca,

You can use any font you like. Either the ones built into the browsers or even a google font. Here is sample code if you want to add a google font. If using built in fonts or if your template already has a header reference to the font of your choice, then no need for the link reference. If you put a link to a font you like, you can place it into the header of your template if you want access to it again on other pages. if not, then it’s not a big deal, just toss it into your html for that widget. Won’t hurt a thing.

You can wrap your name in a paragraph tag or even just a span tag if you like and add some inline styles. You could also use a custom css class and add css styles for it too. the sample code just shows you a quick inline way. I included some common style declarations in case you want to change the font size, padding, etc. Use any others you like ??

<link href="https://fonts.googleapis.com/css?family=Dancing+Script" rel="stylesheet" type="text/css">

<p style="font-family: 'Dancing Script', cursive;font-size: 28px;margin-top: 10px;">Rebecca Moerkerken
</p>

I’m not sure if this is the right thread to ask this or not, but I thought I would try. I’m trying to increase the size of the font in the text of a widget in Zerif Pro. I have Simple CSS, but tried a few different codes including:

section#aboutus .textwidget {
font-size: 500px;
}

But it doesn’t change. The font is under the “About Vighter” Section. Any suggestions?

Thanks so much!!!

P.S. I don’t really want it 500px, I was just playing around to see if I could see a change…

Hi amberly66,

I don’t know what could be causing your issue. It can be a range of things from the css class names your using or a problem with css inheritance. My guess though is the css class name you’re using to change the font size. One tip is to inspect the element you want to change using the browser dev tool. Find where the font-size is declared, and use that exact same class name to redeclare the style as you want it. If the element’s font size isn’t a unique class name, then you’d have to define one that perhaps is more accurate than the one you already are trying to use. You can also try to add the !important to the style declaration ex: font-size: 500px !important;
This could be used as a way to test if you have the right class name. the !important will override any styles as well in most cases.

Thanks so much! I meant to put the URL…ugh

https://stage.vighter.com under “About Vighter”

I looked at the elements, but there is a lot of code and I don’t want to break anything!