• Registered: 2007-04-15
  • Posts: 4

Topic: Where to begin!?

I have read the whole section (http://punbb.org/docs/faq.html#mods) twice and still don't get it. I want:

To have the same menu, footer and logo on the page (www.off-system.se) and the forum (www.off-system.se/forum) but I dont get it, where should I begin? Explain as you should have to a monkey, because I think im on that level when it comes to integration!

  • Smartys
  • Former PunBB Developer
  • Offline
  • Registered: 2004-04-30
  • Posts: 7,844

Re: Where to begin!?

You'll want to edit PunBB's main.tpl file and add the HTML (or PHP, in which case you'll need to use the pun_include tag) for your header/footer in the correct place

  • Registered: 2007-04-15
  • Posts: 4

Re: Where to begin!?

Smartys wrote:

You'll want to edit PunBB's main.tpl file and add the HTML (or PHP, in which case you'll need to use the pun_include tag) for your header/footer in the correct place

I know, I have tried the whole day... I can post the code tomorrow, and maybe someone can tell me whats wrong!

  • Smartys
  • Former PunBB Developer
  • Offline
  • Registered: 2004-04-30
  • Posts: 7,844

Re: Where to begin!?

Sure smile

5 Reply by DarkOne123 (edited by DarkOne123 2007-04-16 07:58)

  • Registered: 2007-04-15
  • Posts: 4

Re: Where to begin!?

Ok, here are the code, hopfully someone can help and show what to include where! wink


Index.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link rel="/favicon.ico" href="favicon.ico" >
      <link rel="icon" href="animated_favicon1.gif" type="image/gif" >
<title>Off-system</title>
<link rel="stylesheet" href="styles.css" type="text/css" />
</head>
<body>
<div id="container">
  <div id="inner">
    <div id="header">
     <img src="/img/logga2.png"><img src="/img/blackstar.pn8g"></left><FONT COLOR="black">     Senaste versionen:</FONT>
 <a href="https://sourceforge.net/project/showfiles.php?group_id=96735"><FONT COLOR="black">0.14.02</FONT></a>
    </div>


 <div id="nav">
      <ul>
        <li><a href="index.html" class="active">Hem</a></li>
        <li><a href="vad.html">Vad är OFF</a></li>
        <li><a href="laddaner.html">Ladda ner</a></li>
        <li><a href="/wiki">Wiki</a></li>
        <li><a href="irc.html">IRC</a></li>
        <li><a href="/forum/index.php">Forum</a></li>
        <li><a href="vi.html">Version information</a></li>
      </ul>
    </div>

    <div id="content">
      <div id="main">
        <h1>Nyheter</h1>

<blockquote><p>Idag har vi skapat den nya sektionen; "Version information". Vi märkte att det blev för mycket nya versioner av OFF hela tiden så vi skapade denna sektionen för att få en "renare" startsida.<br>
Vi har också fixat lite .php grejer, men det är inget som märks för er besökare! 
</p></blockquote>

<br>

<blockquote><p>Vi söker just nu utvecklare som kan hjälpa till att integrera sidan med Forum och Wiki på ett bättre sätt. Någon som vill?<br>
                kontakta oss på; admin@off-system.se</p></blockquote>


<br>
        <blockquote><p>Idag öppnar vi på nytt, <br>
                       med nytt utseende och nya funktioner.<br>
                       Välkommen!</p></blockquote>
        <p> </p>

      </div>
      <div id="sidebar">
         <h1>Använder av OFF</h1>
        <ul>
          <li><a href="http://locol.us/His%20Library.html">Library Of Congress On-Line</a></li>
          <li><a href="http://www.douwd.org/thepublicdomain/Publius.html">Publius</a></li>
          <li><a href="http://radio109.com/Welcome.html">Radio 109</a></li>
        </ul>
        <h1>Off-kodare</h1>
        <ul>
          <li><a href="http://douwd.info/">Digital Douwd</a></li>
          <li><a href="http://www.thebighack.org/">The Big Hack</a></li>
        </ul>
        <p> </p>
        <form action="index.htm" method="get">
          Sök på sidan:<br />
          <input type="text" name="q" />
          <input type="submit" value="Sök" />
        </form>
      </div>
      <div class="clr"></div>
    </div>
    <div id="footer">
      <p>Adrian Larsson 2007. <a href="mailto:admin@off-system.se">Kontakta oss</p>
      
    </div>
  </div>
</div>


</body>
</html>

Here are the css code:

/* Globala */
body {
    background-color:#999999;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:13px;
    margin-top:0;
    margin-bottom:0;
    color:#333;
}
a {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#FF0000;
}
a:hover { 
    text-decoration:none; 
}
p {
    color:#333;
}
blockquote { 
    border:1px solid #DDD;
    background-color:#f2f2f2;
    color:#333;
    padding:12px 5px;
}
code { 
    border:1px solid #DDD;
    background-color:#F2F2F2;
    padding:12px 5px;
    font-family:"Courier New", Courier, monospace;
    font-size:14px;
    margin:0 0 0 8.5%;
    letter-spacing:+1px;
}
/* Huvudlayout (som berör hela sidan) */
div#container {
    margin-left:auto;
    margin-right:auto;
    width:700px;
    background-color:#FFFFFF;
}
/*  */
div#inner {
    padding:0 1px 0 1px;
    background-color:#888;
}
/* Slut på ta bort */

/* Header och nav */
div#header {
    height:62px;
    clear:both;
    background-image:url(img/header_bg.jpg);
    background-repeat:repeat-x;
    padding:0 0 20px 0;
}
div#header h1 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    color:#FFFFFF;
    margin:0;
    float:left;
    font-weight:normal;
    padding:21px 0 0 17px;
}
div#header h2 {
    font-family:Georgia, "Times New Roman", Times, serif;
    color:#FFFFFF;
    margin:0;
    float:left;
    font-size:11px;
    font-weight:normal;
    padding:29px 0px 0px 12px;
}
div#nav {
    background-image:url(img/nav_bg.jpg);
    background-repeat:repeat-x;
    height:25px;
}
div#nav ul {
    list-style-type:none;
    margin:0 0 0 5px;
    padding:0 0 0 5px;
}
div#nav ul li {
    display:inline;
}
div#nav ul li a {
    display:block;
    padding:6px 7px 5px 7px;
    float:left;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-weight:bold;
    color:#FFF;
    text-decoration:none;
    font-size:12px;
}
div#nav ul li a.active:hover {
    background-image:none;
    background-color:#FFF;
}
div#nav ul li a:hover {
    background-image:url(img/nav_bg_over.jpg);
    background-repeat:repeat-x;
}
div#nav ul li a.active {
    background-color:#FFFFFF;
    color:#333;
}

