Go Back   vb.org Archive > vBulletin Modifications > vBulletin 4.x Modifications > vBulletin 4.x Template Modifications
Reload this Page Forum Home Enhancements - Latest Threads Ticker [jQUery]
FAQ Community Calendar Today's Posts Search

Reply
Page 16 of 23 « First 61415 16 1718 Last »
 
Thread Tools
Latest Threads Ticker [jQUery] Details »»
Latest Threads Ticker [jQUery]
Version: 1.00, by stator stator is offline
Developer Last Online: May 2023 Show Printable Version Email this Page
Category: Forum Home Enhancements - Version: 4.x.x Rating:
Released: 04-29-2011 Last Update: 05-18-2011 Installs: 152
Template Edits
Re-useable Code Additional Files Translations  
No support by the author.

Description:

This display the latest 10 threads in manner resemble news ticker.

Demo: http://www.jquerynewsticker.com/

Installation:

Code:
Be sure that:
"vBulletin Options > vBulletin Options > External Data Provider"

Enable External Javascript = yes
1- Open headinclude template.


2- At the end of the template ADD the following code:

Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
<script src="js/jquery.ticker.js" type="text/javascript"></script>
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script>
<script type="text/javascript">
    $(function () {
        $('#js-news').ticker();
    });
</script>
3- Open additional.css template

4- At the end of the template ADD the following code:
Code:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
/* StatorLatest Threads Ticker  */
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
#ticker-wrapper * {
        margin-left: auto;
        margin-right: auto;

}

#ticker-wrapper.has-js {
    margin: 20px auto 20px auto;
    padding: 0px 20px;
    width: 900px;
    height: 30px;
    display: block;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background-color: #f8f0db;
    font-size: 1.1em;
}
#ticker {
    width: 830px;
    height: 30px;
    display: block;
    position: relative;
    overflow: hidden;
    background-color: #f8f0db;
}
#ticker-title {
    padding: 5px;
    color: #990000;
    font-weight: bold;
    background-color: #f8f0db;
    text-transform: none;
}
#ticker-content {
    margin: 0px;
    padding: 5px;
    position: absolute;
    color: #1F527B;
    font-weight: normal;
    background-color: #f8f0db;
    overflow: hidden;
    white-space: nowrap;
    line-height: 1.2em;

}
#ticker-content:focus {
    none;
}
#ticker-content a {
    text-decoration: none;    
    color: #1F527B;
}
#ticker-content a:hover {
    text-decoration: underline;    
    color: #0D3059;
}
#ticker-swipe {
    padding-top: 9px;
    position: absolute;
    top: 0px;
    background-color: #f8f0db;
    display: block;
    width: 800px;
    height: 23px; 
}
#ticker-swipe span {
    margin-left: 1px;
    background-color: #f8f0db;
    border-bottom: 1px solid #1F527B;
    height: 12px;
    width: 7px;
    display: block;
}
#ticker-controls {
    padding: 8px 0px 0px 0px;
    list-style-type: none;
    float: left;
}
#ticker-controls li {
    padding: 0px;
    margin-left: 5px;
    float: left;
    cursor: pointer;
    height: 16px;
    width: 16px;
    display: block;
}
#ticker-controls li#play-pause {
    background-image: url('../images/controls.png');
    background-position: 32px 16px;
}
#ticker-controls li#play-pause.over {
    background-position: 32px 32px;
}
#ticker-controls li#play-pause.down {
    background-position: 32px 0px;
}
#ticker-controls li#play-pause.paused {
    background-image: url('../images/controls.png');    
    background-position: 48px 16px;
}
#ticker-controls li#play-pause.paused.over {
    background-position: 48px 32px;
}
#ticker-controls li#play-pause.paused.down {
    background-position: 48px 0px;
}
#ticker-controls li#prev {
    background-image: url('../images/controls.png');
    background-position: 0px 16px;        
}
#ticker-controls li#prev.over {
    background-position: 0px 32px;        
}
#ticker-controls li#prev.down {
    background-position: 0px 0px;        
}
#ticker-controls li#next {
    background-image: url('../images/controls.png');    
    background-position: 16px 16px;    
}
#ticker-controls li#next.over {
    background-position: 16px 32px;    
}
#ticker-controls li#next.down {    
    background-position: 16px 0px;    
}
.js-hidden {
    display: none;
}
#no-js-news {
    padding: 10px 0px 0px 45px; 
    color: #F8F0DB;
}
.left #ticker-swipe {
    left: 80px;
}
.left #ticker-controls, .left #ticker-content, .left #ticker-title, .left #ticker {
    float: left;
}
.left #ticker-controls {
    padding-left: 6px;
}
.right #ticker-swipe {
    right: 80px;
}
.right #ticker-controls, .right #ticker-content, .right #ticker-title, .right #ticker {
    float: right;
}
.right #ticker-controls {
    padding-right: 6px;
}
5- Open navbar template

6- At the end of the template ADD the following code:
Code:
<!--ticker-->
<div id="ticker-wrapper" class="no-js">
<ul id="js-news" class="js-hidden">
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script>
    <script type="text/javascript">
<!--
    for (var i = 0; i < threads.length; i++)
    {
        document.write('<li><a href="{vb:raw vboptions.bburl}/showthread.php?t=' + threads[i]['threadid'] + '">' + threads[i]['title'] + '</a>' + '&nbsp;&nbsp;&nbsp;' + '<span style="color: red;">Posted By:</span>'+ '&nbsp;' + threads[i]['poster'] + '</a>' + '</li>');
    }
//-->
</script>
</ul>
</div>
<!--ticker-->
7- Upload the " js " folder to your forum root.

FAQs

1- How to change language of " Latest Threads "?

edit your "jquery.ticker.js" file that you uploaded to js folder

scroll down till the end of the file and edit the following variable:
Code:
// plugin defaults - added as a property on our plugin function
    $.fn.ticker.defaults = {
        speed: 0.10,            
        ajaxFeed: false,
        feedUrl: '',
        feedType: 'xml',
        displayType: 'reveal',
        htmlFeed: true,
        debugMode: true,
        controls: true,
        titleText: 'Latest Threads',    
        direction: 'ltr',    
        pauseOnItems: 3000,
        fadeInSpeed: 600,
        fadeOutSpeed: 300
    };    
})(jQuery);
Language:
Change "latest threads" to language you wish, e.g.

Portuguese = ?ltimos T?picos
German = Aktuelle Themen and so on ....

2- How to change direction of the ticker?

edit your "jquery.ticker.js" file that you uploaded to js folder

scroll down till the end of the file and edit the following variable:

Code:
// plugin defaults - added as a property on our plugin function
    $.fn.ticker.defaults = {
        speed: 0.10,            
        ajaxFeed: false,
        feedUrl: '',
        feedType: 'xml',
        displayType: 'reveal',
        htmlFeed: true,
        debugMode: true,
        controls: true,
        titleText: 'Latest Threads',    
        direction: 'rtl',    
        pauseOnItems: 3000,
        fadeInSpeed: 600,
        fadeOutSpeed: 300
    };    
})(jQuery);
Direction:
left to right = ltr
right to left = rtl



3- How to change language of " Posted by: "?

In the code added to "Navbar" template, change "Posted by"

Code:
<!--ticker-->
<div id="ticker-wrapper" class="no-js">
<ul id="js-news" class="js-hidden">
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script>
    <script type="text/javascript">
<!--
    for (var i = 0; i < threads.length; i++)
    {
        document.write('<li><a href="{vb:raw  vboptions.bburl}/showthread.php?t=' + threads[i]['threadid'] + '">' +  threads[i]['title'] + '</a>' + '&nbsp;&nbsp;&nbsp;' +  '<span style="color: red;">Posted By:</span>'+ '&nbsp;'  + threads[i]['poster'] + '</a>' + '</li>');
    }
//-->
</script>
</ul>
</div>
<!--ticker-->
4- How to include certain forums:

In the code added to "Navbar" template, add the red part"

Code:
<!--ticker-->
 <div id="ticker-wrapper" class="no-js">
 <ul id="js-news" class="js-hidden">
 <script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js&forumids=1,2,3,4,5"></script>
     <script type="text/javascript">
 <!--
     for (var i = 0; i < threads.length; i++)
     {
         document.write('<li><a href="{vb:raw  vboptions.bburl}/showthread.php?t=' + threads[i]['threadid'] + '">' +  threads[i]['title'] + '</a>' + '&nbsp;&nbsp;&nbsp;' +  '<span style="color: red;">Posted By:</span>'+ '&nbsp;'  + threads[i]['poster'] + '</a>' + '</li>');
     }
 //-->
 </script>
 </ul>
 </div>
 <!--ticker-->
5- Is it possible to use the blog feed?

yes, but the available type is "XML"

edit your "jquery.ticker.js" file that you uploaded to js folder

scroll down till the end of the file and edit the following variables:

Code:
    // plugin defaults - added as a property on our plugin function
    $.fn.ticker.defaults = {
        speed: 0.10,            
        ajaxFeed: true,
        feedUrl: 'http://www.YOURSITE.com/RSS.xml',
        feedType: 'xml',
        displayType: 'reveal',
        htmlFeed: false,
        debugMode: true,
        controls: true,
        titleText: 'Latest Blog Feeds',    
        direction: 'ltr',    
        pauseOnItems: 3000,
        fadeInSpeed: 600,
        fadeOutSpeed: 300
    };    
})(jQuery);
If you Like it, don't forget to Mark As Installed

