The Arcive of Official vBulletin Modifications Site.It is not a VB3 engine, just a parsed copy! |
|
|
|||||||
Latest Threads Ticker [jQUery] Details »»
|
|||||||||||||||||||||||||||
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 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>
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;
}
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>' + ' ' + '<span style="color: red;">Posted By:</span>'+ ' ' + threads[i]['poster'] + '</a>' + '</li>');
}
//-->
</script>
</ul>
</div>
<!--ticker-->
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);
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);
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>' + ' ' + '<span style="color: red;">Posted By:</span>'+ ' ' + threads[i]['poster'] + '</a>' + '</li>');
}
//-->
</script>
</ul>
</div>
<!--ticker-->
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>' + ' ' + '<span style="color: red;">Posted By:</span>'+ ' ' + threads[i]['poster'] + '</a>' + '</li>');
}
//-->
</script>
</ul>
</div>
<!--ticker-->
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
Show Your Support
|
|||||||||||||||||||||||||||
About Developer
Visit Web Site
Template Edits 
No support by the author.
| 11 благодарности(ей) от: | ||
| abouobaide, abyanhost, BlueCheri, Bubble #5, doctorsexy, Donavaz, Manoel J?nior, Mazinger, RichieBoy67, sodasusu, Toorak Times | ||
| Comments |
|
#42
05-10-2011, 04:35 PM
|
||||
|
||||
Quote:
|
|
#43
05-10-2011, 04:37 PM
|
||||
|
||||
|
Quote:
|
|
#44
05-10-2011, 08:28 PM
|
|||
|
|||
|
Found out my problem.
My Page was blank because External Data Provider Was Off: Code:
"vBulletin Options > vBulletin Options > External Data Provider" Enable External Javascript = yes Enable RSS Syndication = yes Enable Podcasting (RSS Enclosure) = yes Enable XML Syndication = yes Cache Lifespan = 30 Maximum External Records = 60
|
|
#45
05-10-2011, 09:04 PM
|
|||
|
|||
|
working great on 4.1.3 thanks
|
|
#49
05-19-2011, 12:25 PM
|
||||
|
||||
|
Hey stator, great mod, my members really like it allot..
Have a question for you. You added the blog code to the mod and I was wondering if it includes it with the new posts or replaces new posts. I would like to have it include the blog but still show new posts as well. Would also like to include the front page in the ticker as well for the members that tend to only go to the forum.. I plan on adding most content to the front page by promoting them from the forum so that those that mainly use just the forum get the same info as well as those that start on the front page. Is there any way to include sections and categories from the cms into the ticker?
|
|
#50
05-19-2011, 05:01 PM
|
||||
|
||||
|
Quote:
One source is allowed your suggestion may be included in next version
|
|
#51
05-21-2011, 11:47 AM
|
|||
|
|||
|
tagged!!! looks another cracking mod this
|
 |
«
Previous Thread
|
Next Thread
»
|
|
All times are GMT. The time now is 11:57 PM.