The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Welcome to the support forum of forumotion hide button?

3 posters

Go down

Solved Welcome to the support forum of forumotion hide button?

Post by Kirbs September 18th 2015, 2:50 am

I was wondering if anyone could tell me how can i add this button http://prntscr.com/8hk9se to be able to hide/open in there.

Thanks in advance!
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Guest September 18th 2015, 2:55 am

You press that button(-), and it should disappear.
avatar
Guest
Guest


Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 18th 2015, 2:57 am

The problem is i don't see it on my forum and i was wondering how could i add it to MY forum, i'm sorry if i wasn't clear enough in my first post.
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Niko September 18th 2015, 6:31 pm

Niko
Niko
Helper
Helper

Male Posts : 3243
Reputation : 252
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 19th 2015, 1:27 am

I did exactly what the tutorial said and still nothing happened .-.
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Niko September 19th 2015, 2:14 pm

@Kirbs are you sure your JS management panel is ON Question
Niko
Niko
Helper
Helper

Male Posts : 3243
Reputation : 252
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 19th 2015, 4:19 pm

I'm positive, I've got many java scripts in there.
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 21st 2015, 12:23 pm

Bump
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 21st 2015, 1:00 pm

Hi @Kirbs,

Place this at the beginning of your homepage message :
Code:
<a id="homepageToggle" href="#">Hide</a>
<div id="homepageBox">

and this at the end :
Code:
</div>
<script type="text/javascript">//<![CDATA[
(function() {
  var toggle = document.getElementById('homepageToggle'),
      box = document.getElementById('homepageBox');

  if (my_getcookie('fa_homepage') == 'hidden') {
    toggle.innerHTML = 'Show';
    box.style.display = 'none';
  }

  // toggle logic
  toggle.onclick = function(e) {
    var box = document.getElementById('homepageBox');

    if (/none/.test(box.style.display)) {
      my_setcookie('fa_homepage', 'shown');
      toggle.innerHTML = 'Hide';
      box.style.display = '';
    } else {
      my_setcookie('fa_homepage', 'hidden');
      toggle.innerHTML = 'Show';
      box.style.display = 'none';
    }

    e.preventDefault();
  };
})();
// par ange tuteur
//]]></script>
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 21st 2015, 2:48 pm

I added it but instead of the images buttons showing up a text that says Show/Hide appears in the middle that hides/shows it. Anyway to add the button images instead? Also its only working on the homepage message, I kinda want it to work on all categories just like this forum.
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 21st 2015, 3:09 pm

If you want images, just replace Show and Hide with an HTML image. Ex :
Code:
<img src="img_source" />

They occur multiple times, so make sure to replace them all. Smile

As for the toggle of categories, ours is separate from the homepage message. Your forum version is phpbb2, correct ?

EDIT :
If it is, these topics might help :
https://help.forumotion.com/t114673-toggle-category-for-phpbb2-forum
https://help.forumotion.com/t127962-hide-show-forum-categories-phpbb2-in-board-index
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 11:02 am

I have multiple codes in the homepage message and the way i'm adding it now, it's hiding everything in the homepage message when clicked, i just want it to hide/show one single thing is that possible?
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 11:15 am

Yes, of course. Remember the ending tag I told you to add ? Remove that, and then place it before what you want hidden, leaving the other contents visible.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 11:26 am

This is the code now:
Code:

<a id="homepageToggle" href="#"><img src="http://2img.net/i/fa/m/tabs_less1.gif" /></a>
<div id="homepageBox">
    
   <center>
                          <strong>    Hello {USERNAME}, what you are currently viewing is our Tournaments and Events table, where you will find each of the tournaments and events currently being held in the academy. Should the even be labeled open, it means there is still time to register for the event and/or that there is no registration deadline. If it’s labeled started it means that registration has already closed for the event has begun. If it’s labeled completed or closed, it means that the event is no longer active for either a winner has been declared or the event has been closed prematurely.All our tournaments and events have prizes involved if you do well, so it is within your best interest to at least attempt to participate. At this point, we would like to thank you again for being a member of our community and we sincerely hope you will enjoy your time with us.  </strong>                   
   </center><strong><br />Best Regards,<br />PDA STAFF  </strong> 
