WordPress.org

Ready to get started?Download WordPress

Forums

Featured Category Widget
[resolved] Internal CSS (7 posts)

  1. Kyouri
    Member
    Posted 1 year ago #

    Overall this is a great plugin. Thank you for sharing it.

    I would like to alter the font size of the article title, as well as alter the font of the category title. What is the proper class to be inserted into the theme's CSS so these things can be altered? Thank you.

    http://wordpress.org/extend/plugins/category-feature/

  2. tepelstreel
    Member
    Plugin Author

    Posted 1 year ago #

    Cheers for the compliments! Always good to hear that people actually like and use what I do. Especially with that plugin. I don't use it myself at all :)

    The Category Title is not displayed in the Widget actually. But it has a Widget Title which you input yourself (I guess it's that). A WP widget is a container with an id that looks loke that featured_category_widget-# to address the widget title of only the containers of the category column in css, you'll have to insert something like

    div[id^="featured_category_widget"].widget-title h3

    (that would really be the headline of the widget).

    For the link to the post you would have to add a style for

    div[id^="featured_category_widget"] a and there e.g.

    color: #6768fe !important;

    That would affect all the links in the widget (and the !important seems to be, well important here; at least in the theme, I'm using).

    I hope that helps for a bit.

    Greetings,
    Stefan

  3. zauriel
    Member
    Posted 1 year ago #

    Hello, I would like to thank you as well for this plugin because it's just great!
    I have some trouble defining the style of the title of the widget.
    If I let my theme do the styling, the title will have the correct background color but the wrong font color while if I try to style the widget myself there is no way I can change only the title style; now i thought I had found the solution with your kind reply, and I believe I'm very close, yet I am doing something wrong here.

    This is what I've been trying to input in the css style box:

    div[id^="editoriale"].widget-title h3
       background-color: #2656A4;
        color: #FFFFFF;

    but I have no results.

    this is the blog I'm talking about
    http://www.angolodellascommessa.it/

    Thank you for your reply.

  4. Kyouri
    Member
    Posted 1 year ago #

    I completely forgot about this post, my apologies! Thank you, tepelstreel, for your reply.

    @ zauriel

    I'm no guru at CSS, but maybe try:

    div #editoriale .widget-title h3 {
    background-color: #2656A4;
    color: #FFFFFF;
    }
  5. tepelstreel
    Member
    Plugin Author

    Posted 1 year ago #

    Hello both,

    What I wasn't aware of, is that every theme seems to build the widgets differently. That's why there doesn't seem to be a general answer.

    In your case zauriel, the css has to be in the stylesheet of your theme (or some other linked stylesheet) and it has to be exactly as follows:

    div[id^="featured_category_widget"] h3.widget_title {
    background-color: #2656A4;
    }
    div[id^="featured_category_widget"] a {
    color: #ffffff;
    }

    For the Atahualpa theme, which I use in my testing environment, it would look like that:

    div[id^="featured_category_widget"].widget-title h3 {
    background-color: #2656A4;
    }
    div[id^="featured_category_widget"] a {
    color: #ffffff !important;
    }

    As you can see, what is important (no matter whether or not the h3 is in an extra container with the class widget-container or it simply has been given the class widget_container, you always will have to style the background via the headline and the textcolor via the link.

    As you don't have an element with the id 'editoriale', you can't get any result with your code.

    I hope that helped.

    Regards,
    Stefan

  6. zauriel
    Member
    Posted 1 year ago #

    Thank you very much Stefan, I will try to style the widget as you suggested;
    The site is still under construction and I changed the titles a couple of times, but as I can see I have to replace "featured_category_widget" with the title I give to the widget, correct?!

    Thank you again.

  7. tepelstreel
    Member
    Plugin Author

    Posted 1 year ago #

    You are wellcome zauriel,

    but you have to use the code as is. 'featured_category_widget' is the beginning of the id of the container that forms the widget. That's why anything else won't work.

    And you cannot use the widget's styling box to input that code. It has to be in a stylesheet, that has to be attached or in the theme's stylesheet.

    Best,
    Stefan

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic