{"_id":"56ec763b3b656b0e00d86200","parentDoc":null,"project":"56d98ee754ee631300116677","version":{"_id":"56d98ee854ee63130011667a","__v":7,"project":"56d98ee754ee631300116677","createdAt":"2016-03-04T13:34:32.189Z","releaseDate":"2016-03-04T13:34:32.189Z","categories":["56d98ee954ee63130011667b","56d9941054ee631300116689","56d9943454ee63130011668a","56d9943d54ee63130011668b","56d9c438f0c80c1b007e16fd","56ec78393b656b0e00d8620f","579a27b9a901b30e004a3bb6"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"__v":3,"category":{"_id":"56d98ee954ee63130011667b","project":"56d98ee754ee631300116677","__v":10,"pages":["56d98eea54ee63130011667d","56ec75e71d8ae40e000c8bc0","56ec75f81d8ae40e000c8bc2","56ec761e3b656b0e00d861fe","56ec76312400d20e0075ba35","56ec763b3b656b0e00d86200","56ec76441d8ae40e000c8bc5","56ec765404e8940e00966520","56ec768904e8940e00966522","56ec773c1d8ae40e000c8bcd"],"version":"56d98ee854ee63130011667a","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2016-03-04T13:34:33.334Z","from_sync":false,"order":0,"slug":"documentation","title":"Studio"},"user":"56d98eda337fd11300d6a2fb","updates":[],"next":{"pages":[],"description":""},"createdAt":"2016-03-18T21:42:19.999Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":3,"body":"The CODE section enables you to easily write your own JavaScript or CSS code in order to extend the functionality of your creatives. \n\nThe Brainient CODE section is unique in that you can reference any of the elements you have added into the CREATE section by just using their *Name* property from the *Properties* panel. \n\nFor example, if you would like to add a border for an image you created in the CREATE section named \"Image\", all you need to do is write the following code in the CSS section: \n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"#Image {\\n    border: 1px solid red;\\n}\",\n      \"language\": \"css\"\n    }\n  ]\n}\n[/block]\nYou can also add an *HTML* element from the CREATE section, which will act as a container of JavaScript code in your CODE section. For example, you can create an HTML element called \"Map\", and then in the CODE section you can select your HTML element called Map and paste in the embed code for a Google Map, as in the screenshot below. \n\nSee [Code snippets](doc:code-snippets) page for more examples.\n\n[block:image]\n{\n  \"images\": [\n    {}\n  ]\n}\n[/block]","excerpt":"","slug":"code-section","type":"basic","title":"CODE section"}
The CODE section enables you to easily write your own JavaScript or CSS code in order to extend the functionality of your creatives. The Brainient CODE section is unique in that you can reference any of the elements you have added into the CREATE section by just using their *Name* property from the *Properties* panel. For example, if you would like to add a border for an image you created in the CREATE section named "Image", all you need to do is write the following code in the CSS section: [block:code] { "codes": [ { "code": "#Image {\n border: 1px solid red;\n}", "language": "css" } ] } [/block] You can also add an *HTML* element from the CREATE section, which will act as a container of JavaScript code in your CODE section. For example, you can create an HTML element called "Map", and then in the CODE section you can select your HTML element called Map and paste in the embed code for a Google Map, as in the screenshot below. See [Code snippets](doc:code-snippets) page for more examples. [block:image] { "images": [ {} ] } [/block]