</div>
      <br class="clear" />   
<div id="faInfoNav">
                                 <a id="_recruit" class="infoActif" href="#">Recruitment Tournament <span style="color:

#009900;">[OPEN]</span></a><a id="_BC" href="#">Gemini Gems Event<span style="color:

#009900;">[OPEN]</span></a><a id="_TAG" href="#">Highlander Duel Event <span style="color:

#009900;">[STARTED]</span></a> 
</div>
   
<div id="faInfo">
                                                                  
   <div id="recruit" class="infoBlock">
                                      <span style="font-size: 16px;">  Welcome to the recruitment tournament, {USERNAME}. We created this tournament to help increase our activity in this forum, it will be deeply appreciated if you guys would help us out with that! and in return, we will offer some generous prizes for you guys! you can find this tournament <a href="http://pendulumsduelacademy.forumotion.com/t261-pda-recruitment-tournament"><span style="color: rgb(85, 187, 102);"> HERE </span></a> </span>                                 
   </div>
                                                                  
   <div id="BC" class="infoBlock" style="display:none;">
                                      <span style="font-size: 16px;">  Welcome, {USERNAME}! This is our Gemini Gems Event were each participant is allowed to select one Gemini Monster Card as their Gem Card. Come find out more about this event and how you can sign up for it <a href="http://pendulumsduelacademy.forumotion.com/t587-gemini-gems-event-sign-up#4676"> <span style="color: rgb(85, 187, 102);"> HERE </span> </a> </span>                           
   </div>
                                                                    
   <div id="TAG" class="infoBlock" style="display:none;">
                                      <span style="font-size: 16px;">  Welcome {USERNAME}, to our first Highlander Duel Event! This event is going to be a huge one and at the same time entertaining. Try making a deck with only a single copy of every card in the deck putting it to the test against everyone else. You can stay up to date on the current event here<a href="http://pendulumsduelacademy.forumotion.com/t586-pda-highlander-duel-event-records#4663"> <span style="color: rgb(85, 187, 102);"> HERE </span> </a>    </span>                             
   </div>
                                                              
</div>
      <script type="text/javascript">// <![CDATA[
(function(J) {
  var main = document.getElementById('main-content'), // main container
     
      homepage = J('.introduction', main)[0], // homepage message
     
      // info box
      infoLinks = document.getElementById('faInfoNav').getElementsByTagName('A');

 
  // apply general logic to info box tabs
  for (var i = 0, j = infoLinks.length; i < j; i++) {
    infoLinks[i].onclick = function() {
      var a = document.getElementById('faInfoNav').getElementsByTagName('A'), b = document.getElementById('faInfo').getElementsByTagName('DIV'), i, j;
     
      for (i = 0, j = b.length; i < j; i++) if (/infoBlock/.test(b[i].className)) b[i].style.display = 'none';
      document.getElementById(this.id.slice(1)).style.display = 'block';
     
      for (i = 0, j = a.length; i < j; i++) if (/infoActif/.test(a[i].className)) a[i].className = '';
      this.className = 'infoActif';
     
      return false;
    }
  }
 
  // par ange tuteur
})(jQuery);
//]]></script>  <script type="text/javascript">//<![CDATA[
(function() {
  var toggle = document.getElementById('homepageToggle'),
      box = document.getElementById('homepageBox');

  if (my_getcookie('fa_homepage') == 'hidden') {
    toggle.innerHTML = 'Show';
    box.style.display = 'none';
  }

  // toggle logic
  toggle.onclick = function(e) {
    var box = document.getElementById('homepageBox');

    if (/none/.test(box.style.display)) {
      my_setcookie('fa_homepage', 'shown');
      toggle.innerHTML = <img src="http://2img.net/i/fa/m/tabs_less1.gif" />;
      box.style.display = '';
    } else {
      my_setcookie('fa_homepage', 'hidden');
      toggle.innerHTML = <img src="http://2img.net/i/fa/m/tabs_more1.gif" />;
      box.style.display = 'none';
    }

    e.preventDefault();
  };
})();
// par ange tuteur
//]]></script>