If you really liked it, Don't forget to Rate it

If you really really liked it, Don't forget to Nominate it for MOTM

Download Now

File Type: zip Latest Threads Ticker [jQUery].zip (8.7 KB, 1022 views)

Show Your Support

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

Comments
  #152  
Old 02-12-2012, 08:16 AM
yeppuda yeppuda is offline
 
Join Date: Dec 2010
Posts: 22
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
for 4.x.x:
Code:
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js&forumids=1,2,3,4,5"></script>
     <script type="text/javascript">

True ?

for 3.8.x:
Code:
<script type="text/javascript" src="[vboptions.bburl]/external.php?&type=js&f=1,2,3,4,5"></script>
     <script type="text/javascript">
Coder, help please
Reply With Quote
  #153  
Old 02-14-2012, 12:12 AM
tommydamic68's Avatar
tommydamic68 tommydamic68 is offline
 
Join Date: Jan 2009
Posts: 102
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
For 3.8 users-here is the CSS code. you will have to adjust it to your site. it took me days to get the answer so enjoy it freely and simply! iv'e made the code bold where you will need to adjust it for your site.

Code:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
/* StatorLatest Threads Ticker  */
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

#ticker-wrapper * {
        margin-left: auto;
        margin-right: auto;

}
#ticker-wrapper.has-js {
    margin: 20px auto 20px auto;
    padding: 0px 20px;
    width: 870px;
    height: 30px;
    display: block;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background-color: #f8f0db;
    font-size: 1.1em;
}
 #ticker-wrapper{position:relative}

#ticker {
    width: 830px;
    height: 30px;
    display: block;
    position: relative;
    overflow: hidden;
    background-color: #f8f0db;
}
#ticker-title {
    padding: 5px;
    color: #990000;
    font-weight: bold;
    background-color: #f8f0db;
    text-transform: none;
}
#ticker-content {
    margin: 0px;
    padding: 5px;
    position: absolute;
    color: #1F527B;
    font-weight: normal;
    background-color: #f8f0db;
    overflow: hidden;
    white-space: nowrap;
    line-height: 1.2em;

}
#ticker-content:focus {
    none;
}
#ticker-content a {
    text-decoration: none;    
    color: #1F527B;
}
#ticker-content a:hover {
    text-decoration: underline;    
    color: #0D3059;
}
#ticker-swipe {
    padding-top: 9px;
    position: absolute;
    top: 0px;
    background-color: #f8f0db;
    display: block;
    width: 800px;
    height: 23px; 
}
#ticker-swipe span {
    margin-left: 1px;
    background-color: #f8f0db;
    border-bottom: 1px solid #1F527B;
    height: 12px;
    width: 7px;
    display: block;
}
#ticker-controls {
    list-style-type: none;
    margin: 0;
    padding: 8px 0 0;
    position: absolute;
    right: 30px;
    top:45;
}
#ticker-controls li {
    padding: 0px;
    margin-left: 5px;
    float: left;
    cursor: pointer;
    height: 16px;
    width: 16px;
    display: block;
}
#ticker-controls li#play-pause {
    background-image: url('../images/controls.png');
    background-position: 32px 16px;
}
#ticker-controls li#play-pause.over {
    background-position: 32px 32px;
}
#ticker-controls li#play-pause.down {
    background-position: 32px 0px;
}
#ticker-controls li#play-pause.paused {
    background-image: url('../images/controls.png');    
    background-position: 48px 16px;
}
#ticker-controls li#play-pause.paused.over {
    background-position: 48px 32px;
}
#ticker-controls li#play-pause.paused.down {
    background-position: 48px 0px;
}
#ticker-controls li#prev {
    background-image: url('../images/controls.png');
    background-position: 0px 16px;        
}
#ticker-controls li#prev.over {
    background-position: 0px 32px;        
}
#ticker-controls li#prev.down {
    background-position: 0px 0px;        
}
#ticker-controls li#next {
    background-image: url('../images/controls.png');    
    background-position: 16px 16px;    
}
#ticker-controls li#next.over {
    background-position: 16px 32px;    
}
#ticker-controls li#next.down {    
    background-position: 16px 0px;    
}
.js-hidden {
    display: none;
}
#no-js-news {
    padding: 10px 0px 0px 45px; 
    color: #F8F0DB;
}
.left #ticker-swipe {
    left: 80px;
}
.left #ticker-controls, .left #ticker-content, .left #ticker-title, .left #ticker {
    float: left;
}
.left #ticker-controls {
    padding-left: 6px;
}
.right #ticker-swipe {
    right: 80px;
}
.right #ticker-controls, .right #ticker-content, .right #ticker-title, .right #ticker {
    float: right;
}
.right #ticker-controls {
    padding-right: 6px;
}
Reply With Quote
Благодарность от:
yeppuda
  #154  
