The Arcive of Official vBulletin Modifications Site.

iFrame BBCode · **Released**: 02-09-2008

I went looking for iFrame BB Coding and came across several, but none really suited my needs or the needs of my members. In addition to this I noticed a common requested add on feature for this code by those who added it to their site, but I have yet to find anyone who filled that request.

This BB Code contains not only a button which allows the viewer to go to the site being displayed, but it also contains a "Back" and "Forward" button so the user can navigate the iFramed site without having to leave your site. This allows the user to decide whether the posted site is worth more of their time or not without forcing them to view it in order to go "back" or "forward".

This is my first attempt at any type of BB Code (I'm new to HTML), so go easy on me. This works for 3.6.8 but I won't be able to offer support for this.

To install this BB Code: AdminCP -> Custom BB Codes -> Add new BB Code

Title: iFrame

Tag: if

Replacement:

HTML Code:

<!-- Start iFrame by Strike-Force.net -->

<table border="0" bgcolor="#89723C" width="100%"> <tr>  

<td> <br> <center> <head>

<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>
 
<input type="button" value="Back" onclick="goBack()">


<script type="text/javascript">
function newDoc()
{
window.location.assign("{param}");
}
</script>

<input type="button" value="Visit Site" onClick="window.open('{param}')" /> 

<script type="text/javascript">
function goforward()
  {
  window.history.forward()
  }
</script>


<input type="button" value="Forward" onclick="history.go(1)"> </head> </center> <br> </td> </tr> </table> 

<iframe src="{param}" width="100%" height="500"> </iframe> 

<!-- End iFrame by Strike-Force.net -->

Example: [if]http://www.google.com[/if]

Description: Places a site within a small framed window in a post.

Use {option}: No

Button Image: (button image is optional, and I don't use one personally)

I have also created a colored border around the buttons which can easily be changed to suit the color scheme of your site. This can be changed by changing the bgcolor value to whatever color you choose on this line:

HTML Code:

<table border="0" bgcolor="#89723C" width="100%"> <tr>

The height and width of the iFrame can be adjusted by changing this line:

HTML Code:

 <iframe src="{param}" width="100%" height="500"> </iframe>

You can check out a live version at this URL: http://www.strike-force.net/showthread.php?t=280

I highly advise that if you use this BB Code that you install: Advanced BBCode Permissions 3.0 to restrict which usergroups can use this BB Code.

I have updated this thread with the updated iFrame code, you can download the old code via the zipped file below.

Strike-Force.ne · #12 06-14-2009, 03:13 PM

Unfortunately I only come by here every couple of months, so I didn't catch it till now.

Strike-Force.ne · #13 06-15-2009, 04:54 PM

I have found that this change in code to allow the iFrame site to open to a new tab or window has caused the forward button to not work in IE8. Here is the fix for this:

Code:

<!-- Start iFrame by Strike-Force.net -->

<table border="0" bgcolor="#89723C" width="100%"> <tr>  

<td> <center> <head>

<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>
</head> 

<body>

<input type="button" value="Back" onclick="goBack()">  </body>

<head>
<script type="text/javascript">
function newDoc()
{
window.location.assign("{param}");
}
</script>
</head>

<body>
<input type="button" value="Visit Site" onClick="window.open('{param}')" /> </body>

<head>
<script type="text/javascript">
function goforward()
  {
  window.history.forward()
  }
</script>
</head>

<body>

<input type="button" value="Forward" onclick="history.go(1)"> </body> </center> </td> </tr> </table> 

<iframe src="{param}" width="100%" height="500"> </iframe> 

<!-- End iFrame by Strike-Force.net -->

If anyone experiences any issues please post up and I will look into it.

Shaheen · #14 06-29-2009, 05:40 AM

i think there is conflict between this hack and html archive hack

Strike-Force.ne · #15 07-06-2009, 01:12 PM

Quote:

Originally Posted by Shaheen

i think there is conflict between this hack and html archive hack

I found the problem, I had some redunant html that was causing the issue. I have tested this with IE8 and it works properly. I will test this for other browsers (IE7, FireFox, Safari, Chrome, Opera) later today to ensure it works for them as well.

Here is the updated code:

Code:

<!-- Start iFrame by Strike-Force.net -->

<table border="0" bgcolor="#89723C" width="100%"> <tr>  

<td> <br> <center> <head>

<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>
 
<input type="button" value="Back" onclick="goBack()">


<script type="text/javascript">
function newDoc()
{
window.location.assign("{param}");
}
</script>

<input type="button" value="Visit Site" onClick="window.open('{param}')" /> 

<script type="text/javascript">
function goforward()
  {
  window.history.forward()
  }
</script>


<input type="button" value="Forward" onclick="history.go(1)"> </head> </center> <br> </td> </tr> </table> 

<iframe src="{param}" width="100%" height="500"> </iframe> 

<!-- End iFrame by Strike-Force.net -->

If you notice any issues please post up with the browser and browser version you are using. You can view this updated version here: http://www.strike-force.net/showthread.php?t=280

Shaheen · #16 07-07-2009, 10:48 AM

Quote:

Originally Posted by Strike-Force.ne

I found the problem, I had some redunant html that was causing the issue. I have tested this with IE8 and it works properly. I will test this for other browsers (IE7, FireFox, Safari, Chrome, Opera) later today to ensure it works for them as well.

Here is the updated code:

Code:

<!-- Start iFrame by Strike-Force.net -->

<table border="0" bgcolor="#89723C" width="100%"> <tr>  

<td> <br> <center> <head>

<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>
 
<input type="button" value="Back" onclick="goBack()">


<script type="text/javascript">
function newDoc()
{
window.location.assign("{param}");
}
</script>

<input type="button" value="Visit Site" onClick="window.open('{param}')" /> 

<script type="text/javascript">
function goforward()
  {
  window.history.forward()
  }
</script>


<input type="button" value="Forward" onclick="history.go(1)"> </head> </center> <br> </td> </tr> </table> 

<iframe src="{param}" width="100%" height="500"> </iframe> 

<!-- End iFrame by Strike-Force.net -->

If you notice any issues please post up with the browser and browser version you are using. You can view this updated version here: http://www.strike-force.net/showthread.php?t=280

Thanks , its fixed

yotsume · #17 07-14-2009, 08:15 PM

Yes fixed in IE8 and works great in Firefox.

BTW I include a button on my editor for this BB code feature. Attached to this post is the icon I use for the button.

BirdOPrey5 · #18 05-17-2010, 08:07 PM

Using the most recent code the back/forward buttons do not work with Google Chrome, it does work with IE8 and Safari. Any idea on Google Chrome compatibility? It's my favorite browser at the moment.

edit- if I go to more then 2 pages it seems to work...

hiker · #19 05-18-2010, 07:30 PM

I'm trying to use this mod to display a flickr photo slideshow, but flickr says it doesn't allow slideshows in iFrame.

Is there any way to mask this iframe code so a flickr slideshow will embed in a post? I've tried creating a custom bbcode just for flickr slideshows but I'm having no luck.

In fact with this code, it starts to display the slideshow for half a second and then the window below appears:

BirdOPrey5 · #20 05-18-2010, 08:55 PM

Quote:

Originally Posted by bogley

I'm trying to use this mod to display a flickr photo slideshow, but flickr says it doesn't allow slideshows in iFrame.

Is there any way to mask this iframe code so a flickr slideshow will embed in a post? I've tried creating a custom bbcode just for flickr slideshows but I'm having no luck.

In fact with this code, it starts to display the slideshow for half a second and then the window below appears:

Hey, have you tried http://flickrslidr.com/ ? They seem to have a way of embedding flickr slideshows into web pages- maybe you can hack that into bbcode?

hiker · #21 05-21-2010, 03:24 AM

Quote:

Originally Posted by BirdOPrey5

Hey, have you tried http://flickrslidr.com/ ? They seem to have a way of embedding flickr slideshows into web pages- maybe you can hack that into bbcode?

It looks like flickrslidr is using iframe as well, although I'm not sure how they're able to get away with it but I'm not. I'm still getting stopped by flickr on the iframe issue.

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.05561 seconds Memory Usage 2,324KB Queries Executed 25 (?)
More Information
Template Usage: (1)SHOWTHREAD (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (1)ad_showthread_beforeqr (3)bbcode_code (3)bbcode_html (4)bbcode_quote (1)footer (1)forumjump (1)forumrules (1)gobutton (1)header (1)headinclude (1)modsystem_post (1)navbar (6)navbar_link (120)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (11)post_thanks_box (11)post_thanks_button (1)post_thanks_javascript (1)post_thanks_navbar_search (11)post_thanks_postbit_info (10)postbit (11)postbit_onlinestatus (11)postbit_wrapper (1)spacer_close (1)spacer_open (1)tagbit_wrapper Phrase Groups Available: global inlinemod postbit posting reputationlevel showthread	Included Files: ./showthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/functions_bigthree.php ./includes/class_postbit.php ./includes/class_bbcode.php ./includes/functions_reputation.php ./includes/functions_post_thanks.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete showthread_start showthread_getinfo forumjump showthread_post_start showthread_query_postids showthread_query bbcode_fetch_tags bbcode_create showthread_postbit_create postbit_factory postbit_display_start post_thanks_function_post_thanks_off_start post_thanks_function_post_thanks_off_end post_thanks_function_fetch_thanks_start post_thanks_function_fetch_thanks_end post_thanks_function_thanked_already_start post_thanks_function_thanked_already_end fetch_musername postbit_imicons bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete postbit_display_complete post_thanks_function_can_thank_this_post_start pagenav_page pagenav_complete tag_fetchbit_complete forumrules navbits navbits_complete showthread_complete
Messages:

The Arcive of Official vBulletin Modifications Site.

It is not a VB3 engine, just a parsed copy!