Follow

How can I customize the look of the SCORM Cloud player?

Avatar

 

We realize that not everyone loves blue and Clouds as much as we do, so we've made it possible for you to put your own mark on the SCORM Cloud player. You could paint it red, use Comic Sans as your font (but why?!), add a logo- you get the idea.  Customizing the look of the SCORM Cloud player is an option for those folks that are using the SCORM Cloud API or one of our integrations.

 

If you're using the API, check out our Property section in the documentation to see how to add your own CSS. Using WordPress? You can add your CSS to your SCORM Cloud settings right from the WordPress dashboard.


So what can it look like? Well- you can make the SCORM Cloud player look anyway you want it to, but we thought we'd give you an idea with the samples below.

Default SCORM Cloud Player

Screen_Shot_2012-09-20_at_5.02.07_PM.png

 

Customized SCORM Cloud Player (changed font type and size, removed images, change color)

Note that this is for demonstration only- we don't really think this is good design.

Screen_Shot_2012-09-20_at_4.57.47_PM.png

 

Have a cool CSS you have used with SCORM Cloud? If so, send us a screenshot- we'd love to show other examples!

 

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

  • Avatar
    ALCRISOFT S.L.

    Hello!, We are one of your clients and we have a question to ask. Is it possible that you customize the CSS http://cloud.scorm.com/sc/css/cloudPlayer/cloudstyles.css so that our customers to whom we send the dispatch in order to have a neutral style with no colors. Could it be possible to have a white layer and the text in black? Thank you

  • Avatar
    Matthew Smith

    Is this change made in the configurations.js file of the dispatch zip?

  • Avatar
    Tammy Rutherford

    Great question! Yes- you can update the configuration.js file in the Dispatch with your stylesheet. Simply save the changes and you should be good to go. Let us know if you have any questions once you start testing it out.

  • Avatar
    Matthew Smith

    Hi Tammy, I have made the change to the configuration.js file. However the CSS fails to display once the course is loaded as a SCORM package. does the link to the css have to be in https? as long as the link is relative it should work correct? Ive tried everything and cant get the css to display using a custom link.

  • Avatar
    Tammy Rutherford

    It might be good to start with the default CSS from here- https://cloud.scorm.com/sc/css/cloudPlayer/cloudstyles.css. And yes, you'll want to use HTTPS.

     

Powered by Zendesk