[How To] Modify prosilver's header

Rpgexe · Post by **Rpgexe** » Thu Oct 11, 2012 4:21 pm

Hello Robert. Thanks for fast reply

I do it this with your sugestion. Transfer to home page (index.php) work fine but... top of menu is broken (Index icon, search bar etc)..
Problem is on this screenshot.
Any ideas?

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Thu Oct 11, 2012 4:39 pm

Rpgexe wrote:Hello Robert. Thanks for fast reply

I do it this with your sugestion. Transfer to home page (index.php) work fine but... top of menu is broken (Index icon, search bar etc)..
Problem is on this screenshot.
Any ideas?

you must have put the code in the wrong place in the overall_header.html file

Rpgexe · Post by **Rpgexe** » Thu Oct 11, 2012 5:08 pm

After

Code: Select all

<div style="height: 147px;">

:/
I try also before this code. Hmm... Maybe this don't work beacuse I moved SEARCH BAR to place where be FONT SIZE icon?

Here is also one more time my overall_header.html

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>

<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="keywords" content="" />
<meta name="description" content="" />
{META}
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>

<!-- IF S_ENABLE_FEEDS -->
	<!-- IF S_ENABLE_FEEDS_OVERALL --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {SITENAME}" href="{U_FEED}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_NEWS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_NEWS}" href="{U_FEED}?mode=news" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUMS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_ALL_FORUMS}" href="{U_FEED}?mode=forums" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_NEW}" href="{U_FEED}?mode=topics" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS_ACTIVE --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_ACTIVE}" href="{U_FEED}?mode=topics_active" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUM and S_FORUM_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FORUM} - {FORUM_NAME}" href="{U_FEED}?f={S_FORUM_ID}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPIC and S_TOPIC_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_TOPIC} - {TOPIC_TITLE}" href="{U_FEED}?f={S_FORUM_ID}&t={S_TOPIC_ID}" /><!-- ENDIF -->
<!-- ENDIF -->

<!--
	phpBB style name: 	prosilver Special Edition
	Based on style:   	prosilver (this is the default phpBB3 style)
	Original author:  	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		phpBB Styles Team     
	
	NOTE: This page was generated by phpBB, the free open-source bulletin board package.
	      The phpBB Group is not responsible for the content of this page and forum. For more information
	      about phpBB please visit http://www.phpbb.com
-->

<script type="text/javascript">
// <![CDATA[
	var jump_page = '{LA_JUMP_PAGE}:';
	var on_page = '{ON_PAGE}';
	var per_page = '{PER_PAGE}';
	var base_url = '{A_BASE_URL}';
	var style_cookie = 'phpBBstyle';
	var style_cookie_settings = '{A_COOKIE_SETTINGS}';
	var onload_functions = new Array();
	var onunload_functions = new Array();

	<!-- IF S_USER_PM_POPUP and S_NEW_PM -->
		var url = '{UA_POPUP_PM}';
		window.open(url.replace(/&/g, '&'), '_phpbbprivmsg', 'height=225,resizable=yes,scrollbars=yes, width=400');
	<!-- ENDIF -->

	/**
	* Find a member
	*/
	function find_username(url)
	{
		popup(url, 760, 570, '_usersearch');
		return false;
	}

	/**
	* New function for handling multiple calls to window.onload and window.unload by pentapenguin
	*/
	window.onload = function()
	{
		for (var i = 0; i < onload_functions.length; i++)
		{
			eval(onload_functions[i]);
		}
	};

	window.onunload = function()
	{
		for (var i = 0; i < onunload_functions.length; i++)
		{
			eval(onunload_functions[i]);
		}
	};

// ]]>
</script>
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/styleswitcher.js"></script>
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/forum_fn.js"></script>

<link href="{T_THEME_PATH}/print.css" rel="stylesheet" type="text/css" media="print" title="printonly" />
<link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />

