[How To]phpBB3 in Joomla 1.5 rhuk_milkyway

For support and discussion related to templates, themes, and imagesets in phpBB 3.0.
Anti-Spam Guide
Locked
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

[How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by precious »

Edit: Please see this post http://www.phpbb.com/community/viewtopi ... 5#p4540785 this has now been done and is a how to!

This is to make a phpBB3 standalone look like its intergrated with Joomla 1.5 rhuk_milkyway template

Daz

Hey guys, i have very nearly got my forum looking like my joomla 1.5 site

link: http://www.minidirectory.co.uk/phpBB3

i have nearly got it, but my coding is basic and i can not get the forum to sit just inside, its close but not there, can anybody point me in the right direction


Cheers

Daz
Last edited by precious on Sat Mar 01, 2008 4:36 pm, edited 3 times in total.
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by precious »

Hey guys

Right after playing (please pay no attention to above now)

I have found my problem is in the style sheets, i have got 99% of it done now, i just seem unable to resize the back ground area from behind Board index etc

http://www.minidirectory.co.uk/phpBB3

could someone please point me to the place where these are defined,

Cheers Daz
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by precious »

think i have sorted it now, will let you know how i get on

Daz
frechdaxx
Registered User
Posts: 96
Joined: Tue Apr 10, 2007 1:56 pm
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by frechdaxx »

nice ;) if I use a joomla based forum I definately will use this style until I find a good Joomla template..All free styles till now don't look so good in my opinion...
User avatar
bigbabol
Registered User
Posts: 17
Joined: Wed Aug 01, 2007 7:23 pm
Location: Greece

Re: phpBB3 looking like J1.5 milkway nearly done

Post by bigbabol »

It seems working fine now Daz. Can you please share with us which files have been edited and what?

:roll:
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by precious »

Modifactions to Phpbb3

overall_header.html
common.css

you will also need to duplicate your joomla images and template files and upload them to your phpbb prosilver theme folder

Modifactions to Joomla1.5 none!

I will compile the code updates later on, but above is the files i changed, i am a total noob to J1.5 and PhpBB3 and i only have limited coding skills!

There is only one place where this doesnt work, and thats i can not get the top menu to highlight that you are in the forums area.
statm
Registered User
Posts: 447
Joined: Thu Jul 21, 2005 11:03 am
Location: NC, USA
Name: Matt
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by statm »

It looks like all you need to do to fix your problem with the word Forum not being highlighted in the nav is that you didnt switch the active_menu-nav id from the Home link to the forum link in the head of overall-header.html.
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by precious »

statm wrote:It looks like all you need to do to fix your problem with the word Forum not being highlighted in the nav is that you didnt switch the active_menu-nav id from the Home link to the forum link in the head of overall-header.html.
Cheers, found my mistake and changed it, now all seems to be working!

Working on the write up of changes now, this is the first time i am trying to write up something i have done!
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: phpBB3 looking like J1.5 milkway nearly done

Post by precious »

How to Make phpBB3 (prosilver) stand alone, look like part of joomla 1.5 rhuk_milkyway this will make it look like the site below.

PLEASE MAKE A BACK UP BEFORE CHANGING ANY FILES!

Also remember i am a novice!!!!!

Test site: http://www.minidirectory.co.uk (this is a live site and not just for testing) NO LONGER RUNNING THIS TEMPLATE

Changes Files phpBB3:

/styles/prosilver/template/overall_header.html

find

Code: Select all

<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 -->

</head>

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

<div id="wrap">
	<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 id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
				<h1>{SITENAME}</h1>
				<p>{SITE_DESCRIPTION}</p>
				<p style="display: none;"><a href="#start_here">{L_SKIP}</a></p>
			</div>

		<!-- 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 />
					<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
				</fieldset>
				</form>
			</div>
		<!-- ENDIF -->

			<span class="corners-bottom"><span></span></span></div>
		</div>

		<div class="navbar">
and replace with

Code: Select all

<link href="{T_THEME_PATH}/template.css" rel="stylesheet" type="text/css" />
<link href="{T_THEME_PATH}/blue.css" rel="stylesheet" type="text/css" />
<link href="{T_THEME_PATH}/blue_bg.css" rel="stylesheet" type="text/css" />
<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 -->

</head>

<body id="page_bg" class="color_blue bg_blue width_fmax forum section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">
	<div id="wrapper">
		<div id="wrapper_r">
			<a id="top" name="top" accesskey="t"></a>

			<div id="header">
				<div id="header_l">
					<div id="header_r">
						<div id="logo"><!--<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>--></div>
<table class="contentpaneopen">
	<tr>
		<td valign="top" colspan="2"><p> Add Text Here if you wish </p></td>

	</tr>
