Put it on your site
One line of code puts the studio on your page. Your visitors drop a photo, say what it is, and leave with a finished post for every platform. Nothing posts without their tap. On a paid key their photos never leave their device and they never sign in.
- Get a keyFree for one website: 3 posts a month across the site. Paid keys post more and ask your visitors for nothing.
- Paste one lineAnywhere in your page. It loads on its own and stays out of the way.
- Place the studioInline where you put it, or as a button that opens it over your page.
1. Get your free key
Your key is ready. It works on .
- Site key
- Manage token
Save the manage token now. It is shown once, and you need it to add websites, change your brand or manage billing. The site key is fine to publish; the token is not.
2. Paste this into your page
<script src="https://makeitscarlet.com/embed.js" data-key="YOUR_SITE_KEY" async></script>
<make-it-scarlet></make-it-scarlet>
The <make-it-scarlet> tag is where the studio appears. Want a button instead? Use <make-it-scarlet mode="button" label="Make a post"></make-it-scarlet>. Or open it from your own button with MakeItScarlet.open().
3. Make it yours
| Attribute | What it does |
|---|---|
mode | inline (the default) or button |
label | The button's words |
theme | dark or light, to sit well on your page |
platforms | Which places start ticked, like instagram,facebook |
line | A starting line, like the job or the product name |
color, name, logo | Your colour, name and logo on the studio and the looks. Pro and Platform |
Listen for what happens, if you want to:
document.addEventListener('scarlet:made', (e) => {
console.log(e.detail.platforms, e.detail.posts)
})
The events are scarlet:ready, scarlet:made, scarlet:posted and scarlet:close. On Platform, scarlet:made also hands your app the finished pictures as files, so you can save them with the job or the order.