<link href="{T_THEME_PATH}/normal.css" rel="stylesheet" type="text/css" title="A" />
<link href="{T_THEME_PATH}/medium.css" rel="alternate stylesheet" type="text/css" title="A+" />
<link href="{T_THEME_PATH}/large.css" rel="alternate stylesheet" type="text/css" title="A++" />

<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
	<link href="{T_THEME_PATH}/bidi.css" rel="stylesheet" type="text/css" media="screen, projection" />
<!-- ENDIF -->
<!-- IF S_MCHAT_ENABLE and (S_MCHAT_ON_INDEX or U_MCHAT) -->
<script type="text/javascript" src="{ROOT_PATH}mchat/jquery-1.5.0.min.js"></script>
<script type="text/javascript" src="{ROOT_PATH}mchat/jquery_cookie_mini.js"></script>
<!-- ENDIF -->
</head>

<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">

<div id="wrap">
    <div class="border-left">
    <div class="border-right">
    <div class="border-top">
    <div class="border-top-left">
    <div class="border-top-right">
        <div class="inside" style="direction: {S_CONTENT_DIRECTION};">
        	<a id="top" name="top" accesskey="t"></a>
        	<div id="page-header">
        		<div class="headerbar">
        			<div class="inner"><span class="corners-top"><span></span></span>
            <div style="height: 147px;">
<a href="./" class="headerbarlink"></a>
        			<div id="site-description">
        				<p>{SITE_DESCRIPTION}</p>
</div>
        				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
<div id="social_bar">
            <div id="social_buttons">
               <a href="http://sega.c0.pl/"><img alt="RSS" src="{T_THEME_PATH}/images/social/sss.png"></a>
               <a href="http://sega.c0.pl/forum/feed.php"><img alt="RSS" src="{T_THEME_PATH}/images/social/rss.png"></a>
               <a href="http://www.facebook.com/SEGASupportSite"><img alt="Facebook" src="{T_THEME_PATH}/images/social/fb.png"></a>
               <a href="http://www.twitter.com/SEGASupportSite"><img alt="Twitter" src="{T_THEME_PATH}/images/social/twitter.png"></a>
               <a href="http://www.youtube.com/SEGASupportSite"><img alt="Twitter" src="{T_THEME_PATH}/images/social/yt.png"></a>
            </div>
        			</div>
    </div>
        			<span class="corners-bottom"><span></span></span></div>
        		</div>
        
        		<div class="navbar">
        			<div class="inner"><span class="corners-top"><span></span></span>
        
        			<ul class="linklist navlinks">
        				<li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a> <!-- BEGIN navlinks --> <strong>&#8249;</strong> <a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAME}</a><!-- END navlinks --></li>
        
        				                <li class="rightside" style="font-size: 1em;">
              <!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
                 <div id="search-box">
                    <form action="{U_SEARCH}" method="post" id="search">
                    <fieldset>
                       <input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" />
                       <input class="button2" value="{L_SEARCH}" type="submit" /><br />
                        {S_SEARCH_HIDDEN_FIELDS}
                    </fieldset>
                    </form>
                 </div>
              <!-- ENDIF -->
            </li>
        
        				<!-- IF U_EMAIL_TOPIC --><li class="rightside"><a href="{U_EMAIL_TOPIC}" title="{L_EMAIL_TOPIC}" class="sendemail">{L_EMAIL_TOPIC}</a></li><!-- ENDIF -->
        				<!-- IF U_EMAIL_PM --><li class="rightside"><a href="{U_EMAIL_PM}" title="{L_EMAIL_PM}" class="sendemail">{L_EMAIL_PM}</a></li><!-- ENDIF -->
        				<!-- IF U_PRINT_TOPIC --><li class="rightside"><a href="{U_PRINT_TOPIC}" title="{L_PRINT_TOPIC}" accesskey="p" class="print">{L_PRINT_TOPIC}</a></li><!-- ENDIF -->
        				<!-- IF U_PRINT_PM --><li class="rightside"><a href="{U_PRINT_PM}" title="{L_PRINT_PM}" accesskey="p" class="print">{L_PRINT_PM}</a></li><!-- ENDIF -->
        			</ul>
        
        			<!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
        			<ul class="linklist leftside">
        				<li class="icon-ucp">
							<a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e">{L_PROFILE}</a>
								<!-- IF S_DISPLAY_PM --> (<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a>)<!-- ENDIF -->
							<!-- IF S_DISPLAY_SEARCH --> &bull;
							<a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
							<!-- ENDIF -->
        					<!-- IF U_RESTORE_PERMISSIONS --> &bull;
        					<a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a>
        					<!-- ENDIF -->
        				</li>
        			</ul>
        			<!-- ENDIF -->
        
        			<ul class="linklist rightside">
        				<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
				<!-- IF S_MCHAT_ENABLE and U_MCHAT --><li class="icon-bump"><a href="{U_MCHAT}#mChat" title="{L_MCHAT_TITLE}">{L_MCHAT_TITLE}</a></li><!-- ENDIF -->
        				<!-- IF not S_IS_BOT -->
        					<!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
							<!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) --><li class="icon-register"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
							<li class="icon-logout"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x">{L_LOGIN_LOGOUT}</a></li>
        				<!-- ENDIF -->
        			</ul>
        
        			<span class="corners-bottom"><span></span></span></div>
        		</div>
        
        	</div>
        
        	<a name="start_here"></a>
        	<div id="page-body">
        		
				<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->
				<div id="information" class="rules">
        			<div class="inner"><span class="corners-top"><span></span></span>
        				<strong>{L_INFORMATION}:</strong> {L_BOARD_DISABLED}
        			<span class="corners-bottom"><span></span></span></div>
        		</div>
        		<!-- ENDIF -->

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Thu Oct 11, 2012 5:17 pm

