HTML scrolling text in Captivate

Report · Feb 21, 2018

Hello all,

I'm embedding HTML code into a web object in Captivate to get scrolling text. (I do not want to use the Captivate scrolling text widget just an FYI)

Everything is working fine except for the font. It's correctly pulling Lato into the scrolling text when I preview in Captivate, but when I publish the project to the web, it's showing Times New Roman.

I'm currently calling to the Lato font via Adobe Web Fonts but I want to call to the google font instead to see if this will solve my problem. How should I change the code, so that I'm calling in the font from Google? Or is there an obvious reason I'm not seeing as to why the correct font isn't appearing in the published project?

Here's the @Import code for Lato from Google Fonts:

<style>

@Import url('https://fonts.googleapis.com/css?family=Lato');

</style>

Here's the standard code:

Here's my scrolling text code:

#scrollingText, h1 {

font-family: lato;

font-style: normal;

font-weight: 300;

font-size: 14px;

}

h1 {

text-align: center

}

#scrollingText {

margin-top: -25px;

padding-right: 15px;

padding-left: 15px;

}

</style>

<script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/lato:n1,n3:default.js" type="text/javascript"></script>

</div>

Thanks!

Report · Feb 21, 2018

Moved to the Captivate forum

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Report · Feb 21, 2018

The Adobe Web Fonts method you have for your scrolling text assumes that you have access to both the <head> and <body> areas of a web page in order for the external call to the font to work...

Take a look at this article link that addresses using external fonts in Captivate:

https://medium.com/@hdecisions/using-custom-fonts-in-adobe-captivate-592350d4c650

Hope this helps!
Make sure to press "✔ Correct Answer" on this post if this answers your question. Happy Creating!
Anissa • @anissat

Report · Feb 22, 2018

Thanks for the article Anissa. I actually had already put the javascript discussed by this article into the project that so on enter it calls out the font from google. However, the correct font is still not being pulled into the scrolling text I've embedded as code in a web object that I created.

I'm wondering if the code is confused that I'm asking it to call out a font from adobe within the scrolling text, when on enter i'm having it call out a font from google. That's why I was guessing that if I changed the HTML code to call out the google font it might fix it. I just am not sure how to do it in the above code. (I'm new to HTML and all forms of coding so I'm having to figure this out as I go)

Any help on how to fix this code would be greatly appreciated!

Report · Feb 22, 2018

Is this text dynamically generated from variables in the code?

Sometimes dynamic text doesn't behave in the same way as static text. Try testing whether you have the same issue with Static text (i.e. text that does not change in any way).

Report · Feb 22, 2018

The text itself isn't dynamic.

Within the project the only advanced action applied to the text is that i have a button in the project and when you click it, it reveals the scrolling text box. However, there are no variables within the actual HTML code that make the text dyanmic. The exact code I'm using is in my original post, and the place where I place my text is where you see "TEXT TEXT TEXT."