Tuesday, February 23, 2010

How to creat Drupal themes quicker than you imagined using Dreameraver

This is basic tutorial on how to create a Drupal theme using Themegenie - the advanced Dreamweaver plug-in for Drupal theming.
If you have not bought the extension buy now.

The screenshots used for this tutorial is from Deamweaver CS4. In older versions of Dreamweaver the extension looks a bit varied.

As most of the readers know we create themes for Drupal to present the content created by the Drupal in our own way.

If you use our extension Theme creation is as easy as you create web pages using HTML and CSS in Dreamweaver.

Step 1
Start the Deamweaver, Go to file menu Commands > Themegenie > Themegenie Base files.

Now you have the following window. Give a theme name and click create.

It creates all the base files for your theme and opens the 'page.tpl.php' automatically.

The HTML and CSS are as usual.
To customise the page go to Insert object > Themegenie > Page > select the item

For example, to insert the logo in an HTML area, click the logo.

The logo snippet will show like this in Dreamweaver.
To get the real-time preview click simulation button from the toolbar.

This is the real-time preview of logo.
After you have completed a theme run 'Switch image' from insert objects. This will make image codes relative to Druapl if you have added images and remove the css link which Drupal don't need.

We will release the next version of Themegenie with many new features.

Thanks to all of our valuable customers for motivating us to make this product better.
If you have any questions drop a line to support@themegenie.net .

Please note that you should have at least one site defined. Otherwise the software will guide you to do so. The base files will be created inside the local directory of the site selected. If you don't know how to define sites in Dreamweaver read this. While defining sites to specify the testing sever select the theme directory of your Drupal installation.

Drupal is available for download for free from www.drupal.org and Adobe provides a 30-day risk free trial of Dreamweaver CS4