how are you editing the files?

I do not see the code in either the overall_header.html or the colours.css files on your server.

you must download the file using ftp, edit the file using a good text editor, upload back using ftp
then , you must go to the admin panel, style section, :
click on template, then on the right side click on refresh for your style
then click on theme and then on the right side, click on refresh for your style.
then it wouldn't hurt to purge the cache back on the admin main page.

then refresh your browser: shift reload or control f5 or whatever your browser uses to reload the page from the server.

robert

Rpgexe · Post by **Rpgexe** » Thu Oct 11, 2012 5:31 pm

Robert

beacuse I return to previous version of these 2 files.
Now forum is with your codes (sega.c0.pl/forum). So take a look

Of course files are edited, upp to ftp and styles/cache/browser are refreshed.

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Thu Oct 11, 2012 5:40 pm

Rpgexe wrote:Robert beacuse I return to previous version of these 2 files.
Now forum is with your codes (sega.c0.pl/forum). So take a look
Of course files are edited, upp to ftp and styles/cache/browser are refreshed.

ok, give me a little time to work it out.

on my test board I removed the site description div and it works just fine but you have that part still there.

edit: actually, you have removed all the code for the site description div so just go ahead and remove it from yours as well and see what happens.

Code: Select all

<div id="site-description">
        				
        				<p></p>
        				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
        			</div>

robert

Rpgexe · Post by **Rpgexe** » Thu Oct 11, 2012 5:47 pm

Lumpy Burgertushie wrote: ok, give me a little time to work it out.

Of course

One more time thank you for all your time with my errors.

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Thu Oct 11, 2012 5:48 pm

Rpgexe wrote:
Lumpy Burgertushie wrote: ok, give me a little time to work it out.
Of course
One more time thank you for all your time with my errors.

I edited my post above, check it out.

robert

Rpgexe · Post by **Rpgexe** » Thu Oct 11, 2012 5:58 pm

Removed

Much better, but also is not fixed.
Robert, maybe i try upload a clear overall_header.html - on this version it seems my file have more bugs...

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Thu Oct 11, 2012 8:15 pm

maybe better if I show you my overall_header code:

Code: Select all

