Add a custom header banner

Articles and Information - phpBB 3.0 modifications and tweaks

Add a custom header banner

Postby Mick » Sun Mar 19, 2017 12:53 pm

Add a Custom Header Image

1) First of all, upload your image to the styles/prosilver/theme/images/ directory.

2) Open styles/prosilver/theme/common.css
Code: Select all
    .headerbar {
       background: #ebebeb none repeat-x 0 0;
       color: #FFFFFF;
       margin-bottom: 4px;
       padding: 0 5px;

After, add:
Code: Select all
height: 100px;

Change the height according to your image.

3) Open styles/prosilver/theme/colours.css

Find:
Code: Select all
    .headerbar {
       background-color: #12A3EB;
       background-image: url("{T_THEME_PATH}/images/bg_header.gif");
       color: #FFFFFF;
    }

Change bg_header.gif to the name of your image.

4) Open styles/prosilver/template/overall_header.html

Find:
Code: Select all
<div id="site-description">

Before, add:
Code: Select all
<div style="height: 90px;">

Note: The height must be 10 pixels less than the height of your image!

Find:
Code: Select all
    <a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
                </fieldset>
                </form>
             </div>
          <!-- ENDIF -->

After, add:

Code: Select all
 </div>



5) Refresh your theme and template.
"The more connected we get the more alone we become" - Kyle Broflovski
User avatar
Mick
 
Posts: 24
Joined: Wed Mar 15, 2017 9:14 am

Return to Articles and information

Who is online

Users browsing this forum: No registered users and 3 guests

cron