Show/Hide Widgets Script

Go down

In progress Show/Hide Widgets Script

Post by omarpop23 on March 25th 2016, 4:25 am

This code does'nt work well with me Show/Hide Widgets Script

avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 25th 2016, 4:27 am



When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by Take Notes on March 25th 2016, 4:28 am

Can you please provide a little more information in what you are having issues with?
avatar
Take Notes
Helper
Helper

Male Posts : 2337
Reputation : 324
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 25th 2016, 4:51 am

i don't understand what should i do @SLGray
but this is my problem
please explain more
i cant see arrows
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by Take Notes on March 25th 2016, 4:52 am

What is your forum link?
avatar
Take Notes
Helper
Helper

Male Posts : 2337
Reputation : 324
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 25th 2016, 5:19 am

its worked but its floating left
and widgets hide but content still same width
http://hamor-shabik.arab.st

my Eniglish is very weak sorry
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 25th 2016, 7:40 pm

Create a widget with this code:
Code:
        <script type="text/javascript">//<![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>
Add this to your CSS:
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;
        }


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 25th 2016, 8:01 pm

Doesn't Work :'(

can i give you Admin ID & Password To Help Me ?
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 25th 2016, 10:06 pm

Follow the post below this one.


Last edited by SLGray on March 25th 2016, 10:36 pm; edited 1 time in total


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by Take Notes on March 25th 2016, 10:24 pm

@SLGray try copying all of the code except the very last } as Firefox seems to space things wrong under certain circumstances.

@omarpop23

Create a widget called Toggle widgets column or something, do not use a table and for the widget source put this:
Code:
<script type="text/javascript">//<![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>

Then add this to your CSS:
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;
}
avatar
Take Notes
Helper
Helper

Male Posts : 2337
Reputation : 324
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 26th 2016, 1:21 am

doesn't Work
if you want account of administrator i will send you PM now
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 26th 2016, 3:44 am

You can send it to me, but create a test account.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 26th 2016, 10:40 pm

@SLGray wrote:
Because your forum is in Arabic, it is changing the codes.  You need to translate the codes from English to Arabic.
@Ange Tuteur
what should i do this code dosen't in Arabic Support Fourm
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by Ange Tuteur on March 26th 2016, 10:43 pm

This is just an assumption, but change
Code:
document.getElementById('right')
into
Code:
document.getElementById('left')
. I'll take a closer look later if it's still giving you trouble.
avatar
Ange Tuteur
Forumaster

Male Posts : 13195
Reputation : 2910
Language : EN10, FR5, JA5
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 26th 2016, 10:48 pm

okay , thank you i will change my widget into left side
but try to fix this code and make it works well in Arabic forums because this code dosn't there in Arabic support Forum
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 27th 2016, 12:27 am

The issue is that when you enter the widget code it is being changed to the Arabic language.  In Arabic, you post right to left, but in English we post from left to right.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 27th 2016, 3:15 am

Dosen't work PLEASE Desgin code for Arabic forums @Ange Tuteur
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 27th 2016, 5:16 am

The issue is with this code:
Code:
        <script type="text/javascript">//<![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>
The {}'s, \'s, etc. are being moved to different parts of the code.  The reason why is your forum is in Arabic which is read from right to left.

When I checked the widget code, parts of it was messed up.

For Example The Last Part of the Code was Like This:
Code:
</script>>]]//


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 27th 2016, 5:24 am

did you test it in
http://hamor-shabik.arab.st

dosen't work


Last edited by omarpop23 on March 27th 2016, 5:41 am; edited 1 time in total
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by SLGray on March 27th 2016, 5:31 am

What do you mean by test?  Also you do not have forum widgets on that forum.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43075
Reputation : 3047
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Show/Hide Widgets Script

Post by omarpop23 on March 27th 2016, 5:43 am

sorry i wrote wrong Forum
test it in this Forum
http://hamor-shabik.arab.st
avatar
omarpop23
Forumember

Male Posts : 179
Reputation : 3
Language : Arabic
Location : Egypt

http://devs.ahlamontada.com

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum