Sharepoint 2013 deleting contents of <style> in embed code when saving

Question

I am trying to add some styling to a Sharepoint 2013 page using the Embed code facility. It works fine until I save the page and then it deleted all the text between the <style> and </style> tags?

So I click embed code on the page and enter the following

<style>
.sampleStyle {color:#fff}
</style>

When its saved and re-opened I find sharepoint has changed the code to this

<style unselectable="on">
</style>

Answer 1

It can be done. In my frustration this morning, I was adding information in the embed code box and SharePoint wouldn't save it at all. When I returned to the box, it was just empty.

Here's how to make it work:

• Use embed code as before, but enter the following:

  <script type="text/css">
    */your CSS here/*
  </script>
  

• Click Insert

• Save your page
• Edit your page again and change script to style (as it should be)

It'll now work!

When you first add the code you must use <script> in order for SharePoint to save and embed some code. Once it's embedded, you can change it and it will remain embedded and work.

Answer 2

I think you can't add css styles and javascript in content editor. However, you can use script editor to add them.

Much better is to have a file and using script editor, include that file, like in video https://www.youtube.com/watch?v=gcWX3N4nWyw