Inline Code/Content is phase one of the Export Kit [Build Pattern System]. Inline content allows you to choose between two Build Patterns per environment (additional to come). Build Patterns will functionally remain the same, but the method in which the code is rendered will change.

EXAMPLE: HTML5 exports will allow you to have build pattern (a) styles applied directly to elements, or pattern (b) styles applied to the css file.  Both will render equally, but depending on the project or developer - the optimal output can be used.

Layer Kit Pro Options

Export Kit Pro Output Options

Called Inline Content in Export Kit.

Enabled

If enabled, this will allow inline information, respective of the selected Layer Kit View or Export Kit Output, to be visible in the code output. Each environment will process Inline Code differently and allow for targeted information related to that environment.

Example HTML5 with Inline Code

1

<img src="../skins/exportkit_sample_123/header_bg_copy_3.png" id="header_bg_copy_3" style="top:58px;left: -410px;width: 2003px;height: 797px;" />

Inline Code is great for projects that cannot load external CSS files, such as a Blog or Web CMS (eg. Wix). This makes it easy to add new elements from your PSD, AI or INDD file to your existing project.

Disabled

This will render code normally and will allow for easy reading and modification of the output code.

Example HTML5

1
2
3
4
5
6
7
8
9

<style>
#header_bg_copy_3{
    top:58px;
    left: -410px;
    width: 2003px;
    height: 797px;
}
</style>
<img src="../skins/exportkit_sample_123/header_bg_copy_3.png" id="header_bg_copy_3" />

Under normal circumstances you may want to disable Inline Content to allow for easy reading and common code rendering.