The buttons are showing now but they're not working, when i click the hide button it just scrolls me back to the top of the page and i want that button to be on the right side of the homepage is there a way to fix it?
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 11:38 am

Of course, replace your homepage message with this :
Code:

<a id="homepageToggle" href="#" style="float:right;"><img src="http://2img.net/i/fa/m/tabs_less1.gif" /></a>
<div id="homepageBox">
   
  <center>
                          <strong>    Hello {USERNAME}, what you are currently viewing is our Tournaments and Events table, where you will find each of the tournaments and events currently being held in the academy. Should the even be labeled open, it means there is still time to register for the event and/or that there is no registration deadline. If it’s labeled started it means that registration has already closed for the event has begun. If it’s labeled completed or closed, it means that the event is no longer active for either a winner has been declared or the event has been closed prematurely.All our tournaments and events have prizes involved if you do well, so it is within your best interest to at least attempt to participate. At this point, we would like to thank you again for being a member of our community and we sincerely hope you will enjoy your time with us.  </strong>                   
  </center><strong><br />Best Regards,<br />PDA STAFF  </strong> 
</div>
      <br class="clear" />   
<div id="faInfoNav">
                                <a id="_recruit" class="infoActif" href="#">Recruitment Tournament <span style="color:

#009900;">[OPEN]</span></a><a id="_BC" href="#">Gemini Gems Event<span style="color:

#009900;">[OPEN]</span></a><a id="_TAG" href="#">Highlander Duel Event <span style="color:

#009900;">[STARTED]</span></a> 
</div>
   
<div id="faInfo">
                                                                 
  <div id="recruit" class="infoBlock">
                                      <span style="font-size: 16px;">  Welcome to the recruitment tournament, {USERNAME}. We created this tournament to help increase our activity in this forum, it will be deeply appreciated if you guys would help us out with that! and in return, we will offer some generous prizes for you guys! you can find this tournament <a href="http://pendulumsduelacademy.forumotion.com/t261-pda-recruitment-tournament"><span style="color: rgb(85, 187, 102);"> HERE </span></a> </span>                               
  </div>
                                                                 
  <div id="BC" class="infoBlock" style="display:none;">
                                      <span style="font-size: 16px;">  Welcome, {USERNAME}! This is our Gemini Gems Event were each participant is allowed to select one Gemini Monster Card as their Gem Card. Come find out more about this event and how you can sign up for it <a href="http://pendulumsduelacademy.forumotion.com/t587-gemini-gems-event-sign-up#4676"> <span style="color: rgb(85, 187, 102);"> HERE </span> </a> </span>                           
  </div>
                                                                   
  <div id="TAG" class="infoBlock" style="display:none;">
                                      <span style="font-size: 16px;">  Welcome {USERNAME}, to our first Highlander Duel Event! This event is going to be a huge one and at the same time entertaining. Try making a deck with only a single copy of every card in the deck putting it to the test against everyone else. You can stay up to date on the current event here<a href="http://pendulumsduelacademy.forumotion.com/t586-pda-highlander-duel-event-records#4663"> <span style="color: rgb(85, 187, 102);"> HERE </span> </a>    </span>                             
  </div>
                                                             
</div>
      <script type="text/javascript">// <![CDATA[
