New to the community? Start here

Change the Color of the Text in a Blockquote

I’m trying to change the color of the font/text in a block quote on my home page, but it’s not working when I use the text editor in Upfront.

How do I change it?

Thanks.

Sat, 9 Jan 2016 18:25:42
  • Joe
    • Site Builder, Child of Zeus

    Hey, Alex. Thanks for the quick response.

    Disclaimer: you’re working with a NON-techie here. :slight_smile:

    I tried to find the CSS for the block quote using Upfront, thinking I could just match the other font colors that were shown, but I couldn’t find it. So I’m not sure where to put the code you suggest. Nor do I know the color code that the theme uses.

    What do you mean by “web inspector”?

  • Adam
    • Support Gorilla

    Hello Joe,

    @Alex is right about using "web inspector" and adding custom CSS. You can find more about that tool here (it's for Chrome but that works pretty much the same way with Firefox):

    https://developer.chrome.com/devtools

    The code Alex gave you is also right. To apply it to your site open site in browser and then:

    – in Upfront panel (left side) click on "theme settings"

    – click on "add custom css rules"

    – scroll all the content that's inside the editor that pops up all the way dawn

    – paste the code at the end of existing code

    – save editor data ("Save" button on the right)

    – save entire Upfront layout

    In order to adjust color, you will want to replace the

    #FF0000

    part in Alex' code with other value, for example taken from here:

    http://www.w3schools.com/tags/ref_colorpicker.asp

    That said, in case of Upfront child themes (such as Scribe) there's much simpler way. Please follow these steps:

    – open your site in browser

    – enable "Upfront mode" by clicking on an "Upfront" link in your admin toolbar

    – in the left panel click on "Theme Settings"

    – make sure that the "Typography" option is highligted

    – select "Blockquote (BLOCKQUOTE)" element from the "Type Element:" drop-down list

    – click on the colored square under the "Color:" label and select your color

    – save Upfront layout

    You'll also notice that there are "Blockquote (BOCKQUOTE)" and "Alternative Blockquote" elements so you may want to change colors for both. I've attached a screenshot of that setting for you.

    I hope that helps!

    Best regards,

    Adam

    [attachments are only viewable by logged-in members]

  • Joe
    • Site Builder, Child of Zeus

    Thanks, Adam. Easier is always better.

    I have to tell you, I love Upfront so much, I may have to become a website developer…uh, not really. But I do feel sorry for the non-techies among us who don’t have it at their disposal.

    Thanks again!