Documentation > CodeCharge Studio

Creating and Applying CCS Design with Artisteer

Designing CodeCharge Websites
Applying Artisteer Design and Viewing Templates

Using Artisteer you can generate CodeCharge Studio projects in few minutes without learning Photoshop, Dreamwaver or CSS. Artisteer allows you to create fantastic looking design for your website and customize it to your taste.

Designing CodeCharge Websites

Here is how you can quickly create your own unique CCS templates.

1. Start Artisteer and click the "Suggest Design" button several times, until you see a CCS design idea that you like (use "Undo" and "Redo" buttons to browse generated ideas back and forward).




2. Modify the design elements, such as layout, background, header, fonts, etc.




3. Export your template to a folder on your computer.
   
   Note: The CodeCharge Studio export plugin is not included in Artisteer 4.0 by default. You need to install it (for free) from Artisteer Marketplace. Select Export -> Marketplace -> New -> CodeCharge Studio Project to install the plugin.



After that you will be able to export your design to CodeCharge Studio 5.




4. In Artisteer 4 you can add content to your CCS 5 template as well. To do this please enable "Include Content" before exporting the template.

Applying Artisteer Design and Viewing Templates

There are two basic ways of applying Artisteer Design to a project in CodeCharge Studio, depending on whether you'd like to apply the template with content or only the design itself.

To apply the template with content to a project in CCS 5 please follow these steps:

1. In CodeCharge Studio navigate File -> Open Project.
2. Browse for the template folder you've exported from Artisteer.
3. In the template folder choose the .ccs file and click "Open".




4. Double-click your blog- or homepage in the "Project Explorer" and choose the Preview tab to preview the page.




5. Navigate Home -> Publishing -> Publishing Settings.
6. In the Project Settings enter the full path to your site folder on server and the server URL.
7. Check "All files excluding extensions" and click "OK".




8. Enter the URL in your browser, choose and click the page you'd like to view (e.g. home.php or blog.php).

Note: To import the template with content don't forget to enable Include Content before exporting it from Artisteer.

To apply the Artisteer design without content:

1. Open your CCS 5 project.
2. Go to the Home tab -> Project -> Designs.
3. Click the "plus" icon ("Add Design"), browse for the theme folder exported from Artisteer and click "OK" to add design to the project.




4. Apply the selected design to your project.

Now you can edit and finetune your web application with CodeCharge Studio 5.
Congratulations on your great looking website powered by your CCS template designed with Artisteer!

Download Free Artisteer Trial

Watch Flash Demo