How to style tags and tag cloud?

Home Forums Support How to style tags and tag cloud?

Home Forums Support How to style tags and tag cloud?

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #173127
    Antonio

    How to style tags and tag cloud? I see that they are a.tag-link-1 a.tag-link-2 a.tag-link-3…
    how?
    Thanks

    #173164
    Tom
    Lead Developer
    Lead Developer

    What are you trying to change?

    If it’s font sizes, you’ll need to do something like this: https://gist.github.com/generatepress/0e9722eb49ddad91ee5d

    Adding PHP: https://generatepress.com/knowledgebase/adding-php-functions/

    #173288
    Antonio

    Just color, padding and background color.

    #173364
    Tom
    Lead Developer
    Lead Developer

    You can do something like this:

    .tagcloud a {
        padding: 10px;
        background: red;
        color: white;
    }
    #1438264
    Maria Luisa

    Hy, and is there a way, by css, to have the same dimension of the various tag? Or is it possible to choose this setting somewhere? I have a particular interest in tag cloud products (woocommerce), but it is also useful for tag cloud in general.
    Thank’s

    #1438582
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    So like a fixed width? What would happen if the tag is wider than the set width?

    #1438607
    Maria Luisa

    No, I meant the possibility to have the font size fixed and to leave to the number of articles the information about the amount of occurrences

    #1438896
    David
    Staff
    Customer Support

    Hi there,

    are you able to share a link to your site so we can make sure the correct CSS is given?

    #1439162
    Maria Luisa

    Oh yes, but the site is on development online, on a new server, and you have to set your local dns in the hosts file if you want to see it, I put the IP number below.
    I’d like to keep the same tag size like here, in the second example: https://wordpress.com/support/widgets/tag-cloud-widget/

    #1439178
    David
    Staff
    Customer Support

    is there any particular post where i can see the Tag Cloud ?

    #1439212
    Maria Luisa

    The tag cloud is in the top bar, visible on every page of the theme (seller)

    #1439243
    David
    Staff
    Customer Support

    Oh my – how did i miss that 🙂

    Try this CSS – i have added some extra styles for the border as per the example:

    .tagcloud a.tag-cloud-link {
        font-size: 12px !important;
        /* extra styles */
        padding: 5px;
        border: 1px solid #777;
        border-radius: 5px;
    }
    #1439290
    Maria Luisa

    Thank you! It worked very well!

    #1439315
    David
    Staff
    Customer Support

    Glad to be of help

Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.