The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
3 posters
Page 1 of 1
The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Technical Details
Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Mozilla Firefox
Who the problem concerns : All members
When the problem appeared : This week.
Forum link : http://fmthemes.forumotion.com/
Description of problem
When I installed this tutorial: https://help.forumotion.com/t78898-show-hide-widgets-script?highlight=widgets , it causes the toolbar to disappear when you are viewing the topics. The toolbar appears on the homepage and sub-forums. I do have other customized widgets. The tutorial is also causing some of my JavaScript codes that effect posts to not work.Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Bump
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Hmm.. try using the following instead for phpbb3. I wrote it up for the new theme awhile back so it should work better. Just create a new widget with the following settings.
Use a table type : No
Widget Source :
Then just add this to your stylesheet :
It was originally made for the widgets on the right, so if there are any problems let me know.
Use a table type : No
Widget Source :
- Code:
<script type="text/javascrit">//<![CDATA[
(function() {
// updated widget toggle for phpbb3
window._faWidgets = {
smoothness : '300ms', // transitional smoothness
buttonHide : '<',
buttonShow : '>',
title : 'Toggle widgets column',
state : 1, // display state
// DOM nodes
// tip : change 'right' to 'left' if you're using left widgets
toggler : document.createElement('A'),
column : document.getElementById('left'),
content : document.getElementById('content'),
// toggle the widget column
toggle : function() {
if (_faWidgets.state) {
_faWidgets.state = 0;
my_setcookie('fa_widgets', 'hidden');
_faWidgets.toggler.innerHTML = _faWidgets.buttonShow;
_faWidgets.toggler.className = 'fa_widgets_show';
_faWidgets.column.style.width = 0;
_faWidgets.column.style.marginBottom = '-9999em';
_faWidgets.column.style.visibility = 'hidden';
if (_faWidgets.column.id == 'right') _faWidgets.content.style.marginRight = '0px';
} else {
_faWidgets.state = 1;
my_setcookie('fa_widgets', 'shown');
_faWidgets.toggler.innerHTML = _faWidgets.buttonHide;
_faWidgets.toggler.className = 'fa_widgets_hide';
_faWidgets.column.style.width = _faWidgets.colWidth + 'px';
_faWidgets.column.style.marginBottom = '';
_faWidgets.column.style.visibility = '';
if (_faWidgets.column.id == 'right') _faWidgets.content.style.marginRight = _faWidgets.colWidth + 3 + 'px';
}
return false;
}
};
if (!_faWidgets.column || !_faWidgets.content) return;
// cache widget width
_faWidgets.colWidth = _faWidgets.column.scrollWidth;
// toggler attributes
_faWidgets.toggler.id = 'fa_widget_toggle';
_faWidgets.toggler.innerHTML = _faWidgets.buttonHide;
_faWidgets.toggler.title = _faWidgets.title;
_faWidgets.toggler.href = '#';
_faWidgets.toggler.style.float = _faWidgets.column.id;
_faWidgets.toggler.onclick = _faWidgets.toggle;
// insert toggler into the DOM
_faWidgets.column.parentNode.insertBefore(_faWidgets.toggler, _faWidgets.column);
// toggle widgets if they're hidden in the cookie
if (my_getcookie('fa_widgets') == 'hidden') _faWidgets.toggle();
// apply transitional smoothness to our columns
window.setTimeout(function() {
_faWidgets.column.style.transition = _faWidgets.smoothness;
_faWidgets.content.style.transition = _faWidgets.smoothness;
}, 100); // but wait a bit so the transition doesn't play on cookie hiding
// par ange tuteur
})();
//]]></script>
Then just add this to your stylesheet :
- Code:
#fa_widget_toggle {
color:#FFF;
font-size:12px;
font-weight:bold;
text-align:center;
background:#39C;
border-bottom:2px solid #17A;
border-radius:3px;
display:inline-block;
padding:0 6px;
margin-top:20px;
transition:300ms;
}
#fa_widget_toggle:hover {
background-color:#333;
border-color:#111;
}
#fa_widget_toggle:active, #fa_widget_toggle:focus {
background-color:#8B5;
border-color:#693;
}
It was originally made for the widgets on the right, so if there are any problems let me know.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
I do not see any arrows to press to hide/show the widgets.
Do I add the new widget to the top or bottom?
Do I add the new widget to the top or bottom?
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Adding the widget to the top or bottom shouldn't affect it.SLGray wrote:I do not see any arrows to press to hide/show the widgets.
Do I add the new widget to the top or bottom?
Take Notes- Helper
- Posts : 2337
Reputation : 324
Language : English
Location : Forumountain
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Ok, but I do not see any arrows.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Please send the widget source you have in a widget.
Take Notes- Helper
- Posts : 2337
Reputation : 324
Language : English
Location : Forumountain
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Last edited by SLGray on March 13th 2016, 12:35 am; edited 1 time in total
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
I'm sorry, I made a smaaaaaaaall typo in the widget source. Replace :
by :
- Code:
<script type="text/javascrit">
by :
- Code:
<script type="text/javascript">
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
I still do not see any arrows.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Oh, you changed them to the right now, sorry I didn't notice.
Change the widget source to this then :
Change the widget source to this then :
- Code:
<script type="text/javascrit">//<![CDATA[
(function() {
// updated widget toggle for phpbb3
window._faWidgets = {
smoothness : '300ms', // transitional smoothness
buttonHide : '>',
buttonShow : '<',
title : 'Toggle widgets column',
state : 1, // display state
// DOM nodes
// tip : change 'right' to 'left' if you're using left widgets
toggler : document.createElement('A'),
column : document.getElementById('right'),
content : document.getElementById('content'),
// toggle the widget column
toggle : function() {
if (_faWidgets.state) {
_faWidgets.state = 0;
my_setcookie('fa_widgets', 'hidden');
_faWidgets.toggler.innerHTML = _faWidgets.buttonShow;
_faWidgets.toggler.className = 'fa_widgets_show';
_faWidgets.column.style.width = 0;
_faWidgets.column.style.marginBottom = '-9999em';
_faWidgets.column.style.visibility = 'hidden';
if (_faWidgets.column.id == 'right') _faWidgets.content.style.marginRight = '0px';
} else {
_faWidgets.state = 1;
my_setcookie('fa_widgets', 'shown');
_faWidgets.toggler.innerHTML = _faWidgets.buttonHide;
_faWidgets.toggler.className = 'fa_widgets_hide';
_faWidgets.column.style.width = _faWidgets.colWidth + 'px';
_faWidgets.column.style.marginBottom = '';
_faWidgets.column.style.visibility = '';
if (_faWidgets.column.id == 'right') _faWidgets.content.style.marginRight = _faWidgets.colWidth + 3 + 'px';
}
return false;
}
};
if (!_faWidgets.column || !_faWidgets.content) return;
// cache widget width
_faWidgets.colWidth = _faWidgets.column.scrollWidth;
// toggler attributes
_faWidgets.toggler.id = 'fa_widget_toggle';
_faWidgets.toggler.innerHTML = _faWidgets.buttonHide;
_faWidgets.toggler.title = _faWidgets.title;
_faWidgets.toggler.href = '#';
_faWidgets.toggler.style.float = _faWidgets.column.id;
_faWidgets.toggler.onclick = _faWidgets.toggle;
// insert toggler into the DOM
_faWidgets.column.parentNode.insertBefore(_faWidgets.toggler, _faWidgets.column);
// toggle widgets if they're hidden in the cookie
if (my_getcookie('fa_widgets') == 'hidden') _faWidgets.toggle();
// apply transitional smoothness to our columns
window.setTimeout(function() {
_faWidgets.column.style.transition = _faWidgets.smoothness;
_faWidgets.content.style.transition = _faWidgets.smoothness;
}, 100); // but wait a bit so the transition doesn't play on cookie hiding
// par ange tuteur
})();
//]]></script>
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
The code works when you correct the spelling.
One issue I notice is that the arrow cover the mark all forums read link when hiding the widgets.
One issue I notice is that the arrow cover the mark all forums read link when hiding the widgets.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Oooh I see it. Find this part in the CSS :
and change it to a negative value :
- Code:
margin-top:20px;
and change it to a negative value :
- Code:
margin-top:-20px;
Re: The Hide/Show Widgets Tutorial Is Causing Issues With The Toolbar
Perfect!
Topic solved and archived
Topic solved and archived
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Similar topics
» How to hide widgets in topic ?
» Show/Hide Widgets Script
» Show/Hide Widgets Script at both sides
» Hope a code for auto hide login, signup form and show the logout form for DIY toolbar
» Widgets show only on homepage
» Show/Hide Widgets Script
» Show/Hide Widgets Script at both sides
» Hope a code for auto hide login, signup form and show the logout form for DIY toolbar
» Widgets show only on homepage
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum