1

Topic: Step By Step - How to Embed a forum into your VLD Website

Ok, after much trial and error.... I found a solution that will work for everyone...

This is pretty slick because it allows you to hide the fact you are using <iframes> thanks to a little java code..

I am still using frames on my website, but I have taken away the borders and added transparency, and the code that triggers the onload resize javascript:

Give it a shot and let me know if you like it...


1.) First, view your start page and then right click and select "view source".

2.) Save this as forum.tpl

3.) Open the file up your editor (I use Notepad++). You can use notepad too, but that doesn't give your line numbers, etc.

4.) Remove all of the code starting with <div id="content_wrap">.......and stopping just before the.....<div id="footer_wrap">

5.) Replace it with the  following (taking note of what forum folder path you have phpbb2/3, vBulletin, Vanilla..etc..  located on your server):

<iframe width="100%" id="iframe_id" name="iframe_name" src="http://www.mysite.com/forum/" scrolling="no" frameborder="0" ALLOWTRANSPARENCY="true" onload=resize_iframe();></iframe>


I have also included an iframe resize javascript code, that is controlled by the child window.

<script type="text/javascript">
<!--

moz=document.getElementById&&!document.all
mozHeightOffset=20

function resize_iframe(){
document.getElementById("iframe_id").height="" // required for Moz bug, value can be "", null, or integer
document.getElementById('iframe_id').height=window.frames["iframe_name"].document.body.scrollHeight+(moz?mozHeightOffset:0)
}

// -->
</script>


6.) Now upload the forum.tpl to your server into the template folder that you are using (in my case it is dark_yellowish).

7.) Now go into your CP, Content, Manage pages, General, and then "Add page".

8.) Give it a NAME, LABEL, and Custom Template name as: forum (without the .tpl). Don't fill anything in the Page editor box. Now save it!

I have also inserted a link to this page on my header.tpl after:

<div id="headernav">

with the following:

                    <!-- IF loggedin == "1" -->
                    <li><a href="{virtual_path}{ifelse:fancy_urls,"1","p/forum/index.html","index.php?m=pages&p=forum"}" title="forum">Forum</a></li>
                    <!-- ENDIF -->




What a headache this was, but very gratifying working it through....  Thanks to everyone who posted how-to's on this topic...

Hope it helps you all...

2

Re: Step By Step - How to Embed a forum into your VLD Website

I placed it near the bottom:

Here is some code to show you (forum.tpl):

        <div id="footer_wrap">
            <div id="footer">
                                    <a href="http://www.mysite.com/invitefriends/" title="Invite friends"  >Invite friends</a> |
                                                    <a href="http://www.mysite.com/contactus/" title="Contact us"  >Contact us</a> |
                                <a href="http://www.mysite.com/page/tos/" title="Terms of service"  >Terms of service</a>                <!-- CREDIT LINE: UNAUTHORIZED REMOVAL WILL VOID LICENSE -->
                            </div>
        </div>
        <div class="clear"></div>

        <script type="text/javascript">
<!--

moz=document.getElementById&&!document.all
mozHeightOffset=20

function resize_iframe(){
document.getElementById("iframe_id").height="" // required for Moz bug, value can be "", null, or integer
document.getElementById('iframe_id').height=window.frames["iframe_name"].document.body.scrollHeight+(moz?mozHeightOffset:0)
}

// -->
</script>
    </div>
</div>
<div class="clear"></div>
<script type="text/javascript">var virpath = "http://www.mysite.com/";</script>
</body>
</html>


Hope that helps...  Let me know if you like it...

Last edited by wclang (2009-03-09 10:56:48)

3

Re: Step By Step - How to Embed a forum into your VLD Website

From the image it seems it loads your forum header and footer but its not loading the forum & categories? Is that correct?

What msg board are you using? How customized are your forums? Did you make any major changes to the forum code?


Remove the Java Resize Code... Does your forums showup?

4

Re: Step By Step - How to Embed a forum into your VLD Website

This is what I did:

I created a custom page as above. Then I created forum.tpl and added the following:

<!-- INCLUDE forumheader.tpl --> (forumheader is a copy of header.tpl but I removed sidebar)

here I just add the iframe as above


<!-- INCLUDE footer.tpl -->

Works perfectly only one problemos - I have set scrolling to 'auto' and width to '100%' but I still see that ugly scrollbar :S

"The hardest thing in the world to understand is the income tax."

5

Re: Step By Step - How to Embed a forum into your VLD Website

Thats why if you turn off scrolling and enable the java script code. The forum will automatically resize itself so there isn't a need for the scroll bar. Also, make sure you have the ALLOWTRANSPARENCY="true" inserted into your code....

6

Re: Step By Step - How to Embed a forum into your VLD Website

This is a great mod wclang,but I have 1 problem. If you click on a member's link to view their VLD profile. It
doubles the page. 2 main menu bars and 2 members menus. Doubled the frame. How can I fix this?

"Never be afraid to try something new. Amateurs built the Ark,Professionals built the Titantic."

7

Re: Step By Step - How to Embed a forum into your VLD Website

I can't get the resize code to work on Firefox.  In IE the height auto adjusts perfectly but in Firefox it doesn't do anything.  Can someone please throw in a suggestion.  I would be very greatful.

8

Re: Step By Step - How to Embed a forum into your VLD Website

Since nobody has replied maybe I need to be a little more clear for what I am asking.

I went ahead and installed punbb 1.3.4 (I guess this is the latest version)

I managed to get everything to work just fine except for one thing.

In Firefox browser I can't get it to auto resize the height.

In Internet Explorer It auto resizes just fine.

I used the Java Resize Code that wclang supplied but it doesn't work for Firefox.

