Widget Issue

Hi there,

i am seeing 3 widgets, your 4th widget is a Tag Cloud, this will only display if your posts have Tags.

Fine Got it, updated few tags, and seen its visible, only problem is the display is not good so how to make it something like this -

https://www.dropbox.com/s/zcjpvy45qhi8yfk/tags.png?dl=0

Post URL - http://venusentertainments.com/accept-debit-credit-card-payments-easily-in-india-with-instapay/

That's a WordPress widget so the theme doesn't control it.

You will need to apply some custom styles.

This should help you to get started:

.sidebar .widget .tagcloud a {
    font-size: 15px !important;
    background-color: #333333;
    padding: 0 5px;
}

Ohh, your CSS changed something but yet looking like this -

https://www.dropbox.com/s/omeq7vl97vihdgq/tags%20cloud%20css.png?dl=0

I think you need to change the codes bit more to achieve this if it's only possible by CSS-

https://www.dropbox.com/s/zcjpvy45qhi8yfk/tags.png?dl=0

Try this CSS instead:

.sidebar .widget .tagcloud a {
    display: inline-block;
    padding: 8px;
    margin-bottom: 4px; 
    font-size: 15px !important;
    background-color: #eee;
    color: #000;
}

no David, Its just changed the background colour of text, now looking like below -

https://www.dropbox.com/s/0iy552583nek9zi/tags%20cloud%20css%201.png?dl=0

However i am looking for this -

https://www.dropbox.com/s/zcjpvy45qhi8yfk/tags.png?dl=0

What you can do more, Reduce bit text size, Change the font, etc and a small line just below the tag text, and we will achieve it, I am giving you website refence url below so that you can check yourself by inspecting elements etc -

https://jnews.io/citynews/category/politics/

Refer left side at bottom...

Try this CSS instead:

.right-sidebar h2.widget-title {
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid rgba(0,0,0,.25);
    margin-bottom: 0.5em;
    position: relative;
}
.right-sidebar h2.widget-title:after {
    content: '';
    width: 30px;
    height: 2px;
    background: #000;
    display: block;
    bottom: -2px;
}

.sidebar .widget .tagcloud a  {
    font-size: 11px!important;
    letter-spacing: 1px;
    line-height: inherit;
    background: #f5f5f5;
    padding: 3px 10px;
    color: #616161;
    display: inline-block;
    margin: 0 3px 6px 0;
    transition: all .2s linear;
}
.sidebar .widget .tagcloud a:hover {
    background-color: #000;
    color: #fff;
}

And delete this CSS that we provided you for one of your earlier requests:

.right-sidebar h2.widget-title {
    text-align: center;
    font-weight: 700;
}

Okay, Almost fine, Only required small padding between Title and Line, How to increase that ???

Try editing this:

.right-sidebar h2.widget-title:after {
    content: '';
    width: 30px;
    height: 2px;
    background: #000;
    display: block;
    bottom: -2px;
}

To this:

.right-sidebar h2.widget-title:after {
    content: '';
    width: 30px;
    height: 2px;
    background: #000;
    display: block;
    bottom: -2px;
    margin-top: 10px;
}

Yes Worked ....Thanks David + Leo

Glad we could help :)