CSS Not Working – Apostrophe 2

  • Unknown's avatar
    misspritha18 · Member ·

    Hi; I just launched my site and activated a Premium Plan so I could use Custom CSS. Most of the CSS I’ve attempted so far has not had any effect (e.g., changing the site title color, changing the entry title color, etc.) but the one that shows in previews is changing the text size in my primary widget.

    However, it doesn’t show in the “live” version of my site. How do I fix this?

    Additionally, how can I make the other changes mentioned above?

    Thank you!

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

  • kokkieh · Staff ·

    Hi there,

    I don’t see any CSS in the Customizer on your site to change the text size in your Gravatar widget. What is the code you added for that? Are you sure you Saved the changes after you added it?

    To change the font size of your widget you’ll need this:

    /* Change font size of Gravatar widget */
#gravatar-3 p {
	font-size: 16px;
}

    (I did make a small change to the CSS you already have – your last rule had an orphaned ), and was missing the closing }, so I’ve fixed that, as that could prevent any subsequent CSS you add from working.)

    changing the site title color

    For that you can use this:

    /* Change site title color */
h1.site-title a {
	color: blue;
}

    changing the entry title color

    I’m assuming you mean the post titles on the front page?Try this:

    /* Change post title color on front page */
.blog article .entry-title a, .blog .featured-content .entry-title a {
	color: blue;
}

    Also note that your plan gives you access to both live chat and direct email support for help with questions like these. You can reach those at any time by clicking the Help icon that appears bottom-right on all the My Sites pages, or else via the direct link at https://wordpress.com/help/contact

  • Unknown's avatar
    misspritha18 · Member ·

    Hi – thank you so much for this. This was incredible and solved all of my concerns. To answer your last question first, I actually emailed WordPress Support yesterday and they responded right away and said that WordPress does not offer CSS support and that I should check help articles (which I had) and help myself to online training tools (which I had tried). Do you know why they would say that?

    Additionally, I was using the standard <p> selector to modify the Gravatar widget text, and it was working the widget but not in live mode. Thank you for the proper code!

    Last question (because you’ve been so helpful!), is there a different selector for the entry titles on the main page that’s not in the featured content section? The entry title code to change text colors appears to affect all posts on the main page, not just the featured content posts at the top.

    Thank you so much!

  • Unknown's avatar
    misspritha18 · Member ·

    I actually figured out the selector piece I mentioned above. Thank you!

  • kokkieh · Staff ·

    I actually emailed WordPress Support yesterday and they responded right away and said that WordPress does not offer CSS support and that I should check help articles

    My apologies for that. Your reply there was from a member of our expert community who provides email support to some free users. It looks like you opened a support request after you’d already bought your premium plan, so you shouldn’t have been routed to them in the first place, but the reply you received was also completely inaccurate. I’m reporting this incident internally to make sure something like this doesn’t happen again.

    We definitely provide support for custom CSS on the Premium Plan or higher, but that support is limited – we’re happy to help with small changes like changing something’s color, but for more complex stuff like layout changes you’ll need to hire a professional if you can’t figure out the code yourself.

    https://wordpress.com/support/css-support/

    Additionally, I was using the standard <p> selector to modify the Gravatar widget text, and it was working the widget but not in live mode. Thank you for the proper code!

    Right. Using only p as the selector means the change is being applied to all regular paragraph text on the page, unless there’s a more specific rule already targeting a given piece of text. The widget text in this case does have a more specific selector, as I gave you above.

    In general it’s best to always try and use the most specific selector you can for the element you want to target. Using a selector that’s less specific can both prevent your code from working (where the element you’re targeting already has a rule with more specific selector affecting it), and it can cause your code to get applied to elements you didn’t intend to target (where those elements don’t have a more specific rule already). We’re happy to help you figure out the correct selector if you’re having trouble finding it yourself :)

  • Unknown's avatar
    misspritha18 · Member ·

    Thank you so much for this thorough and helpful response! I really appreciate it.

  • The topic ‘CSS Not Working – Apostrophe 2’ is closed to new replies.