<div id="page-header">
        		<div class="headerbar">
        			<div class="inner"><span class="corners-top"><span></span></span>
        
        			<div style="height: 190px;"><a href="./" class="headerbarlink"></a></div>
			<span class="corners-bottom"><span></span></span></div>
        		</div>

and my colours.css:

Code: Select all

    .headerbar {
       background-color: #12A3EB;
       background-image: url("{T_THEME_PATH}/images/header_random_{RANDOM_HEADER}.jpg");
       color: #FFFFFF;
    }

    .headerbarlink {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
}

and the results:

http://phpbbace.com/board/index.php

metrakoenig · Post by **metrakoenig** » Mon Oct 22, 2012 11:50 am

Hello there!

I'm a total newbie, trying to change the header image in the AFTERBURNER style, but no "<div id="site-description">" found in the "styles/prosilver/template/overall_header.html"

Any help please? Thanks in advance...

Pepe

muggins · Post by **muggins** » Mon Oct 22, 2012 1:28 pm

I don't use it, but maybe with a little poking around in the files...

From styles.css

Code: Select all

/* Header */
#logo {width: 288px;height: 58px;background: url(images/sprite.png) 0 -272px no-repeat;display: block;margin: 20px 15px;}
#header {overflow: hidden;}
#header li {list-style: none;float: left;padding-left: 15px;font-weight: bold;}

I'm not certain, but that seems like a good place to start.

Post by **Mick** » Mon Oct 22, 2012 4:40 pm

metrakoenig wrote:trying to change the header image in the AFTERBURNER style

You should ask where you downloaded the style, presumably RocketTheme?

Cypriotmatrix · Post by **Cypriotmatrix** » Fri Nov 16, 2012 10:13 am

Sinom wrote: Go to \styles\prosilver\theme\images and create a new folder in that called social
Place your images inside that folder. As a test I used images from here.

Next, open colours.css and add at the bottom of the file:
Code: Select all
#social_bar {
	height: 20px;
	margin: 0 auto;
	position: relative;
	right: 10px;
	top: -53px;
}
#social_buttons {
	float: right;
}
Go to \styles\prosilver\template and open overall_header.html

Find:
Code: Select all
<div class="navbar">
Add on a new line before:
Code: Select all
<div id="social_bar">
				<div id="social_buttons">
					<a href="Link to your feeds"><img alt="RSS" src="{T_THEME_PATH}/images/social/social_rss.png"></a>
					<a href="http://www.facebook.com/"><img alt="Facebook" src="{T_THEME_PATH}/images/social/social_facebook.png"></a>
					<a href="http://www.twitter.com/"><img alt="Twitter" src="{T_THEME_PATH}/images/social/social_Twitter.png"></a>
				</div>
</div>
Don't forget to refresh your style in the ACP.

This should result with:

Hugs

Hi,

I followed the above with good results.

However, the Facebook, Twitter and RSS buttons inerfere with the search window.

Please see here: http://www.cyprus-forum.net/index.php

How can I move them below the search window? I want to place it just below the header box if possible just above the Portal >> Index butons on the left side in the white space.

Also, how can I add them to the Portal page http://www.cyprus-forum.net?

This is what I have in overall header:

Code: Select all

<!-- IF not $S_IN_PORTAL or S_DISPLAY_PHPBB_MENU -->
    <div id="social_bar">
                <div id="social_buttons">
                   <a href="http://cyprus-forum.net/feed.php"><img alt="RSS" src="{T_THEME_PATH}/images/social/social_rss.png"></a>
                   <a href="http://www.facebook.com/CyprusForum"><img alt="Facebook" src="{T_THEME_PATH}/images/social/social_facebook.png"></a>
                   <a href="https://twitter.com/ForumCyprus"><img alt="Twitter" src="{T_THEME_PATH}/images/social/social_Twitter.png"></a>
                </div>
    </div>
        		<div class="navbar">

Cypriotmatrix · Post by **Cypriotmatrix** » Sat Nov 17, 2012 1:22 pm

Been trying to fix this problem for ages now.

Almost at my wits end.

Anyone have any advice?

advertisements