WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » How to add a customized image for each forum?

View previous topic View next topic Go down  Message [Page 1 of 1]

magicm00n

magicm00n
Registered Member
Registered Member
Hello Very Happy

How do we remove the default forum image and add a customize image for each forum like this:

How to add a customized image for each forum? Untitl13

I'm using phpbb3.

ankillien

ankillien
Administrator
Administrator
Hi,

This javascript will do it...

Code:
$(function(){

$('a.forumtitle:contains("FORUM 1 NAME")').parents('.icon').css('background' , 'url(IMAGE URL) no-repeat 10px 50%');

$('a.forumtitle:contains("FORUM 2 NAME")').parents('.icon').css('background' , 'url(IMAGE URL) no-repeat 10px 50%');

$('a.forumtitle:contains("FORUM 3 NAME")').parents('.icon').css('background' , 'url(IMAGE URL) no-repeat 10px 50%');

});

You need to edit the FORUM NAME and IMAGE URL for each forum. I have added 3 pieces of codes, you can add as many you want, just add one more block below the last one. Example...

Code:
$('a.forumtitle:contains("Chit Chat Forum")').parents('.icon').css('background' , 'url(http://chi_chat_image.png) no-repeat 10px 50%');

Add the code via Admin CP > Modules > javascript management. Add it for homepage only.

Hope it helps.

medlsc

medlsc
Registered Member
Registered Member
ankillier How to keep the default forum image and the customize image together ?

The previously java code doesn't work at multi forums

http://med-lab-scietists.free-forums.biz/

magicm00n

magicm00n
Registered Member
Registered Member
ankillien the code is working but how can i adjust the height and width because the full image is not showing and its clashing with the text like this:

How to add a customized image for each forum? Untitl14

ankillien

ankillien
Administrator
Administrator
medlsc wrote:ankillier How to keep the default forum image and the customize image together ?

The previously java code doesn't work at multi forums

It won't work with multi forums. You can add separate image from Admin CP > General > Forums & Categories.

Modify any forum and there will be an option to add image URL for that forum. You can add it there.

magicm00n wrote:ankillien the code is working but how can i adjust the height and width because the full image is not showing and its clashing with the text like this:

How to add a customized image for each forum? Untitl14

For the spacing issue, you need to change in Admin CP > General > Forum > Configuration > Image cell's width category/board

Increase it there and save Smile

magicm00n

magicm00n
Registered Member
Registered Member
Tyvm! <3

ankillien

ankillien
Administrator
Administrator
You're welcome Very Happy

Solved | Locked

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » How to add a customized image for each forum?

Permissions in this forum:
You cannot reply to topics in this forum