Prevent Responsive Text Pop-Outs from Appearing
June 30, 2017
Prevent Responsive Text Pop-Outs from Appearing
June 30, 2017
I’ve been an eLearning designer and developer since 2005, specializing in the creation of interactive and engaging learning experiences. In 2015, I launched my own eLearning design business and began producing Adobe Captivate video tutorials on my YouTube channel, CaptivateTeacher, to support clients and fellow developers. This content not only helped me grow my business globally—it also introduced me to a wider community of aspiring Captivate users who now turn to me for training and mentorship. Today, I provide both online and onsite Adobe Captivate training, empowering others to build effective eLearning with confidence. I’m proud to be part of the Adobe eLearning Community, sharing knowledge, collaborating with other developers, and contributing to the growth of this platform.
Legend 639 posts
Followers: 1014 people

Some Adobe Captivate 2017 users are reporting seeing the following icon/button on their published responsive design eLearning projects.

2017-06-28 10-15-48 PM

The button you are seeing at the bottom of your text container (smart shape or text caption) is actually by design in Adobe Captivate (2017 Release). It appears when a text container has more text than can be accommodated by your minimum font size and the size of the text container. For example, when displaying large paragraphs of text on a smaller display. Tapping the button will display a dark overlay with all the text in white, and if necessary, with a scrollbar when the amount of text is too much for the screen.  Once your learner finishes reading all the text, tapping the screen will return them to the full slide. Sometimes it seems as if the button is appearing for no reason. There are a few possibilities as to why this happens.

  1. Your text container is right on the threshold of when the button will be determined to be necessary. In these cases, slightly increasing the size of the text container may solve your problem. Alternatively, you could also select a smaller minimum font size on your fluid box properties.
  2. Another item to consider is the margins set for your text container. Decreasing the margins will allow more space for your text and perhaps just enough to accommodate the text on smaller device screens.
  3. Lastly, consider where the text has been. If you copied and pasted this text from a word processor, it may contain unnecessary formatting codes, invisible characters, or extra line breaks that could be causing the pop out text button to appear.

Here is a video from my YouTube channel that shows you how you can get rid of the extra hidden characters that might be forcing your project to show these buttons when they are not actually needed.

If you found this article and video useful please share it with your eLearning colleagues. If you would like to see other tutorials like this one, please subscribe to my YouTube channel.

All Comments
Sort by:  Most Recent
May 28, 2019
May 28, 2019

Thank you

Like
()
Apr 29, 2019
Apr 29, 2019

Love your tutorials Paul! I’m still finding myself frustrated by these. I have so many instances of pop-out symbols showing where there are no extra/hidden characters and PLENTY of space in the text area, but I get the pop-out symbol anyway. UGH! Your instructions give me some great troubleshooting steps; I’m just finding that the technology is just not exactly where it needs to be with regard to what it detects as “hidden text.”

Like
()
Aug 10, 2018
Aug 10, 2018

Thank you! I had the hardest time even figuring out what I should cal those breakout icons let alone knowing how to get rid of them.

Like
()