Hi Debra, I'm afraid you can't swap out the lightbox button or change the colour.
If you really can't use the lightbox with this limitation, you could try using a layer to create your own lightbox effect.
I have done this in some projects because I did not like the position of the lightbox when opened and the fact that you can't change the transparency of the background.
Hi Satish, does your solution work for the flash output as well as the mobile? I have not read through your entire blog post so maybe the answer is there.
@Wendy and Phil - that's what I thought. Unfortunately not many people are mobile-only so these type of solutions are limited at best. I still think the best solution would be for Articulate to make the button properties editable so that we could
a) turn it off and use a custom button
b) edit the colour, size, transparency and position
The button can be modified in the HTML5 output. I stopped mine from displaying and created my own close button via a trigger. In the output files open the player.css file found in the mobile folder.
search for .window .closeicon
then find the display property: display:none;
then give it some importantance :) display:none !important;
If anyone discovers how to disable it in the flash version it would be really great!
I've just solved this mystery, but it involves editing the code in your .story file. This removes the cross from all lightboxes in the file and therefore from ANY published files created from it, but wait until you've finished building your resource first for efficiency.
Copy your .story file in case something goes wrong!
Rename your copied file from .story to a .zip and extract.
Navigate to story > slides and locate all the slides associated with a lightbox – both the slides that are launching lightboxes and the slides that are being lightboxed (the slide name comes near the top of the xml file so consider putting LB at the beginning of each slide name in Storyline before starting this process for ease of identification)
Look for ltBxClse= near the bottom of the .xml file of each of those slides and change the value from true to false (part of the navData class).
When you’ve altered all the necessary .xml files, select all the folders and files within the root folder and send to compressed file (don’t select the root folder itself as this will add an extra folder).
Rename the compressed file from .zip to .story
Enjoy lightboxes without the red cross and don’t forget to include a close trigger on your lightboxed slide!
Hello Rajesh - If you do not hear back from Pete soon, you may want to reach out to the user directly via the 'Contact Me' option on the user profile. It does look like the instructions are above though.
Hi Rajesh, Every slide has its own .xml file, so you have to go through them one by one to find all the slides you are looking for. I can't give you the exact name as it will be different in each project. Hope that helps, good luck!
Hey there, Eric. Just to chime in, typically your .story files default to your Documents > My Articulate Projects folder. But if you have ever changed that save location, a quick search in File Explorer should do the trick!
Hi Pete. Thank you for solving this. Quick question. It seems the process of renaming the .story file to .zip and then extracting it is not working for me. I get the attached error. Is there another way to get to the XML files such as using a different tool to unzip the file?
28 Replies
Hi Debra, I'm afraid you can't swap out the lightbox button or change the colour.
If you really can't use the lightbox with this limitation, you could try using a layer to create your own lightbox effect.
I have done this in some projects because I did not like the position of the lightbox when opened and the fact that you can't change the transparency of the background.
Thanks Nancy!
Would be great if you could change the colour of the "X" button and frame border.. feature request?
Feature request
Any change on this? Everything else about the standard lightbox is great except the colour of the button that doesn't match my client's theme
This post was removed by the author
Hi Satish, does your solution work for the flash output as well as the mobile? I have not read through your entire blog post so maybe the answer is there.
Hi Nancy
it only talks about mobile but I tried to apply same principle for flash output - I couldn't get it to work for either
I don think it does flash content, nice solution but unworkable if using flash content. A bit like SDK not working in HTML5
@Wendy and Phil - that's what I thought. Unfortunately not many people are mobile-only so these type of solutions are limited at best. I still think the best solution would be for Articulate to make the button properties editable so that we could
a) turn it off and use a custom button
b) edit the colour, size, transparency and position
c) add a text label and or icon
d) add triggers to change the close behaviour.
Agree Nancy - I see it has been a feature request for a couple of years...
The button can be modified in the HTML5 output.
I stopped mine from displaying and created my own close button via a trigger.
In the output files open the player.css file found in the mobile folder.
search for
.window .closeicon
then find the display property:
display:none;
then give it some importantance :)
display:none !important;
If anyone discovers how to disable it in the flash version it would be really great!
Thanks for sharing this Greg!
I've just solved this mystery, but it involves editing the code in your .story file. This removes the cross from all lightboxes in the file and therefore from ANY published files created from it, but wait until you've finished building your resource first for efficiency.
Copy your .story file in case something goes wrong!
Rename your copied file from .story to a .zip and extract.
Navigate to story > slides and locate all the slides associated with a lightbox – both the slides that are launching lightboxes and the slides that are being lightboxed (the slide name comes near the top of the xml file so consider putting LB at the beginning of each slide name in Storyline before starting this process for ease of identification)
Look for ltBxClse= near the bottom of the .xml file of each of those slides and change the value from true to false (part of the navData class).
When you’ve altered all the necessary .xml files, select all the folders and files within the root folder and send to compressed file (don’t select the root folder itself as this will add an extra folder).
Rename the compressed file from .zip to .story
Enjoy lightboxes without the red cross and don’t forget to include a close trigger on your lightboxed slide!
Hi Pete and welcome to E-Learning Heroes!
Thanks for popping in to share your findings and solution with the community :)
It would be great please tell the xml file name in which we need to edit the code?
Hello Rajesh - If you do not hear back from Pete soon, you may want to reach out to the user directly via the 'Contact Me' option on the user profile. It does look like the instructions are above though.
Hi Rajesh, Every slide has its own .xml file, so you have to go through them one by one to find all the slides you are looking for. I can't give you the exact name as it will be different in each project. Hope that helps, good luck!
Thank you Pete !! This will help me in the next project.
Hi Pete,
Quick question - where do I find the .story file? Is it in the published folder?
Cheers
Hi Eric,
This is before it's published. The .story file is your working file that you open in Storyline!
Hope that helps,
Pete
Hey there, Eric. Just to chime in, typically your .story files default to your Documents > My Articulate Projects folder. But if you have ever changed that save location, a quick search in File Explorer should do the trick!
Thanks all! I've submitted a feature request as well - this surely needs an easier way to do it!
Hi Pete. Thank you for solving this. Quick question. It seems the process of renaming the .story file to .zip and then extracting it is not working for me. I get the attached error. Is there another way to get to the XML files such as using a different tool to unzip the file?
Hi Michael,
How are you extracting it? Are you right-clicking on your renamed .zip file and choosing 'Extract All...', or are you trying a different method?
I always use the right-click method and have never had an issue!
Hope that helps,
Pete
This discussion is closed. You can start a new discussion or contact Articulate Support.