Go Back   vb.org Archive > vBulletin Modifications > vBulletin 3.8 Modifications > vBulletin 3.8 Template Modifications
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
UKBL ~ Scrolling Forum News In iFrame Details »»
UKBL ~ Scrolling Forum News In iFrame
Version: 1.00, by UKBusinessLive UKBusinessLive is offline
Developer Last Online: Feb 2012 Show Printable Version Email this Page

Category: Forum Home Enhancements - Version: 3.8.1 Rating:
Released: 02-28-2009 Last Update: Never Installs: 19
Template Edits
Re-useable Code Additional Files Translations  
No support by the author.

UKBL ~ Scrolling Forum News In iFrame


Ever wanted a Customizable Scrolling Box where you could easily add your Forum News Or Links, but didn't want to use Javascript with line after line of code???


LIVE DEMO: http://www.ukbusinesslive.co.uk/forum/scroller.htm
and without the Iframe Border http://www.waltdisneyboards.com/forums.php


Then this is for you, A Small so easy to add script, thats customizable in every way.

I'm dedicating this hack to my friend "Arny" from the Walt Disney Boards, who put the idea into my head when he sent me a hidious Javascript, with about 100 lines of text that did basically the same, So thats for the idea Arny and I hope you enjoy the finished product.

Using a Basic iFrame code, You can add scrolling text, links and clickable pictures and with a small file to add where ever you want to put your new iFrame it couldn't be easier to do. You can adjut the size of the box to go the full width of your boards or to fit in a small corner, it really is adjustable



Ok so heres the Install..

Download the zip file and open up the scroller.txt file in notebook or similar

Code:
<!-- Copy this where you want your Scroller -->

<table cellpadding="2" cellspacing="0" border="0" style="border: #000000 1px solid; background-color: #3BE2F8;COLOR: #1605FC; FONT: 14px arial, sans-serif; font-weight: bold;"><tr><td align="center">
UKBL News<br>
</td></tr><tr><td>
<iframe id="NewsWindow" src="text.htm" width="160" height="210" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" style="border: #000000 1px solid;"></iframe>
</td></tr></table>

<br><br>

<!-- END -->
You will see from the first line of code, how to change the colors, font background Just change the hex values to ones that suit your site (Shown in Red)

Code:
<table cellpadding="2" cellspacing="0" border="0" style="border: #000000 1px solid; background-color: #3BE2F8;COLOR: #1605FC; FONT: 14px arial, sans-serif; font-weight: bold;"><tr><td align="center">
Then find this

Code:
<td align="center">
UKBL News<br>
And change the UKBL News for your own Title

Next we can change the size and height of our box, so first decide what size you want your box to be and change the values in this part of the code

Code:
<iframe id="NewsWindow" src="text.htm" width="160" height="210" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" style="border: #000000 1px solid;"></iframe>
You can also change the border color of your frame here as well as the width

Code:
style="border: #000000 1px solid;
When you've done that, Just save and you've got your file ready for pasting whereever you want your box to go, Simply Ccopy and paste the entire code where ever you want the box to show, In your Header?? Your Footer? On the side its up to you

Now we come to the text.htm file which we need to upload to our forums server, so open the file and we'll see something like this....

Code:
<html><head>

<title>Your Text Title here</title>



<style type="text/css">
<!--
BODY 		{ margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; }


 /* FONT COLORS */


