Popular Tags Layout - Forum | JoomShaper
Staff replied Templates

Popular Tags Layout

Asked by Gregory Loucks 7 months ago Last activity 7 months ago

do you see how under listings tags appear left and write and theyt light up blue?
https://www.gregloucks.com/categories

I want Popular Tags module at the bottom of the page to appear similar. Maybe not exact. But they are stacking on top of each other. I want them to appear left and right horizontal. I want them bigger and lightup if popular but definitely aligned horizontally. Do you know what I do in the standard popular tags module to make them laid out like this?

Thanks,
Greg

2 replies

Gregory Loucks Asked this

Hello? Can someone help me please?

Ziaul Kabir Staff

Hello,

Thanks for reaching out to us.

Please use the following custom CSS to achieve the desired layout:

.mod-tagspopular.tagspopular ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-left: 0;
}
.mod-tagspopular.tagspopular ul li {
list-style: none;
}

.mod-tagspopular.tagspopular ul li a {
    display: inline-block;
    padding: 8px 14px;
    font-size: 16px;
    border-radius: 6px;
    background: #f2f2f2;
    transition: all 0.3s ease;
}
.mod-tagspopular.tagspopular ul li a:hover {
    background: #007bff;
    color: #fff;
}

After adding this CSS, the tags will display horizontally, wrap properly, and include a hover highlight effect.

Thanks.

Gregory Loucks Asked this

THank you and what about module Similar tags withe same effect?

Ziaul Kabir Staff

Please, adjust based on your needs or take help from internet or chatgpt.

Thanks

Log in to reply.