{"_id":"54d5635732d98b0d00384b15","__v":5,"category":{"_id":"551f39be6886f8230055f02a","__v":5,"pages":["551f39d0610f400d00837ec2","551f39ef610f400d00837ec4","551f3a0b50a0fc210057968c","551f3a164986f62b00a720e0","55206797623ff50d009b2bdf"],"project":"54d53c7b23010a0d001aca0c","version":"54d5635532d98b0d00384afb","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-04-04T01:09:18.662Z","from_sync":false,"order":10,"slug":"language-modes","title":"Language Modes"},"user":"54cfa8e1a8a4fd0d00b7fd1d","parentDoc":null,"project":"54d53c7b23010a0d001aca0c","version":{"_id":"54d5635532d98b0d00384afb","project":"54d53c7b23010a0d001aca0c","__v":10,"forked_from":"54d53c7c23010a0d001aca0f","createdAt":"2015-02-07T00:59:01.934Z","releaseDate":"2015-02-07T00:59:01.934Z","categories":["54d5635632d98b0d00384afc","54d5635632d98b0d00384afd","54d5635632d98b0d00384afe","54d5635632d98b0d00384aff","54d5635632d98b0d00384b00","54d5635632d98b0d00384b01","54d5635632d98b0d00384b02","54d652097e05890d006f153e","54dd1315ca1e5219007e9daa","54e21e2b22de1c230094b147","54e68e62a43fe13500db3879","54fa1d3fe7a0ba2f00306309","551c453a23a1ee190034d19a","551df586e52a0b23000c62b6","551f39be6886f8230055f02a","55a6720751457325000e4d97"],"is_deprecated":false,"is_hidden":false,"is_beta":true,"is_stable":true,"codename":"","version_clean":"0.1.0","version":"0.1"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-02-07T00:08:41.973Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"auth":"required","params":[],"url":""},"isReference":false,"order":6,"body":"TextMate themes have become somewhat of a standard when it comes to defining syntax color themes. These `.tmTheme` files are supported by many other editors such. Cloud9 offers an importer that converts these files into css that can be used in Cloud9. This guide walks you through importing a .tmTheme file into Cloud9.\n\n*Existing themes can be found in the SDK under the [ace/theme directory](https://github.com/c9/core/tree/master/node_modules/ace/lib/ace/theme).*\n\n## Importing\n\nTo import a file run the included `tmtheme.js` tool in the tools directory.\n\n```\n$ cd core # the directory where you cloned the SDK\n$ cd node_modules/ace/tool\n$ npm install; cd ..\n$ node ./tool/tmtheme.js mytheme path/to/MyTheme.tmTheme /path/to/plugin/themes\n```\n\nThis creates two files in the `/path/to/plugin/themes` directory.\n\n- `mytheme.js` Some metadata for your theme.\n- `mytheme.css` The css that contains the theme styling.\n\n# Header\n\nOpen `mytheme.css` and add the following line as it's first line.\n\n```\n/* name: <Name>; isDark: <true|false>; cssClass: <cssClass>; */\n```\n\nCopy the values of the variables `name`, `isDark` and `cssClass` from mytheme.js to this header. Save the `.css` file and delete the `.js` file.\n\nYour theme is now ready for distribution. See the guide on [adding themes in Cloud9 Bundles](doc:themes) for more information.","excerpt":"","slug":"import-a-textmate-theme","type":"basic","title":"Import a TextMate Theme"}

Import a TextMate Theme


TextMate themes have become somewhat of a standard when it comes to defining syntax color themes. These `.tmTheme` files are supported by many other editors such. Cloud9 offers an importer that converts these files into css that can be used in Cloud9. This guide walks you through importing a .tmTheme file into Cloud9. *Existing themes can be found in the SDK under the [ace/theme directory](https://github.com/c9/core/tree/master/node_modules/ace/lib/ace/theme).* ## Importing To import a file run the included `tmtheme.js` tool in the tools directory. ``` $ cd core # the directory where you cloned the SDK $ cd node_modules/ace/tool $ npm install; cd .. $ node ./tool/tmtheme.js mytheme path/to/MyTheme.tmTheme /path/to/plugin/themes ``` This creates two files in the `/path/to/plugin/themes` directory. - `mytheme.js` Some metadata for your theme. - `mytheme.css` The css that contains the theme styling. # Header Open `mytheme.css` and add the following line as it's first line. ``` /* name: <Name>; isDark: <true|false>; cssClass: <cssClass>; */ ``` Copy the values of the variables `name`, `isDark` and `cssClass` from mytheme.js to this header. Save the `.css` file and delete the `.js` file. Your theme is now ready for distribution. See the guide on [adding themes in Cloud9 Bundles](doc:themes) for more information.