1 Reply Latest reply on Jan 7, 2015 9:07 AM by David Bastedo

    Can we link to an external stylesheet inside of an HTML widget on Jive Cloud?

    rwhitworth Novice
    rwhitworth Jan 18, 2017 7:37 PM

      We are using Jive cloud, and I want to provide a common set of classes that can be used throughout our environment inside of HTML widgets. I setup my own content delivery network (CDN) to host these files, and made it an SSL site to keep from getting security errors. I am try to reference a custom css like the following:

       

      <link href="https://ourrealcdngoeshere.com/css/test.css" rel="stylesheet">

       

      The styles are not being loaded, and I can't find a reference to the css file anywhere when I debug the page.

       

      I tried 3 different options. In one html widget, I linked to an external file.

      <link href="https://ourrealcdngoeshere.com/css/test.css" rel="stylesheet">

       

       

      In the second, I linked to the shortcut given to me in managed files:

      <link href="/resources/statics/5932/test.css" rel="stylesheet">

       

      And in the final, I embedded the css in the style tags, at which point all three widgets started applying the file.

       

      So, can we link to an external css file? And if not, shouldn't I at least be able to link to css in the "Managed Files" section?

        • Re: Can we link to an external stylesheet inside of an HTML widget on Jive Cloud?
          Expert
          David Bastedo Jan 7, 2015 9:07 AM (in response to rwhitworth)

          I'm following up on this support discussion, as it looks like this issue was handled in a separate support case. I wanted to post back here in case anyone else in the community has the same question.

           

          Widgets cannot use global CSS or JavaScript code (see HTML and Formatted Text Widgets) - This means that the first two examples are the expected behavior of the system.

           

          Managing HTML Widget Security

          To ensure security and prevent problems that can corrupt your pages and keep them from loading, any HTML widget code that calls a <script> tag will be contained in an isolated iFrame. This is known as "safe mode." If you want to include CSS or other styling in the widget, you can include it in the same location as your HTML code. Isolation of the HTML widget also means that the widget can't borrow JavaScript from the Overview page, and that visual components cannot extend beyond the perimeter of the iframe. Simple HTML, JavaScript, and CSS continue to be supported.

          In safe mode, you can still call the assets associated with the core Jive installation as follows: <script src="/resources/scripts/jquery/jquery.js"></script><link rel="stylesheet" href="/styles/jive.css" media="all">