</table>

					</div>
				</div>
			</div>

			<div id="tabarea">
				<div id="tabarea_l">
					<div id="tabarea_r">

					  <div id="tabmenu">
						<table cellpadding="0" cellspacing="0" class="pill">
							<tr>
								<td class="pill_l">&nbsp;</td>
								<td class="pill_m">
								<div id="pillmenu">
									<ul id="mainlevel-nav"><li><a href="/index.php/home" class="mainlevel-nav" class="mainlevel-nav" >Home</a></li><li><a href="/phpBB3"  id="active_menu-nav" >Forums</a></li><li><a href="/index.php/calendar/minidirectory%20events%20calendar" class="mainlevel-nav" >Calendar</a></li><li><a href="/index.php/mini-club-list" class="mainlevel-nav" >Mini Club List</a></li><li><a href="/index.php/gallery" class="mainlevel-nav" >Gallery</a></li></ul>

								</div>
								</td>
								<td class="pill_r">&nbsp;</td>
							</tr>
							</table>
						</div>
					</div>
				</div>
			</div>

			<div id="page-header">
				<div class="navbar">
You will need to change the links in the "pillmenu" to yoursite, this is set assuming your forum is in /phpBB3. I have left the other links there as per my site, remove add and replace to fit your own site

In common.css

find

Code: Select all

/* Main blocks
---------------------------------------- */
#wrap {
	padding: 0 20px;
	min-width: 650px;
}

#simple-wrap {
	padding: 6px 10px;
}

#page-body {
	margin: 4px 0;
	clear: both;
}

#page-footer {
	clear: both;
}

#page-footer h3 {
	margin-top: 20px;
}

#logo {
	float: left;
	width: auto;
	padding: 10px 13px 0 10px;
}

a#logo:hover {
	text-decoration: none;
} 
and replace with

Code: Select all

/* Main blocks
---------------------------------------- */
#wrap {
	padding: 0 25px;
	min-width: 650px;
}

#simple-wrap {
	padding: 6px 25px;
}

#page-body {
	margin: 4px 25px;
	clear: both;
}

#page-footer {
	clear: both;
}

#page-footer h3 {
	margin-top: 20px;
}

#logo {
	float: left;
	width: auto;
	padding: 10px 13px 0 10px;
}

a#logo:hover {
	text-decoration: none;
}
and then find

Code: Select all

.navbar {
	background-color: #ebebeb;
	padding: 0 10px;
}
and replace with

Code: Select all

.navbar {
	background-color: #ebebeb;
	padding: 0 10px;
	margin-left: 25px;
	margin-right: 25px;		
}
Find Files in your joomla template folder /templates/rhuk_milkyway/, you need to make a copy of the images and all .css files

Upload all the images to /styles/prosilver/theme/images/
Upload all .css files to /styles/prosilver/theme/

I dont think i have missed anything out

Hope this helps

Daz

edit: if you have problems with not displaying images try putting images in /styles/prosilver/images, my site works as above, however on trying this on fresh install it wants to pull the files from that location, not the ones in the guide. This is my first attempt at a guide, and when i started this i had no idea i would be writing it up.

Daz
Last edited by precious on Sun Jan 04, 2009 5:52 pm, edited 3 times in total.
Granit
Registered User
Posts: 266
Joined: Sun Aug 27, 2006 3:17 pm

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by Granit »

Will this work on other styles to?

I use prosilver for my forum and Gamingplazza for the site.
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by precious »

To come up with the code above, i looked at the source of my joomla front page, used all the code i thought would be required (this took a little bit of trial and error) and added it to overall_header, i then uploaded all the .css files and images from the joomla site to my php theme folder

I got the idea after reading for a solution for my problem, it didnt take me too long to figure it out and i have zero coding skills!

Make a back up and trial and error found me my solution, it took me longest to find where everything was defined in the phpBB3 css files

I can not see why using the above principle can not be used for other templates

Daz
User avatar
Matthew69
Registered User
Posts: 170
Joined: Sat Jul 28, 2007 4:37 pm
Contact:

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by Matthew69 »

Very nice. I am really impressed, you said that you don't have any coding skills, but this proves that you have aleast a little. It looks very professional!
Image
statm
Registered User
Posts: 447
Joined: Thu Jul 21, 2005 11:03 am
Location: NC, USA
Name: Matt
Contact:

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by statm »

I was thinking the same thing.. That is a very nice, professional looking site. Not having any coding skills. All I can say is wow..
User avatar
precious
Registered User
Posts: 29
Joined: Wed Feb 27, 2008 11:54 am
Location: Near Alton Towers UK
Contact:

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by precious »

Yeah i have very very limited coding skills,

I have been playing with Joomla 1x for a 18months now with some good results, The Minidirectory use to been Mambo + SMF.

Came across some hassles when i wanted to add some features so moved to Joomla 1.5 and PhpBB3, the day i asked for some advice was the day i installed both, so i dont think i did too bad having to learn both bits of software and doing some small template mods.

I am going to get a test site set up and play with some different joomla themes and see if i can edit the phpbb3 template to fit inside like i have done with this one.

I think its a good quick fix until a really good bridge comes out, or if you dont want it bridged, just to look like part of your website
User avatar
Matthew69
Registered User
Posts: 170
Joined: Sat Jul 28, 2007 4:37 pm
Contact:

Re: [How To]phpBB3 in Joomla 1.5 rhuk_milkyway

Post by Matthew69 »

I found this: http://extensions.joomla.org/component/ ... Itemid,35/

I don't think its a complete bridge, allows you to have the same users on Joomla as phpBB3 and alot of other forum software.

I don't much like SMF, I used them for a while, and the only thing I really like about it is the theme/package installer.
Image
Locked

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