/* Innehåll */
.clr { clear:both; }
div#content {
    background-color:#fff;
    background-image:url(img/content_bg.jpg);
    background-repeat:repeat-y;
}
div#main {
    float:left;
    width:470px;
}
div#main h1 {
    margin:10px 0 0 7px;
    padding:0;
    width:100%;
    text-align:left;
    font-size:25px;
    color:#333;
    border-bottom:1px dotted #333;
    font-weight:normal;
}
div#main h2 { 
    font-size:20px;
    margin:0 0 0 10px;
    font-weight:normal;
}
div#main p {
    font-size:13px;
    color:#333;
    margin:9px 0 8px 9px;
    padding:0;
}
div#main a { 
    font-weight:bold; 
}

/* "Sidebar" */
div#sidebar {
    float:right;
    width:203px;
    padding-top:5px;
}
div#sidebar a { 
    color:#333;
}
div#sidebar a:hover {
    color:#FF3300;
}
div#sidebar h1 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:21px;
    padding-left:5px;
    color:#333333;
    font-weight:normal;
    text-decoration:underline;
}
div#sidebar ul {
    list-style:none;
    border-top:1px solid #E4E4E4;
    margin:0;
    padding:0;
    width:100%;
}
div#sidebar ul li {
    border-bottom:1px solid #E4E4E4;
}
div#sidebar ul li a {
    padding:5px 0 5px 5px;
    font-weight:bold;
    display:block;
}
div#sidebar ul li a:hover {    
    padding"-left:15px;"
    background-color:#DDDDDD;
    color:#FF0000;
}
div#sidebar p {
    padding:5px 0 5px 3px;
    margin:0;
}
div#sidebar form {
    padding:5px;
    margin:0;
}

/* "Foten" */
div#footer {
    border-top:1px solid #333;
    background-color:#666;
    padding:3px 0 3px 0;
}
div#footer p {
    text-align:center;
    width:100%;
    margin:0;
    padding:0;
    font-size:11px;
    color:#FFF;
}
div#footer a {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:11px;
    color:#FFFFFF;
}
div#footer a:hover { 
    text-decoration:none; 
}

And the main.tpl: 

<!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="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<pun_char_encoding>" />
<pun_head>
</head>
<body>

<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>
 <div id="main">
<div id="content">

<pun_footer>


</div>
</div>

</body>
</html>

And as I sad I want the same footer, logo and menu, but I dont know where to begin.  Give me something that makes my head clear! big_smile

BTW: Something wrong whit the logo in InternetExplorer, looks good in FF.

  • Smartys
  • Former PunBB Developer
  • Offline
  • Registered: 2004-04-30
  • Posts: 7,844

Re: Where to begin!?

I'm confused, it looks like you haven't put any of your header/footer in main.tpl hmm

7 Reply by Mark

  • Mark
  • PunBB Donor
  • Offline
  • From: England, North West
  • Registered: 2004-09-21
  • Posts: 834

Re: Where to begin!?

Smartys wrote:

I'm confused, it looks like you haven't put any of your header/footer in main.tpl hmm

its got <div id="main"> in it tongue

Mark's Website

  • Registered: 2007-04-15
  • Posts: 4

Re: Where to begin!?

Smartys wrote:

I'm confused, it looks like you haven't put any of your header/footer in main.tpl hmm

Thats what Im talking about! Where do I link, and how? tongue

9 Reply by Mark

  • Mark
  • PunBB Donor
  • Offline
  • From: England, North West
  • Registered: 2004-09-21
  • Posts: 834

Re: Where to begin!?

you put your page around the part you want in main.tpl

Mark's Website