Old 02-17-2012, 04:20 PM
abyanhost abyanhost is offline
 
Join Date: May 2011
Posts: 2
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by Merjawy View Post
If the board is using Arabic UTF-8, java won't decode Arabic terms correctly.
It works fine if Windows-1256 is used.
It works fine in my Arabic UTF-8 board "abyanboard" vb Version 4.1.10.

Simply open the file jquery.ticker.js by notepad++ and convert it to UTF-8 without BOM.
Edit "Latest threads" = " آخر المواضيع " , also direction "rtl", as per the instructions in the mod.
save the file and upload it to js directory.

Regards,
Reply With Quote
  #155  
Old 02-20-2012, 12:19 PM
dany_danay dany_danay is offline
 
Join Date: Jul 2009
Posts: 142
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
I want to show certain threads, i try to add:
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js&forumids=14&threadid=31608"></script>
but it show another thread from the same subforum.. any ideas?
Please!!
Reply With Quote
  #156  
Old 03-30-2012, 06:17 AM
CuteC@t CuteC@t is offline
 
Join Date: Feb 2012
Posts: 35
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
How do I turn it off ? Do I have to remove all codes..........plz someone guide me!
Reply With Quote
  #157  
Old 03-31-2012, 06:59 PM
hacker_ hacker_ is offline
 
Join Date: May 2010
Posts: 6
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
for more seo in vBSEO how to edit this?
<!--ticker-->
<div id="ticker-wrapper" class="no-js">
<ul id="js-news" class="js-hidden">
<script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script>
<script type="text/javascript">
<!--
for (var i = 0; i < threads.length; i++)
{
document.write('<li><a href="{vb:raw vboptions.bburl}/showthread.php?t=' + threads[i]['threadid'] + '">' + threads[i]['title'] + '</a>' + '&nbsp;&nbsp;&nbsp;' + '<span style="color: red;">Publicado Por:</span>'+ '&nbsp;' + threads[i]['poster'] + '</a>' + '</li>');
}
//-->
</script>
</ul>
</div>
<!--ticker-->
because the link did not appear as if the vBSEO thus
http://websiteforum/showthread.php?t=11
and the real link for the vBSEO is this
http://websiteforum/f13/la-primera-p...ion-11-post17/
how to fix this code in de navbar?
Reply With Quote
  #158  
Old 04-04-2012, 09:49 PM
egyptsons's Avatar
egyptsons egyptsons is offline
 
Join Date: Jan 2004
Location: Egypt
Posts: 250
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
it works fine
but controls image not appears
see here
http://www.egyptsons.com/misr
Reply With Quote
  #159  
Old 04-04-2012, 10:10 PM
egyptsons's Avatar
egyptsons egyptsons is offline
 
Join Date: Jan 2004
Location: Egypt
Posts: 250
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by egyptsons View Post
it works fine
but controls image not appears
see here
http://www.egyptsons.com/misr
It work fine now after i upload the image to the domain root
Reply With Quote
  #160  
Old 04-06-2012, 08:27 PM
skido's Avatar
skido skido is offline
 
Join Date: Mar 2012
Posts: 16
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Very nice, installed ..works perfect
Feel free to look here to see it running http://unitedextremegamers.net/forum.php

Thanks again!
Reply With Quote
  #161  
Old 04-07-2012, 08:03 AM
CuteC@t CuteC@t is offline
 
Join Date: Feb 2012
Posts: 35
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by egyptsons View Post
It work fine now after i upload the image to the domain root
what is domain root ?
Reply With Quote
Reply
Page 16 of 23 « First 61415 16 1718 Last »

« Previous Thread | Next Thread »

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 05:00 PM.

Contact Us - Archive - Top

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.05461 seconds
  • Memory Usage 2,384KB
  • 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
  • (12)bbcode_code
  • (3)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
  • (4)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (11)post_thanks_box
  • (12)post_thanks_box_bit
  • (11)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (2)post_thanks_postbit
  • (11)post_thanks_postbit_info
  • (10)postbit
  • (1)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
  • fetch_musername
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • post_thanks_function_fetch_thanks_bit_start
  • post_thanks_function_show_thanks_date_start
  • post_thanks_function_show_thanks_date_end
  • post_thanks_function_fetch_thanks_bit_end
  • post_thanks_function_fetch_post_thanks_template_start
  • post_thanks_function_fetch_post_thanks_template_end
  • 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