1 Topic by TheJurm (edited by TheJurm 2007-10-21 22:26)

  • Registered: 2007-10-21
  • Posts: 8

Topic: Integrating with my layout? [Solved, Thanks :))

My layout is at http://simplycoding.net/
How would I integrate my layout to PunBB?

  • Utchin
  • PunBB senior member
  • Offline
  • Registered: 2007-02-09
  • Posts: 760

Re: Integrating with my layout? [Solved, Thanks :))

in your html file, prob index.html, remove the content, where you want the forum part to go.

Open up punbb > includes > template > main.tpl

now you want <pun_head> in your head and everything in the body, copy that to your content part.

then when you have finished coping everything from main.tpl to your html, copy everything and paste over everything in the main.tpl

Sorry. Unactive due to personal life.
  • Utchin
  • PunBB senior member
  • Offline
  • Registered: 2007-02-09
  • Posts: 760

Re: Integrating with my layout? [Solved, Thanks :))

just by looking at it, you could do it this way 

<html>
<head>
<title>SimplyCoding :: Index</title>
<link rel="stylesheet" type="text/css" href="css/css.css" />
</head>
<body>
<div align="center">
<table cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" id="header" height="103" valign="middle"><div align="left"><a href="index.html"><img border="0" alt="SimplyCoding" src="images/name.gif" /></a></div><div align="right"><img src="images/slogan.gif" border="0" /></div></td>
</tr>
<tr>
<td colspan="3" id="navigation" style="background-image: url('images/navigation.gif')">
<a href="index.htm">Link 1</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 2</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 3</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
4</a> <font color="#FFFFFF">|</font> <a href="index.htm#">Link 5</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 6</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
7</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 8</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 9</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
10</a></td>
</tr>

PUNBB'S MAIN.TPL ShOULD BE HERE
<td width="15" valign="top" height="325" bgcolor="#FFFFFF">This should be here</td>
</tr>
<tr>

<td colspan="3" id="footer"><center>Layout and Coding is Copyright © 2007-2008 Simply Coding <em>All Rights Reserved</em><br />All submissions are Copyrighted to their respective authors</center></td>
</tr>
</table>
</div>
</body>
</html>
Sorry. Unactive due to personal life.
  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

this is a good starting point

read how to use the main.tpl and standard css template.
download the main.tpl and paste you code around the pun tags...

http://www.almosteffortless.com/2005/09 … and-punbb/

if you need help visit http://punlancer.com
Q

My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website

5 Reply by TheJurm (edited by TheJurm 2007-10-21 14:32)

  • Registered: 2007-10-21
  • Posts: 8

Re: Integrating with my layout? [Solved, Thanks :))

Thanks everyone smile

EDIT: I didn't understand what you quite meant by 'put main.tpl here' in the code, and will it carry over to all parts of the forum?

6 Reply by quaker (edited by quaker 2007-10-21 16:12)

  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

th jurm, we at punlancer can help you if you need anything let us know..

http://punlancer.com
Q

My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website

7 Reply by MattF

  • MattF
  • Senior Member
  • Offline
  • From: South Yorkshire, England
  • Registered: 2007-03-15
  • Posts: 1,956

Re: Integrating with my layout? [Solved, Thanks :))

Any questions can be answered quite well on here too.

MattF's Website

  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

i agree.. im just trying gto get my site going .....

mad props to the dev team and great support of punbb community!!

Q

My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website

  • Registered: 2007-10-21
  • Posts: 8

Re: Integrating with my layout? [Solved, Thanks :))

So exactly what do I do?

10 Reply by Loa (edited by Loa 2007-10-21 21:16)

  • Loa
  • Extension Developer
  • Offline
  • Registered: 2005-05-20
  • Posts: 73

Re: Integrating with my layout? [Solved, Thanks :))

Heya TheJurm!

If you check the forum files you will find something called "main.tpl" in "./include/template".
Poke around in that file alittle and I think you will discover very soon how it works. I put this together very fast.. dont know how the end result will be. But check it and edit as you like.


main.tpl example:

<html>
<head>
<title>SimplyCoding :: Index</title>
<link rel="stylesheet" type="text/css" href="css/css.css" />
</head>
<body>
<div align="center">
<table cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" id="header" height="103" valign="middle"><div align="left"><a href="index.html"><img border="0" alt="SimplyCoding" src="images/name.gif" /></a></div><div align="right"><img src="images/slogan.gif" border="0" /></div></td>
</tr>
<tr>
<td colspan="3" id="navigation" style="background-image: url('images/navigation.gif')">
<a href="index.htm">Link 1</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 2</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 3</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
4</a> <font color="#FFFFFF">|</font> <a href="index.htm#">Link 5</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 6</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
7</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 8</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 9</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
10</a></td>
</tr>
<tr><td colspan="3" id="decoration" width="100%" height="48"></td></tr>
<tr><td width="15%" valign="top" height="325" bgcolor="#FFFFFF">This needs to be here</td>
<td width="70%" valign="top" height="100%" bgcolor="#FFFFFF"><blockquote><div> </div>
<div id="punwrap">
<div id="pun<pun_page>" class="pun">

