In SL2, I have added personnal tabs in the player.
For some slides, I want to hide some tabs using the "Player Features" in the "Slide Properties" of these slides. However I can only hide the native tabs Menu, Glossary, Documents, Notes and Seekbar.
No more question, but hope Articulate will take into account this possibility. I have just discovered that equivalent questions were asked 6 years ago...
You can use JavaScript (technically JQuery) to accomplish this.
Find your custom tabs and give them a unique ID. You can do this "At timeline start" on your very 1st slide. All of your custom tabs have the same ID so changing this to a unique ID will give you more control. The following example is for a course with 2 custom tabs. It will update the id's to tab1 and tab2. "tab1" will be the first tab found searching from left to right across the bar. $("#tab-customlink").attr("id", "tab1"); $("#tab-customlink").attr("id", "tab2");
Now that they have a unique ID, you can execute more code whenever you want to hide them or show them. For example, if I wanted to hide the 2nd tab but leave the 1st one visible, I would use the following: $("#tab2").hide();
If I wanted to now show the hidden 2nd tab and hide the first one, I would do the following: $("#tab1").hide(); $("#tab2").show();
This has changed a bit since Articulate no longer uses jquery.
@Math Notermans posted a hack a while ago where he used custom accessibility names to identify elements in SL. Maybe we could give that a try. Do you have an example file?
It looks like these elements are identified as a button group with the ID of "links-right". Every single button has ID of "link-right-0", "link-right-1", "link-right-2" etc. The first tab from right would have the ID of "link-right-0". They can be hidden or shown with Javascript. Example below: https://360.articulate.com/review/content/ad005277-0909-4242-877d-dc16f3909d0b/review
I have tried to implement this trick to hide the MUSIC: DOWN element and the UP element in the top menu bar. The elements appear to be "link-right-0" and "link-right-1".
When I add the code elements to my project and publish, inspect, I do not even see the "Display = "none" parameter shown, so something is slightly different. In Nedim's example course above, I do see the parameter and I see it change when the button is clicked.
I haven't gone through the whole file but I did immediately notice that you have mixed use of single and double quotes in your JavaScript when surrounding some of your code. Be sure that if you open with a single, you close with a single. If you open with a double, you close with a double.
Here is an example from your code: ('#link-right-0") Which should be either ('#link-right-0') or ("#link-right-0")
Be sure you are finding it everywhere. I also noticed some jquery code. StoryLine no longer loads the jquery library. $( ".menu-icon-wrapper" ).click(); <-- this could be breaking everything.
I 'struck out' the jquery and located every instance I could find of the mis-matched quotes. It was on multiple slides and I think I found one on your master as well. Once I updated the quotes and removed the jquery, it appears your script is working.
Ok, this is an old course, so I do need to go looking for that old stuff, too. Thanks for the reminder.
I just checked this technique on last month's safety quiz and it works swimmingly, so this will work for me, I just have to keep digging in this old course until I find what is causing the break.
Thanks for looking at it, I'll keep stripping out the old stuff until it starts behaving.
Hiding custom menu tabs is a great idea for a feature request and others thought so too! A feature request has already been submitted for this. This conversation is being linked to that request, so if it makes it onto our feature roadmap, we’ll make sure to update you!
I too would love it if you could hide and show player tabs like you can with inbuilt player tabs. There seem to be a lot of people requesting this. I have also submitted a feature request. This would be a great addition.
18 Replies
Hi Ricky!
You can hide the built-in tabs (Menu, Notes, etc.) on a slide-by-slide basis, but there isn't a way to hide custom tabs.
Let me know if you have other questions about that!
HI Alyssa,
thanks for your reply.
No more question, but hope Articulate will take into account this possibility. I have just discovered that equivalent questions were asked 6 years ago...
Ricky
Coming up to 2020, would be great to have this feature ...
Hi Sean,
Thanks for reaching out and letting us know that this is a feature you would like to see as well.
I was able to track down a few requests and pulled them together in a report for our team.
I wanted to share some information about how we manage these feature requests as that may be helpful.
This conversation has been included so that any updates we have in the future can be shared with you here.
You can use JavaScript (technically JQuery) to accomplish this.
You can do this "At timeline start" on your very 1st slide. All of your custom tabs have the same ID so changing this to a unique ID will give you more control. The following example is for a course with 2 custom tabs. It will update the id's to tab1 and tab2. "tab1" will be the first tab found searching from left to right across the bar.
$("#tab-customlink").attr("id", "tab1");
$("#tab-customlink").attr("id", "tab2");
$("#tab2").hide();
If I wanted to now show the hidden 2nd tab and hide the first one, I would do the following:
$("#tab1").hide();
$("#tab2").show();
Hey, Owen. How does one locate the ID of a tab and then change it?
I see how to execute JavaScript and then enter the code, but I cannot locate the ID of any tabs.
Thanks.
This has changed a bit since Articulate no longer uses jquery.
@Math Notermans posted a hack a while ago where he used custom accessibility names to identify elements in SL. Maybe we could give that a try. Do you have an example file?
Hi all,
It looks like these elements are identified as a button group with the ID of "links-right". Every single button has ID of "link-right-0", "link-right-1", "link-right-2" etc. The first tab from right would have the ID of "link-right-0". They can be hidden or shown with Javascript. Example below:
https://360.articulate.com/review/content/ad005277-0909-4242-877d-dc16f3909d0b/review
Nedic, Owen,
I have tried to implement this trick to hide the MUSIC: DOWN element and the UP element in the top menu bar. The elements appear to be "link-right-0" and "link-right-1".
When I add the code elements to my project and publish, inspect, I do not even see the "Display = "none" parameter shown, so something is slightly different. In Nedim's example course above, I do see the parameter and I see it change when the button is clicked.
Can anyone spot what is different in my course?
Review: https://360.articulate.com/review/content/ead51396-473f-47d0-bc53-d691f945f9d5/review
I haven't gone through the whole file but I did immediately notice that you have mixed use of single and double quotes in your JavaScript when surrounding some of your code. Be sure that if you open with a single, you close with a single. If you open with a double, you close with a double.
Here is an example from your code: ('#link-right-0")
Which should be either ('#link-right-0') or ("#link-right-0")
Oops! Thanks for that, I did correct the quotes and still no joy. Grrr.
The display parameter still isn't even showing when I inspect the published page.
Be sure you are finding it everywhere. I also noticed some jquery code. StoryLine no longer loads the jquery library.
$( ".menu-icon-wrapper" ).click(); <-- this could be breaking everything.
I 'struck out' the jquery and located every instance I could find of the mis-matched quotes. It was on multiple slides and I think I found one on your master as well. Once I updated the quotes and removed the jquery, it appears your script is working.
Ok, this is an old course, so I do need to go looking for that old stuff, too. Thanks for the reminder.
I just checked this technique on last month's safety quiz and it works swimmingly, so this will work for me, I just have to keep digging in this old course until I find what is causing the break.
Thanks for looking at it, I'll keep stripping out the old stuff until it starts behaving.
I am trying to hide a custom menu tab, but am not having any luck. Is this something Articulate is going support in the future?
Hi Cynthia,
Hiding custom menu tabs is a great idea for a feature request and others thought so too! A feature request has already been submitted for this. This conversation is being linked to that request, so if it makes it onto our feature roadmap, we’ll make sure to update you!
Thanks for reaching out!
+1 to this feature request. I'd love it if hiding/showing a custom player tab was an action available in triggers.
I too would love it if you could hide and show player tabs like you can with inbuilt player tabs. There seem to be a lot of people requesting this. I have also submitted a feature request. This would be a great addition.