1. Add custom effects, markup, and styles with Custom Embeds.

    Know CSS, HTML, and Javascript? Use modern web technologies to build out custom widgets, add your own styles, and integrate markup.

    Don't know these technologies?
    We can do it for you. Contact us.

  1. What is this witchcraft?

    Warning: These topics are advanced and overwhelming for the layperson. The intended target is for web developers who understand these technologies.

    Using modern HTML, Cascading Style Sheets, and Javascript we can create stunning animations, powerful UI's which interact with complex API's, or simply add custom elements, anywhere in your SimplyBuilt site.

  1. Like that image slider you've always wanted!
    (source code)

  1. Delicious! I'll take two (or more)!

    Adding custom markup couldn't be easier. There are three locations where you can add custom markup, styles, scripts, and assets such as images or fonts.

    Media Elements:
    Want to add markup in a specific location on the page? Select any existing media element on the page and select Embed.

    Site Level Scripts:
    Want to add a script, stylesheet, or specific markup to every page on your site? A special meta tag maybe? Add it under Settings > Site Scripts. You'll have the choice to add your code to the <head> or bottom of every page of your site.

    Page Level Scripts:
    Want to add a script, stylesheet or specific markup to just a single page on your site? Add it under Page Scripts under the respective page's settings.

  1. Explain it like I'm five, please!

    For the sake of this example, we'll add an HTML5 interactive chart, using this example source code. It uses the wonderful Chart.js library.

    Add a Block
    We'll start with a fresh 1 Tile Block on a fresh page. This is where the chart will reside on the page.



    Open the Embed Picker
    Double click on the image to open the Embed Picker so that we can start adding the code.



    Upload Assets
    Since this example uses the Chart.js library, we'll need to make it available on the page. We'll upload it as an asset for later use.



    Add the Markup
    We'll simply copy and paste the markup from the markup.html in the example. Don't worry about the script and style tags, we'll automatically move them over to their respective locations!



    Update the Asset URL
    You'll notice that the markup includes a script tag which references the Chart.js library we uploaded earlier. We need to copy/paste the URL of that asset so that it is inserted correctly.

    Alternatively, we could use the Resolve Asset URLs button to do this for us automatically.



    Insert!
    We're done with our modifications. All that is left is to insert the markup and sit back and watch our chart show up!



    And we're done. See the actual example below.