<div id="brdheader" class="block">
    <div class="box">
        <div id="brdtitle" class="inbox">
            <pun_title>
            <pun_desc>
        </div>
        <pun_navlinks>
        <pun_status>
    </div>
</div>

<pun_announcement>

<pun_main>

<pun_footer>

</div>
</div>
</blockquote></td>
<td width="15" valign="top" height="325" bgcolor="#FFFFFF">This should be here</td>
</tr>
<tr>

<td colspan="3" id="footer"><center>Layout and Coding is Copyright © 2007-2008 Simply Coding <em>All Rights Reserved</em><br />All submissions are Copyrighted to their respective authors</center></td>
</tr>
</table>
</div>
</body>
</html>

11 Reply by quaker

  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

try this one out for size....
name this file as main.tpl but first rename the main.tpl to main1.tpl (backup)

<html>
<head>
<title>SimplyCoding :: Index</title>
<link rel="stylesheet" type="text/css" href="css/css.css" />
<style type="text/css">
#brdtitle { display: none; }
#brdmenu  { padding-top: 0; }
#punwrap { padding: 0; padding-top: 20px; margin: 0px auto; width: auto; }
DIV.box {BORDER-COLOR: #0066B9; }
.pun H2 {BACKGROUND-COLOR: #0066B9; COLOR: #FFF; }
DIV.blockpost H2 {BACKGROUND-COLOR: #0066B9; }
#punwrap * { font-family: Verdana, Arial, Sans-Serif; }
DIV.blockpost DIV.box {BORDER-COLOR: #0066B9; }
.pun { font-size: 11px !important; }
</style>
</head>
<body>
<div align="center">
<table cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" id="header" height="103" valign="middle"><div align="left"><a href="index.html"><img border="0" alt="SimplyCoding" src="images/name.gif" /></a></div><div align="right"><img src="images/slogan.gif" border="0" /></div></td>
</tr>
<tr>
<td colspan="3" id="navigation" style="background-image: url('images/navigation.gif')">
<a href="index.htm">Link 1</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 2</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 3</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
4</a> <font color="#FFFFFF">|</font> <a href="index.htm#">Link 5</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 6</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
7</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 8</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 9</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
10</a></td>
</tr>
<tr><td colspan="3" id="decoration" width="100%" height="48"></td></tr>
<tr><td width="15%" valign="top" height="325" bgcolor="#FFFFFF">This needs to be here</td>
<td width="70%" valign="top" height="100%" bgcolor="#FFFFFF"><blockquote><div> </div>
<div id="punwrap">
<div id="pun<pun_page>" class="pun">

<div id="brdheader" class="block">
    <div class="box">
        <div id="brdtitle" class="inbox">
            <pun_title>
            <pun_desc>
        </div>
        <pun_navlinks>
        <pun_status>
    </div>
</div>

<pun_announcement>

<pun_main>

<pun_footer>

</div>
</div>
</blockquote></td>
<td width="15" valign="top" height="325" bgcolor="#FFFFFF">This should be here</td>
</tr>
<tr>

<td colspan="3" id="footer"><center>Layout and Coding is Copyright © 2007-2008 Simply Coding <em>All Rights Reserved</em><br />All submissions are Copyrighted to their respective authors</center></td>
</tr>
</table>
</div>
</body>
</html>
My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website

  • Registered: 2007-10-21
  • Posts: 8

Re: Integrating with my layout? [Solved, Thanks :))

Thanks you guys, it is all good now smile Appreciate it and thanks again smile

13 Reply by quaker

  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

hey take the <pun_navlinks> and replace it with all the link1 etc. that should put the links in the nav bar.

Q

My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website

14 Reply by quaker

  • quaker
  • quaker
  • Senior Member
  • Offline
  • From: USA
  • Registered: 2006-02-22
  • Posts: 1,783

Re: Integrating with my layout? [Solved, Thanks :))

change 

<td colspan="3" id="navigation" style="background-image: url('images/navigation.gif')">
<a href="index.htm">Link 1</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 2</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 3</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
4</a> <font color="#FFFFFF">|</font> <a href="index.htm#">Link 5</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 6</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
7</a> 

<font color="#FFFFFF">|</font> <a href="index.htm#">Link 8</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 9</a> 
<font color="#FFFFFF">|</font> <a href="index.htm#">Link 
10</a></td>

to


<td colspan="3" id="navigation" style="background-image: url('images/navigation.gif')">
<pun_navlinks> 
</td>


to this!
My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

quaker's Website