(function(J) {
  var main = document.getElementById('main-content'), // main container
     
      homepage = J('.introduction', main)[0], // homepage message
     
      // info box
      infoLinks = document.getElementById('faInfoNav').getElementsByTagName('A');

 
  // apply general logic to info box tabs
  for (var i = 0, j = infoLinks.length; i < j; i++) {
    infoLinks[i].onclick = function() {
      var a = document.getElementById('faInfoNav').getElementsByTagName('A'), b = document.getElementById('faInfo').getElementsByTagName('DIV'), i, j;
     
      for (i = 0, j = b.length; i < j; i++) if (/infoBlock/.test(b[i].className)) b[i].style.display = 'none';
      document.getElementById(this.id.slice(1)).style.display = 'block';
     
      for (i = 0, j = a.length; i < j; i++) if (/infoActif/.test(a[i].className)) a[i].className = '';
      this.className = 'infoActif';
     
      return false;
    }
  }
 
  // par ange tuteur
})(jQuery);
//]]></script>  <script type="text/javascript">//<![CDATA[
(function() {
  var toggle = document.getElementById('homepageToggle'),
      box = document.getElementById('homepageBox');

  if (my_getcookie('fa_homepage') == 'hidden') {
    toggle.innerHTML = '<img src="http://2img.net/i/fa/m/tabs_less1.gif" />';;
    box.style.display = 'none';
  }

  // toggle logic
  toggle.onclick = function(e) {
    var box = document.getElementById('homepageBox');

    if (/none/.test(box.style.display)) {
      my_setcookie('fa_homepage', 'shown');
      toggle.innerHTML = '<img src="http://2img.net/i/fa/m/tabs_less1.gif" />';
      box.style.display = '';
    } else {
      my_setcookie('fa_homepage', 'hidden');
      toggle.innerHTML = '<img src="http://2img.net/i/fa/m/tabs_more1.gif" />';
      box.style.display = 'none';
    }

    e.preventDefault();
  };
})();
// par ange tuteur
//]]></script>
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 11:43 am

Thanks ange it works now Smile just one more thing, is there a way to put a line on top of the homepage message just like this one in the bottom?
http://prntscr.com/8jvve3
Or just simply have it say something like this and it would show up even when hiding the rest like this
http://prntscr.com/8jvvxr
also have the whole thing in a box like that image above?

thanks!
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 12:21 pm

Add this to your CSS :
Code:
#homepageToggle {
  display:block;
  background:#58B469;
  border-radius:3px 3px 0 0;
  text-align:right;
  width:100%;
  padding:2px;
}

It should make the line you want.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 12:24 pm

Thanks ange! i just noticed something went wrong with the codes now for some reason, the toggle works perfectly but when you try to click on one of the tabs in the table it scrolls you up to the top of the page instead :/ you can see it and try it here (you don't need to be signed up) http://pendulumsduelacademy.forumotion.com
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 12:32 pm

Weird everything seemed to be working for me. Shocked
Welcome to the support forum of forumotion hide button? Untitl10
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 12:45 pm

Can you tell me how do you make that image/vid thingy so i can show you what's happening to me?
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 1:10 pm

I use camtasia recorder to record the screen and then select custom production settings to convert it into an animated gif. Anyway, if you're experiencing it and I'm not, my assumptions are that this only occurs while logged in, correct ? Try testing it while logged out.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 1:17 pm

I just tried it with another browser and it worked perfectly so thanks ange Smile but there is a problem happening to my forum i don't know how or why or how to fix it
http://prntscr.com/8jwm0b
http://prntscr.com/8jwm9p
as you can see there are black pieces all over the forum how can i remove/change the color of them?
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 1:39 pm

The wrapper background ?

You can use this CSS to completely remove it :
Code:
.bodyline {
  background:none;
  border:none;
}

or this CSS to make it see through :
Code:
.bodyline {
  background:rgba(0, 0, 0, 0.3);
  border:none;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Kirbs September 24th 2015, 1:49 pm

That'll do it, thanks a lot ange Smile im somehow lagging so i can't see the mark solved button but this is solved.
Kirbs
Kirbs
Forumember

Posts : 628
Reputation : 18
Language : English

Back to top Go down

Solved Re: Welcome to the support forum of forumotion hide button?

Post by Ange Tuteur September 24th 2015, 2:06 pm

You're welcome ^^

Topic archived

Have a great day. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

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