Forum Display Banner Image per Forum
Quote:
Step 1: Add Custom CSS Rule
Go to:
ACP → Templates & Style → Themes → YOUR THEME → global.css
Scroll to the bottom and add this:
Code:
.forumnameonavatarcs {
text-align: center;
color: #fff;
font-size: 30px;
height: 115px;
margin-top: -151px;
}
Step 2: Edit forumdisplay Template
Go to:
ACP → Templates & Style → Templates → YOUR THEME → Forum Display Templates → forumdisplay
Find `{$header}` and add the following code directly below it:
Locked Content
Guests cannot view hidden content. Please log in.
Step 3: Upload Forum Banner Images
Using FTP or your file manager, navigate to:
images/forums/
If this folder does not exist, create it manually.
Upload your images using the forum ID as the filename:
Code:
<style>
.forumsimagesbg1 {
opacity: 0.3;
height: 230px;
background: url("images/forums/{$foruminfo['fid']}.jpg") center center no-repeat #292929;
background-size: cover !important;
background-repeat: no-repeat;
overflow: hidden;
}
</style>
<table width="100%" height="200" cellspacing="0" cellpadding="25" border="0" class="forumsimagesbg1"></table>
<div class="forumnameonavatarcs">
{$foruminfo['name']}
</div>
Where `1`, `2`, `3` are the forum IDs (found in ACP → Forum Management).
Tips:
- Make sure the images are large enough for display.
- If the position doesn’t look right, tweak the CSS (`margin-top`, `height`, `font-size`, etc.) to suit your theme.
Signature
Working on this