Adding HTML and CSS code to a phpBB3.2.9 board

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 7:16 pm

I have an unmodified 3.2.9 board that's currently working fine. I need to add some HTML and CSS code to the index page. I understand that the code must be added either above or below the existing code in the index_body.html file. But how do I go about activating the code after I upload it, so that it will be used when the index page is opened by a browser. Can someone please provide a step-by-step procedure for accomplishing this?

Thanks for any suggestions. I appreciate your help.

Wayne

PlanetStyles.net · Post by **PlanetStyles.net** » Fri Nov 06, 2020 7:45 pm

Can I ask what code you'll be adding?

The implementation depends on the complexity of the code. THanks

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 8:19 pm

It's fairly complex, and I'm not even sure that it will display correctly without some fine-tuning.

Code: Select all

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
  span.c7 {color: #006699; font-family: Times New Roman; font-size: 144%}
  a.c6 {color: #FF0000; font-size: 80%}
  span.c5 {color: #FF0000; font-size: 80%}
  span.c4 {color: #FF9900; font-family: Times New Roman; font-size: 144%}
  div.c3 {text-align: center}
  a.c2 {color: #006699; font-size: 120%; font-style: italic}
  span.c1 {text-decoration: underline}
  </style>
  <style type="text/css">
  table.c1 {float:center}
  </style>
</head>
<body>
  <table class="c1"></table>
  <table class="center">
    <tbody>
      <tr>
        <td class="bodyline">
          <table width="100%" cellspacing="0" cellpadding="0" border="0">
            <tbody>
              <tr>
                <th width="20%"></th>
                <td>
                  <a href="{U_INDEX}"><img src="styles/prosilver/images/PPeopleLogoColor.gif" border="0" alt="{L_INDEX}" vspace="1" hspace=
                  "3"></a><br>
                  <br>
                  <div class="c3">
                    <a class="c2">You <span class="c1">can</span> get your life back</a>
                  </div>
                </td>
                <th width="100%" valign="middle">
                  <h3><span class="maintitle c4">Microscopic Colitis Discussion and Support Board</span></h3><br>
                  <span class="gen c7"><b>{SITE_DESCRIPTION}</b><br>
                  <br>
                  <a href="http://www.microscopiccolitisfoundation.org/"><img src="styles/prosilver/images/MC_Foundation_Logo_2.gif" border="0"
                  alt="{L_INDEX}" vspace="1"><span class="c5">Visit the Microscopic Colitis Foundation Website</span></a><br>
                  <a class="c6" href="https://www.microscopiccolitisfoundation.org/newsletter.html">Sign up to receive the newsletter by email
                  or view or download copies of past issues.</a></span>
                </th>
                <td></td>
                <th width="20%">
                  <a href="https://www.amazon.com/Microscopic-Colitis-Revised-Wayne-Persky/dp/1732079234"><img src=
                  "styles/prosilver/images/Book%20Cover%20Thumbnail.jpg" alt="Book Cover" border="0" vspace="2" hspace="3"><br>
                  <div class="c3">
                    All the details of microscopic colitis that your doctor never mentioned, explained in layman&#39;s terms.<br>
                    Updated and revised edition.
                  </div></a>
                </th>
              </tr>
            </tbody>
          </table>
        </td>
      </tr>
    </tbody>
  </table>
</body>
</html>

Thanks,

Wayne

janus_zonstraal · Post by **janus_zonstraal** » Fri Nov 06, 2020 8:29 pm

Your code is from a page, you can't insert a page into a page.
What are you trying to do?

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 9:21 pm

Well, that's easy to correct. I'm trying to add a couple of images and a few links in a table. The links will allow users to access my main website, (the Microscopic Colitis Foundation) and reference material.

Wayne

P_I · Post by **P_I** » Fri Nov 06, 2020 9:24 pm

Have you looked at phpBB • Pages - Contribution Details?

janus_zonstraal · Post by **janus_zonstraal** » Fri Nov 06, 2020 9:37 pm

or past the code into the overall_heather.html of your style

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 9:41 pm

Frankly, no, I haven't considered the option of adding a page, but I may have to resort to that if I can't find a way to add what I need to the index page. And I would still have to add a link to that page with a description of it's purpose. If I had a way to add anything to the index page (and activate it), I could edit the code until it displayed properly.

Thanks,

Wayne

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 9:44 pm

Adding the code to the overall_header.html file would add it to every page, wouldn't it? I'd rather only add it to the index page.

Thanks,

Wayne

Gumboots · Post by **Gumboots** » Fri Nov 06, 2020 10:31 pm

The file you'd want in that case would be index_body.html.

The code you pasted is a little messy in spots. For example, float: center; will not work (you can only use left, right or none).

Edited to correct file name.

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 10:45 pm

Interestingly, when I added the "Pages" extension, and activated it, my added code suddenly showed up at the top of the index page (sans images), and it's still displayed if I disable the "Pages extension". Apparently, all it needed was some way to activate it. Now I can get on with fine-tuning the added code, to see if I can get it to display the images.

Thanks,

Wayne

OlderButNotWiser · Post by **OlderButNotWiser** » Fri Nov 06, 2020 10:54 pm

Gumboots,

Thanks. That's the file I added the code to. Thanks for the tip on the CSS item. You'e right, I don't understand CSS code well enough to be using it, but I'm trying to use it anyway. And part of the problem is that I'm a whole lot dumber since I had a stroke three years ago, but I'm still trying to learn, anyway. Life goes on, and we either learn to play the cards we're dealt in life, or we give up and fold.

Many thanks, I appreciate your help.

Wayne

Gumboots · Post by **Gumboots** » Fri Nov 06, 2020 10:59 pm

Strokes are definitely not fun.
If you want to centre a table, use margin: 0 auto; or if you want the text inside it to be centered, use td {text-align: center;}

Lumpy Burgertushie · Post by **Lumpy Burgertushie** » Sat Nov 07, 2020 12:13 am

also, you do not need to use the

Code: Select all

 <!DOCTYPE html>
<html>
<head>
<title></title></head>
<body>

or the

Code: Select all

</body>
</html>

parts since those are already in the overall_header.html file for your style.

rob ert

OlderButNotWiser · Post by **OlderButNotWiser** » Sat Nov 07, 2020 12:19 am

Thanks. I'll use that to edit my code.

Yep, strokes suck, but it could always be worse — it could have been fatal, so I consider myself lucky.

Thanks for the tip.

Wayne

advertisements