TABLE		{ COLOR: #000000; FONT: 11px arial, sans-serif; font-weight: normal }

.title		{ COLOR: #0033FF; FONT: 12px arial, sans-serif; font-weight: bold; }

#NewsDiv	{ position: absolute; left: 0; top: 0; width: 100% }

 /* PAGE LINK COLORS */

a:link		{ color: #0033FF; text-decoration: underline; }

a:visited	{ color: #6633FF; text-decoration: underline; }

a:active	{ color: #0033FF; text-decoration: underline; }

a:hover		{ color: #6699FF; text-decoration: none; }

-->
</style>



</head>

<BODY BGCOLOR="#F0F0F0" TEXT="#000000" onMouseover="scrollspeed=0" onMouseout="scrollspeed=current" OnLoad="NewsScrollStart();">

<div id="NewsDiv">
<table cellpadding="5" cellspacing="0" border="0" width="100%"><tr><td>






<!-- TEXT SCROLLER CONTENT STARTS HERE, To add more, just cut and paste a block ;-)  -->


<span class="title">
Disney News<br>
</span>
You can list as many News items in this window as you need. Just edit the "text.htm" to change the text shown in this Box. Look at this great link you can add too!! <a href="http://ukbl.co.uk" target="_top">UKBL Hosting</a>

<br><br><br>



<span class="title">
Display Options<br>
</span>
To have the scroller reload at the top for the second time through, change the "frameheight" to "2" and change the "nextdelay" to "1" or "2".

<br><br><br>





<span class="title">
Resizing the Window<br>
</span>
If you change the size of the IFrame window edit the "frameheight" variable in the "text.htm" to match your new window size.

<br><br>

The IFrame size and "frameheight" variable should match so the text re-scrolls from the bottom of this window. <a href="http://www.ukbusinesslive.co.uk/forum" target="_top">My Forum</a>

<br><br><br>

<span class="title">
Remember<br>
</span>
Don't forget to Click Installed if you use this :-)  Thanks.

<br><br><br>



<!-- SCROLLER CONTENT ENDS HERE -->






</td></tr></table>
</div>




<!-- YOU DO NOT NEED TO EDIT BELOW THIS LINE ITS FOR MINOR ADJUSTMENTS -->




<script language="JavaScript" type="text/javascript">
<!-- HIDE CODE

var scrollspeed		= "1"		// SET SCROLLER SPEED 1 = SLOWEST
var speedjump		= "30"		// ADJUST SCROLL JUMPING = RANGE 20 TO 40
var startdelay 		= "2" 		// START SCROLLING DELAY IN SECONDS
var nextdelay		= "0" 		// SECOND SCROLL DELAY IN SECONDS 0 = QUICKEST
var topspace		= "2px"		// TOP SPACING FIRST TIME SCROLLING
var frameheight		= "200px"	// IF YOU RESIZE THE WINDOW EDIT THIS HEIGHT TO MATCH



current = (scrollspeed)


function HeightData(){
AreaHeight=dataobj.offsetHeight
if (AreaHeight==0){
setTimeout("HeightData()",( startdelay * 1000 ))
}
else {
ScrollNewsDiv()
}}

function NewsScrollStart(){
dataobj=document.all? document.all.NewsDiv : document.getElementById("NewsDiv")
dataobj.style.top=topspace
setTimeout("HeightData()",( startdelay * 1000 ))
}

function ScrollNewsDiv(){
dataobj.style.top=parseInt(dataobj.style.top)-(scrollspeed)
if (parseInt(dataobj.style.top)<AreaHeight*(-1)) {
dataobj.style.top=frameheight
setTimeout("ScrollNewsDiv()",( nextdelay * 1000 ))
}
else {
setTimeout("ScrollNewsDiv()",speedjump)
}}



// END HIDE CODE -->
</script>


</body>
</html>
It pretty easy to follow just change the titles, and other bits to suit your site, To add content, you just need to add basic html code and it will show in your box.

To add more content, just cut and paste one of the paragraphs like this

Code:
<span class="title">
Disney News<br>
</span>
You can list as many News items in this window as you need. Just edit the "text.htm" to change the text shown in this Box. Look at this great link you can add too!! <a href="http://ukbl.co.uk" target="_top">UKBL Hosting</a>

<br><br><br>
you can see how to change the title, add the context and even a link You could even add clickable pictures as long at the dimensions fall within the width of the iframe

make a space under each news item using <br><br><br>

Once you've finished adding your content and editing the differnt sections, Save the file and upload it to your forums root directory as text.htm

If you want to change the content on a regular basis all you'll need to do is to edit the text.htm fil and just upload it to your server, remembering to chose over write.

Thats it, so easy and a great addition to any forum



The code is just bog standard HTML so feel free to edit and play around with it

You could even use this for advertising and sponsors The choice is yours, basically its a simple iframe with a scroll feature, so enjoy

Don't forget to click Installed :up:

Download Now

File Type: zip scroller.zip (114.8 KB, 156 views)

Screenshots

File Type: png box1.png (7.1 KB, 0 views)
File Type: png box2.png (7.1 KB, 0 views)
File Type: png box3.png (15.5 KB, 0 views)

Show Your Support

  • This modification may not be copied, reproduced or published elsewhere without author's permission.

Comments
  #32  
Old 03-18-2009, 08:01 AM
CFodder CFodder is offline
 
Join Date: Mar 2008
Posts: 92
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

I've not tried this yet but certainly will do so. What I was wondering if it will scroll right to left ... or vice versa? Would like the news going across the page like a ticker at the top.
Reply With Quote
  #33  
Old 03-18-2009, 05:42 PM
UKBusinessLive UKBusinessLive is offline
 
Join Date: Sep 2008
Location: Essex, United Kingdom
Posts: 1,637
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by CFodder View Post
I've not tried this yet but certainly will do so. What I was wondering if it will scroll right to left ... or vice versa? Would like the news going across the page like a ticker at the top.
This will not do right to left only down and up, You may want to try and use My marquee scroller here https://vborg.vbsupport.ru/showthread.php?t=207241
Reply With Quote
  #34  
Old 04-05-2009, 02:38 PM
DobieGillis? DobieGillis? is offline
 
Join Date: Feb 2009
Posts: 538
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

this is a great addition to my board. Thank you!
Reply With Quote
  #35  
Old 06-11-2009, 08:12 AM
yossie3660's Avatar
yossie3660 yossie3660 is offline
 
Join Date: Feb 2009
Posts: 8
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Can I put some rss feed in the news? so the news is updated as always, i dont have to update everyday manually but changes from rss, can i do dat? thanks alot...this mod is great....or can i put some image and the function will roller over the image? like rolling banner but changes every minutes when they scrolling? And where i put the text.htm? did i know where text.htm must be put in my forum, in what folder? thanks.

regards
yossie3660
Reply With Quote
  #36  
Old 06-14-2009, 09:34 PM
dancue dancue is offline
 
Join Date: Feb 2008
Posts: 569
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Would be nice to have the newest posts scrolling.

Any way to implement that?
Reply With Quote
  #37  
Old 06-15-2009, 08:36 PM
pjaco's Avatar
pjaco pjaco is offline
 
Join Date: Jul 2008
Location: Oslo / Norway
Posts: 35
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks,,Nice
Reply With Quote
  #38  
Old 06-24-2009, 11:48 PM
K4GAP K4GAP is offline
 
Join Date: Mar 2008
Posts: 1,255
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks so much for this! I think it enhanced my site. I placed it in the header for site news. I also used it to link to an MP3 player which saved me from having to add another button to my customized style.

Thanks so much!

Public Warriors
Reply With Quote
  #39  
Old 08-04-2009, 08:11 PM
desi-boy's Avatar
desi-boy desi-boy is offline
 
Join Date: Nov 2008
Location: France
Posts: 98
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

can i use this on a .html page i mean my forum is www.mydomain.com/forum

can i use this code on www.mydomain.com/index.html

thnxxxx
Reply With Quote
  #40  
Old 08-05-2009, 05:03 PM
UKBusinessLive UKBusinessLive is offline
 
Join Date: Sep 2008
Location: Essex, United Kingdom
Posts: 1,637
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by desi-boy View Post
can i use this on a .html page i mean my forum is www.mydomain.com/forum

can i use this code on www.mydomain.com/index.html

thnxxxx
Hi Desi Boy

The majority of my Hacks can be used on a HTML website you don't always need to just use them on VBulletin sites, Try it and see
Reply With Quote
  #41  
Old 08-08-2009, 10:31 AM
yeku yeku is offline
 
Join Date: May 2005
Posts: 134
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Installed and working perfectly

thanks friend
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 11:45 PM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04896 seconds
  • Memory Usage 2,351KB
  • Queries Executed 26 (?)
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
  • (7)bbcode_code
  • (2)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_post
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (3)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
  • (4)postbit_attachment
  • (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_attachment
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete