Who is online?
In total there is 1 user online :: 0 Registered, 0 Hidden and 1 Guest None
Most users ever online was 246 on Tue 31 Jan - 2:47
Statistics
We have 150 registered usersThe newest registered user is Luxic
Our users have posted a total of 2050 messages in 200 subjects
Latest topics
» A small shareby Flora Today at 21:03
» Edit the 404 page on Forumotion
by LGforum Today at 15:29
» How to Change The Homepage?
by LGforum Today at 15:28
» Counter for my notices box
by Niko Today at 15:03
» 21. Show Recent Topics Preview In Accordion
by ReBoRN Yesterday at 19:08
16. Single Widget Toggle
Page 1 of 1 • Share •
16. Single Widget Toggle
by LGforum on Fri 13 Jan - 1:49
16. Widget Toggle
(PHPBB3 and PunBB)
Category toggler in post 11: http://www.avacweb.com/t117-16-single-widget-toggle#2209
This script will add a little Minus symbol to your widgets which when clicked will hide the contents of that widget. (and the '-' will change to a '+')
So your users can hide the widgets that they don't like or don't use often.
It will also set a cookie, to hide the correct widgets on each page load.
To install visit Javascript Management, and create a new javascript for all pages.
Paste the correct code for your version into the box. You'll also need to change where it says '#right' to '#left' if you use a left sidebar.
PHPBB3 boards:
PunBB Boards:
The script works by looping through the widgets, and adding a unique id to them. The first widget will be 'widget1' and so on.
When it is looping through them, it checks if that widgets unique ID is in the cookie, if it is then it hides the content of that widget. If it isn't then obviously it does nothing.
When hiding a widget, the cookie is manipulated, to add the correct ID to it. Similarly, when showing a cookie again, the cookie is manipulated to remove the id of that widget, so it isn't hidden on page load. I must admit, this is one of the few scripts I have written and found it harder to on phpbb3...but i still love it.
I did this tutorial because a member asked me for it. But I hope more of you can get use out of it.
(PHPBB3 and PunBB)
Category toggler in post 11: http://www.avacweb.com/t117-16-single-widget-toggle#2209
This script will add a little Minus symbol to your widgets which when clicked will hide the contents of that widget. (and the '-' will change to a '+')
So your users can hide the widgets that they don't like or don't use often.
It will also set a cookie, to hide the correct widgets on each page load.
To install visit Javascript Management, and create a new javascript for all pages.
Paste the correct code for your version into the box. You'll also need to change where it says '#right' to '#left' if you use a left sidebar.
PHPBB3 boards:
- Code:
var CopyrightNotice='Individual Widget Toggle script for Forumotion Boards by LGforum. Copyright © by AvacWeb. All Rights Reserved. Use and modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
var m=$('#right .module'), cookie=my_getcookie('widgets');
for (i=0;i<m.length;i++) {
tog="-", idstr='widget'+String(i+1), m[i].id=idstr;
if (cookie) { if (cookie.indexOf(idstr+',')!=-1) { m[i].lastChild.style.display="none"; tog="+"; } }
var x=m[i].firstChild.firstChild.nextSibling;
x.innerHTML+="<span style='float:right' onclick='toggleWid(this)'>"+tog+"</span>";
$(m[i]).prepend(x);
$(m[i]).prepend( $(m[i]).find('.corners-top') );
}
});
function toggleWid(w) {
var head=w.parentNode, id=head.parentNode.id;
var tog=w.innerHTML;
if (tog=='-') { head.nextSibling.style.display="none"; w.innerHTML='+'; }
else if (tog=='+') { head.nextSibling.style.display="block"; w.innerHTML="-"; }
sortWidgetCookie(id);
}
function sortWidgetCookie(id) {
var cookie=my_getcookie('widgets');
if (cookie) {
if (cookie.indexOf(id)!=-1) {
cookie=cookie.substring(0,cookie.indexOf(id)) + cookie.substring(cookie.indexOf(id)+id.length+1,cookie.length);
} else { cookie=cookie+id+","; }
my_setcookie('widgets',cookie,true);
} else { my_setcookie('widgets',id+",",true); }
}
PunBB Boards:
- Code:
var CopyrightNotice='Individual Widget Toggle script for Forumotion Boards by LGforum. Copyright © by AvacWeb. All Rights Reserved. Use and modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
var m=$('#right .module'), cookie=my_getcookie('widgets');
for (i=0;i<m.length;i++) {
tog="-", idstr='widget'+String(i+1), m[i].id=idstr;
if (cookie) { if (cookie.indexOf(idstr+',')!=-1) { m[i].lastChild.style.display="none"; tog="+"; } }
m[i].firstChild.firstChild.innerHTML+="<span style='float:right' onclick='toggleWid(this)'>"+tog+"</span>";
}
});
function toggleWid(w) {
var head=w.parentNode.parentNode, id=head.parentNode.id;
var tog=w.innerHTML;
if (tog=='-') { head.nextSibling.style.display="none"; w.innerHTML='+'; }
else if (tog=='+') { head.nextSibling.style.display="block"; w.innerHTML="-"; }
sortWidgetCookie(id);
}
function sortWidgetCookie(id) {
var cookie=my_getcookie('widgets');
if (cookie) {
if (cookie.indexOf(id)!=-1) {
cookie=cookie.substring(0,cookie.indexOf(id)) + cookie.substring(cookie.indexOf(id)+id.length+1,cookie.length);
} else { cookie=cookie+id+","; }
my_setcookie('widgets',cookie,true);
} else { my_setcookie('widgets',id+",",true); }
}
The script works by looping through the widgets, and adding a unique id to them. The first widget will be 'widget1' and so on.
When it is looping through them, it checks if that widgets unique ID is in the cookie, if it is then it hides the content of that widget. If it isn't then obviously it does nothing.
When hiding a widget, the cookie is manipulated, to add the correct ID to it. Similarly, when showing a cookie again, the cookie is manipulated to remove the id of that widget, so it isn't hidden on page load. I must admit, this is one of the few scripts I have written and found it harder to on phpbb3...but i still love it.
I did this tutorial because a member asked me for it. But I hope more of you can get use out of it.
Last edited by LGforum on Tue 15 May - 20:38; edited 3 times in total
LGforum- Forum Version: Phpbb3
Posts: 729
Join date: 2011-10-05
Location: UK 
Re: 16. Single Widget Toggle
by Flora on Fri 13 Jan - 2:27
I don't really have a need for something like this, yet. But that's because I don't have many widgets at the moment.
However, I can see a use for this on my forum in the future. Thank you!
However, I can see a use for this on my forum in the future. Thank you!
Flora
Status: If you like gardening, please join my site. Ty. :)
Forum Version: Phpbb3
Posts: 151
Join date: 2011-11-18
Location: USA-
Re: 16. Single Widget Toggle
by YieHong22 on Fri 13 Jan - 2:49
Hi LGforum,
The script won't work on my PunBB board after i install it.
The script won't work on my PunBB board after i install it.
YieHong22- Forum Version: PunBB
Posts: 2
Join date: 2012-01-11 -
Re: 16. Single Widget Toggle
by pidot101 on Fri 13 Jan - 3:23
this was my idea. . . i asked it on FM. . . thanks for creating one. .. but can make codes for phpbb2 ??
please. .
please. .
pidot101- Status: . . .
Posts: 58
Join date: 2011-12-09
Age: 16 -
Re: 16. Single Widget Toggle
by LGforum on Fri 13 Jan - 14:22
pidot101 wrote:this was my idea. . . i asked it on FM. . . thanks for creating one. .. but can make codes for phpbb2 ??
please. .
I know it was, i pretty much made it for you. I thought your board was punBB.
PhpBB2... hmm.. probably not. But i'll consider it.
And what exactly doesn't work about it? You know I wish people would provide more details.
posts just saying 'it doesn't work' will be ignored from now.
LGforum- Forum Version: Phpbb3
Posts: 729
Join date: 2011-10-05
Location: UK -
Urbrohasan- Status: AVACWEB IS AWESOME
Forum Version: PunBB
Posts: 34
Join date: 2011-12-25
Age: 23
Location: Tamil nadu, India -
Re: 16. Single Widget Toggle
by YieHong22 on Fri 13 Jan - 15:18
LGforum wrote:And what exactly doesn't work about it? You know I wish people would provide more details.
posts just saying 'it doesn't work' will be ignored from now.
Hi,
I am apologize for that, i mean,
the script for PunBB won't Function properly after i install it on my forum.
- Code:
var CopyrightNotice='Individual Widget Toggle script for Forumotion Boards by LGforum. Copyright © by AvacWeb. All Rights Reserved. Use and modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
var m=$('#right .module'), cookie=my_getcookie('widgets');
for (i=0;i<m.length;i++) {
tog="-", idstr='widget'+String(i+1), m[i].id=idstr;
if (cookie) { if (cookie.indexOf(idstr+',')!=-1) { m[i].lastChild.style.display="none"; tog="+"; } }
m[i].firstChild.firstChild.innerHTML+="<span style='float:right' onclick='toggleWid(this)'>"+tog+"</span>";
}
});
function toggleWid(w) {
var head=w.parentNode.parentNode, id=head.parentNode.id;
var tog=w.innerHTML;
if (tog=='-') { head.nextSibling.style.display="none"; w.innerHTML='+'; }
else if (tog=='+') { head.nextSibling.style.display="block"; w.innerHTML="-"; }
sortWidgetCookie(id);
}
function sortWidgetCookie(id) {
var cookie=my_getcookie('widgets');
if (cookie) {
if (cookie.indexOf(id)!=-1) {
cookie=cookie.substring(0,cookie.indexOf(id)) + cookie.substring(cookie.indexOf(id)+id.length+1,cookie.length);
} else { cookie=cookie+id+","; }
my_setcookie('widgets',cookie,true);
} else { my_setcookie('widgets',id+",",true); }
}
Is i miss something, i have follow all the step above.
my forum is http://mytpccenter.getgoo.net
also here is the javascript that contain the code: http://mytpccenter.getgoo.net/15137.js
YieHong22- Forum Version: PunBB
Posts: 2
Join date: 2012-01-11 -
Re: 16. Single Widget Toggle
by LGforum on Fri 13 Jan - 18:07
Its because you haven't changed where it says '#right' to '#left'
LGforum- Forum Version: Phpbb3
Posts: 729
Join date: 2011-10-05
Location: UK -
Re: 16. Single Widget Toggle
by pidot101 on Sat 14 Jan - 0:22
LGforum wrote:
I know it was, i pretty much made it for you. I thought your board was punBB.
PhpBB2... hmm.. probably not. But i'll consider it.
And what exactly doesn't work about it? You know I wish people would provide more details.
posts just saying 'it doesn't work' will be ignored from now.
yeah. . i know you also don't like phpbb2
but i'll just wait if you'll have the codes for it. .
pidot101- Status: . . .
Posts: 58
Join date: 2011-12-09
Age: 16 -
Re: 16. Single Widget Toggle
by Demonic on Mon 23 Apr - 22:43
Is there one that works for Invision? I've tried messing around with it, but no success yet. 
Demonic- Forum Version: Invision
Posts: 1
Join date: 2012-04-23
Age: 18 -
Re: 16. Single Widget Toggle
by LGforum on Tue 15 May - 20:36
Making a Category toggler from this
You know this script can be turned into a decent category toggle script as well, since its basically the same thing. It can work quite effectively and quickly and still only use one more cookie rather than saving a different cookie each time.
Here's the PHPBB3 script edited into a category toggler
Plus a little CSS is needed:
(I must confess I stole the CSS from FMQuery
)
Anyway, this will give phpbb3 users a very nice category toggler.
You know this script can be turned into a decent category toggle script as well, since its basically the same thing. It can work quite effectively and quickly and still only use one more cookie rather than saving a different cookie each time.
Here's the PHPBB3 script edited into a category toggler
- Code:
var CopyrightNotice='Individual Category Toggle script for Forumotion Boards by LGforum. Copyright © by AvacWeb. All Rights Reserved. Use and modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
var c=$('#main li.header'), cookie=my_getcookie('cats');
for (var i=0, l=c.length; i<l; i++) {
var tog='cat_hide', idstr='cat'+i; c[i].id=idstr;
if (cookie) { if (cookie.indexOf(idstr+',')!=-1) { c[i].parentNode.nextSibling.style.display="none"; tog='cat_show'; } }
var x=c[i].getElementsByTagName('dl')[0];
x.innerHTML+='<span onclick="toggleCat(this)" class="'+tog+'"></span>';
}
});
function toggleCat(elem) {
var head = elem.parentNode.parentNode, id=head.id, tog = elem.className;
if (tog=='cat_hide') { head.parentNode.nextSibling.style.display="none"; elem.className = 'cat_show'; }
else if (tog=='cat_show') { head.parentNode.nextSibling.style.display="block"; elem.className = 'cat_hide'; }
sortCatCookie(id);
};
function sortCatCookie(id) {
var cookie=my_getcookie('cats');
if (cookie) {
if (cookie.indexOf(id)!=-1) {
cookie=cookie.substring(0,cookie.indexOf(id)) + cookie.substring(cookie.indexOf(id)+id.length+1,cookie.length);
} else { cookie=cookie+id+","; }
my_setcookie('cats',cookie,true);
} else { my_setcookie('cats',id+",",true); }
};
Plus a little CSS is needed:
- Code:
.cat_hide, .cat_show {
height: 25px;
width: 25px;
display: block;
float: right;
background: url("http://i48.servimg.com/u/f48/17/48/49/15/cat_mi10.png") no-repeat scroll 0 0 transparent;
cursor: pointer;
}
.cat_show {
background: url("http://i48.servimg.com/u/f48/17/48/49/15/cat_ma10.png") no-repeat scroll 0 0 transparent;
}
(I must confess I stole the CSS from FMQuery
)Anyway, this will give phpbb3 users a very nice category toggler.
LGforum- Forum Version: Phpbb3
Posts: 729
Join date: 2011-10-05
Location: UK -
Re: 16. Single Widget Toggle
by Flora on Thu 17 May - 4:57
LGforum wrote:Making a Category toggler from this
You know this script can be turned into a decent category toggle script as well, since its basically the same thing. It can work quite effectively and quickly and still only use one more cookie rather than saving a different cookie each time.
Here's the PHPBB3 script edited into a category toggler
- Code:
var CopyrightNotice='Individual Category Toggle script for Forumotion Boards by LGforum. Copyright © by AvacWeb. All Rights Reserved. Use and modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
var c=$('#main li.header'), cookie=my_getcookie('cats');
for (var i=0, l=c.length; i<l; i++) {
var tog='cat_hide', idstr='cat'+i; c[i].id=idstr;
if (cookie) { if (cookie.indexOf(idstr+',')!=-1) { c[i].parentNode.nextSibling.style.display="none"; tog='cat_show'; } }
var x=c[i].getElementsByTagName('dl')[0];
x.innerHTML+='<span onclick="toggleCat(this)" class="'+tog+'"></span>';
}
});
function toggleCat(elem) {
var head = elem.parentNode.parentNode, id=head.id, tog = elem.className;
if (tog=='cat_hide') { head.parentNode.nextSibling.style.display="none"; elem.className = 'cat_show'; }
else if (tog=='cat_show') { head.parentNode.nextSibling.style.display="block"; elem.className = 'cat_hide'; }
sortCatCookie(id);
};
function sortCatCookie(id) {
var cookie=my_getcookie('cats');
if (cookie) {
if (cookie.indexOf(id)!=-1) {
cookie=cookie.substring(0,cookie.indexOf(id)) + cookie.substring(cookie.indexOf(id)+id.length+1,cookie.length);
} else { cookie=cookie+id+","; }
my_setcookie('cats',cookie,true);
} else { my_setcookie('cats',id+",",true); }
};
Plus a little CSS is needed:
- Code:
.cat_hide, .cat_show {
height: 25px;
width: 25px;
display: block;
float: right;
background: url("http://i48.servimg.com/u/f48/17/48/49/15/cat_mi10.png") no-repeat scroll 0 0 transparent;
cursor: pointer;
}
.cat_show {
background: url("http://i48.servimg.com/u/f48/17/48/49/15/cat_ma10.png") no-repeat scroll 0 0 transparent;
}
(I must confess I stole the CSS from FMQuery
Anyway, this will give phpbb3 users a very nice category toggler.
LOL @ I must confess... You're a trip!
Anyway, I'm sure phpbb3 users will enjoy this. Thanks for sharing. XD
Flora- Status: If you like gardening, please join my site. Ty. :)
Forum Version: Phpbb3
Posts: 151
Join date: 2011-11-18
Location: USA -
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum