Changing the font of the widgets

• 

  araaglobal · Member · Feb 24, 2015 at 5:13 pm

  • Copy link
  • Add topic to favorites

  Hello, I would like to know how can I change the font on the widgets I added in my blog. Thanks in advance.

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Feb 25, 2015 at 1:03 am

  • Copy link

  Hi there, are you talking about the font family, font size, color? Are you talking about the content of the widgets, or the widget titles?

  Since you are using Custom Fonts, widget titles would be under this CSS selector:
  .wf-active .widget .widget-title
  Widget content can be either standard text, or test links, such as in Temas
  This would be the CSS selector for links and standard text within widgets:
  .widget
  Let me know if you need further assistance on this. I would be happy to help.

• 

  araaglobal · Member · Feb 25, 2015 at 7:39 am

  • Copy link

  Hello @thesacredpath, I really appreciate you interest in helping me. I’m really new at this, so I have not clue about where to go. Specifically I need to change the widget tittle’s family font, font size and the color as well, moreover the tittles are in capital letters, I would like to change it as well.

  In this sense, could you, please, tell me where should I click to do so and what should I type. If it is not to much trouble for you, some screenshots will be quite useful for me.

  Thanks in advance for your help and time.

• 

  thesacredpath · Member · Feb 26, 2015 at 9:55 pm

  • Copy link

  Specifically I need to change the widget tittle’s family font, font size and the color as well, moreover the tittles are in capital letters, I would like to change it as well.

  Changing font families can be a little tricky due to the way fonts are done by browsers. The browser first sees if the font is available on the website and if not, then it looks to the user’s computer, and if the font doesn’t exist in either location, it will substitute its own serif or sans serif font. What font family are you wanting to use?

  On size and such, I used the web inspector in my browser to find the correct CSS selector, and we can then use that to construct the rule to change color, size and the uppercase.

  .wf-active .widget .widget-title {
      color: #cc0000;
      font-size: 15px;
      font-weight: 800 !important;
      text-transform: none;
  }