phpBB • Free and Open Source Forum Software

RSS Facebook Twitter
Menu

[How To] Modify prosilver's header

For support and discussion related to templates, themes, and imagesets in phpBB 3.0.
Get Involved
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations
Locked
Rpgexe
Registered User
Posts: 6
Joined: Wed Oct 10, 2012 7:39 pm

Re: [How To] Modify prosilver's header

Post by Rpgexe »

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?
Attachments
forum
forum
prtnsc.PNG (457.94 KiB) Viewed 627 times
Top
User avatar
Lumpy Burgertushie
Registered User
Posts: 67372
Joined: Mon May 02, 2005 3:11 am
Contact:
Contact Lumpy Burgertushie

Re: [How To] Modify prosilver's header

Post by Lumpy Burgertushie »

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
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.3 Styles by PlanetStyles.net

If nobody is in the forest, does a tree really fall?
Top
Rpgexe
Registered User
Posts: 6
Joined: Wed Oct 10, 2012 7:39 pm

Re: [How To] Modify prosilver's header

Post by Rpgexe »

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 -->
Top
User avatar
Lumpy Burgertushie
Registered User
Posts: 67372
Joined: Mon May 02, 2005 3:11 am
Contact:
Contact Lumpy Burgertushie

Re: [How To] Modify prosilver's header

Post by Lumpy Burgertushie »

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
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.3 Styles by PlanetStyles.net

If nobody is in the forest, does a tree really fall?
Top
Rpgexe
Registered User
Posts: 6
Joined: Wed Oct 10, 2012 7:39 pm

Re: [How To] Modify prosilver's header

Post by Rpgexe »

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.
Top
User avatar
Lumpy Burgertushie
Registered User
Posts: 67372
Joined: Mon May 02, 2005 3:11 am
Contact:
Contact Lumpy Burgertushie

Re: [How To] Modify prosilver's header

Post by Lumpy Burgertushie »

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
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.3 Styles by PlanetStyles.net

If nobody is in the forest, does a tree really fall?
Top
Rpgexe
Registered User
Posts: 6
Joined: Wed Oct 10, 2012 7:39 pm

Re: [How To] Modify prosilver's header

Post by Rpgexe »

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.
Top
User avatar
Lumpy Burgertushie
Registered User
Posts: 67372
Joined: Mon May 02, 2005 3:11 am
Contact:
Contact Lumpy Burgertushie

Re: [How To] Modify prosilver's header

Post by Lumpy Burgertushie »

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
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.3 Styles by PlanetStyles.net

If nobody is in the forest, does a tree really fall?
Top
Rpgexe
Registered User
Posts: 6
Joined: Wed Oct 10, 2012 7:39 pm

Re: [How To] Modify prosilver's header

Post by Rpgexe »

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...
Top
User avatar
Lumpy Burgertushie
Registered User
Posts: 67372
Joined: Mon May 02, 2005 3:11 am
Contact:
Contact Lumpy Burgertushie

Re: [How To] Modify prosilver's header

Post by Lumpy Burgertushie »

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
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.3 Styles by PlanetStyles.net

If nobody is in the forest, does a tree really fall?
Top
metrakoenig
Registered User
Posts: 1
Joined: Mon Oct 22, 2012 10:39 am

Re: [How To] Modify prosilver's header

Post by metrakoenig »

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
Top
User avatar
muggins
Registered User
Posts: 1183
Joined: Fri Feb 22, 2008 5:12 pm
Location: Texas
Name: Donovan
Contact:
Contact muggins

Re: [How To] Modify prosilver's header

Post by muggins »

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. ;)
Muggins
Top
User avatar
Mick
Support Team Member
Support Team Member
Posts: 22269
Joined: Fri Aug 29, 2008 9:49 am
Location: Cardiff

Re: [How To] Modify prosilver's header

Post by Mick »

metrakoenig wrote:trying to change the header image in the AFTERBURNER style
You should ask where you downloaded the style, presumably RocketTheme?
"The more connected we get the more alone we become" - Kyle Broflovski

Please read: “Am I In The Right Place?” before posting.
Top
Cypriotmatrix
Registered User
Posts: 139
Joined: Sun Mar 21, 2010 3:40 am
Contact:
Contact Cypriotmatrix

Re: [How To] Modify prosilver's header

Post by Cypriotmatrix »

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:

Image

Hugs :ugeek:
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">
Top
Cypriotmatrix
Registered User
Posts: 139
Joined: Sun Mar 21, 2010 3:40 am
Contact:
Contact Cypriotmatrix

Re: [How To] Modify prosilver's header

Post by Cypriotmatrix »

Been trying to fix this problem for ages now.

Almost at my wits end.

Anyone have any advice? :?
Top
Locked

Return to “[3.0.x] Styles Support & Discussion”

advertisements

 BlueHost.com • Web Hosting UK • HostMonster • FastDomain Hosting • Advertise on phpBB.com