If anybody out there in the Vld forums has a solution and wouldn't mind given me a hand solving this problem I would be very greatful.

Thanks guys!  smile

9

Re: Step By Step - How to Embed a forum into your VLD Website

question, what is the start page?

10

Re: Step By Step - How to Embed a forum into your VLD Website

and the startpage is ... the first page then you get to your site ...in this case header.tpl ...

... I try to get it work with bluenet templates ... but it will not work ...

ramil helpt me and now it work like a charm ... thanks ramil ...

the solution is = in header.tpl the link to the forum must be /page/forum/

I have /forum/ and it don´t work ... "stupid me" smile

maybee this can help someone else here ... I hope so ...

Last edited by gugu (2010-01-27 12:28:41)

11

Re: Step By Step - How to Embed a forum into your VLD Website

May I advise you not use iframe. Custom the forum template as your site template and all will be fine.

Content from iframs is not indexed by searche engines so ... take a look on my 2 sites in Forums to see what i mean. Good work.

12

Re: Step By Step - How to Embed a forum into your VLD Website

It takes some effort to get the forum to look like it's part of your system.

I agree with Robest, and advise against the use of an iFrame.

Go to any member's site, have a look at their layout, then go to their forum.
Those who have spent the time and effort to integrate the look and feel of their forum will certainly stand out from those who don't, whose forum looks like it is, an add-on that they haven't spent much time on.

Can you not see and feel the difference between those who put in the effort and those who don't?

Alas I have no forum active, to show you the effort I went to, to make it look like part of the system, with no loss of continuity. I was using phpBB v2 as the forum was hacked into, and I am still working on something better.

Anyhow, decide which group you want to be in.

13

Re: Step By Step - How to Embed a forum into your VLD Website

I hope someone will make a tutorial how to do this without iframe !

14

Re: Step By Step - How to Embed a forum into your VLD Website

this was useful, but only because the content that will go into the forum is not really for the search engine. Here are some pros and cons as I see it.


1. change the design of the header and footer (top and bottom part) of the forum just like the rest of the site.
    Pro: Search engine friendly for the content inside the forum. (only if the content is publicly viewable.)
    Con: ads other elements in the forum is not controlled from the main platform. There will be separate management for the ads in the forum. Changing of any design elements will have to be done in 2 different places.

2. placing the forum content into the main platform as "iframe"
    Pro: Design/ads are better controlled from the main platform; therefore, the website looks better integrated together.
    Con: not as search engine friendly for the contents inside the forum.

15

Re: Step By Step - How to Embed a forum into your VLD Website

you had right about it ... but sometimes not so easy to do ...
I know someone make it for punbb but none for phpbb3 ...
and if someone knows how to do ... please tell us wink

16

Re: Step By Step - How to Embed a forum into your VLD Website

perfect!!! thank you wclang :-)

17

Re: Step By Step - How to Embed a forum into your VLD Website

Is anyone still using this?  I gave it a shot but could not get it to work.

18

Re: Step By Step - How to Embed a forum into your VLD Website

I use it every time I integrate it for a client or for myself ...

19

Re: Step By Step - How to Embed a forum into your VLD Website

I followed the directions in this thread but it didn't work so what I did was I made a new document called forum/tpl and then I copy and pasted the contents of header.tpl into it and then inserted 

<iframe width="100%" id="iframe_id" name="iframe_name" src="http://www.mysite.com/forum/" scrolling="no" frameborder="0" ALLOWTRANSPARENCY="true" onload=resize_iframe();></iframe>

Right after that I copy and pasted the contents of footer.tpl into it and then at the bottom put in

<!--

moz=document.getElementById&&!document.all
mozHeightOffset=20

function resize_iframe(){
document.getElementById("iframe_id").height="" // required for Moz bug, value can be "", null, or integer
document.getElementById('iframe_id').height=window.frames["iframe_name"].document.body.scrollHeight+(moz?mozHeightOffset:0)
}

// -->

At first this seems to have worked extremely well but then the problem I encountered was the bottom of the forum gets cut off and on some pages worse than others.  What can I do to make the entire forum show?

thanks a bunch

20

Re: Step By Step - How to Embed a forum into your VLD Website

I can help you if you tell me your webpage adress ...

21

Re: Step By Step - How to Embed a forum into your VLD Website

Thanks gugu.  Could you take a look at this thread

http://www.vldpersonals.com/forum/topic … -for-gugu/

I didn't want to post my url in a public area.

22

Re: Step By Step - How to Embed a forum into your VLD Website

I think it is a iframe issue ... (javascript issue)
I  try different solution for it in one week. ( but I give up)

none out there had a solution for it so I change to another templates
and now it´s working great with all web browsers again.

and my client/customer was happy for it ...
so css and/or js conflict(s) is a headache sometimes ...

Last edited by gugu (2012-10-03 09:13:57)

23

Re: Step By Step - How to Embed a forum into your VLD Website

Thanks for your help gugu.  I talked to someone over at phpbb and they basically told me that iframe is bad because as the forum grows outside the size of the iframe it will just be cut off.  So I guess its back to doing it the other way, the only problem is getting the css just right seems impossible.

24

Re: Step By Step - How to Embed a forum into your VLD Website

Can I download and use tinymce or ckeditor for this?  Phpbb3's css is so deep. The forum has just been such an incredible roadblock for me.

25

Re: Step By Step - How to Embed a forum into your VLD Website

it is no problems using phpbb3 with iframe ...
but some templates are not working so great ...
so you must try different to see how the looks on your site ...

I will make a tutorial soon on vldmods how to do it ...
and you know facebook using iframe too ...
so it is not the wrong way using iframe ...

you can using tinymce on vldpersonals ...
it is a tutorial here on the forum how to do ...