WordPress Theme Development with Artisteer

Published March 17, 2011 | Categories: Cascade CMS
We recently picked up a fantastic piece of software for designing WordPress themes called Artisteer. While this software doesn't give you complete control over the content, its great for throwing a general layout which can be finely tuned after it is exported. Artisteer features an easy to use 'Microsoft Office'-styled interface that generates your layout and scheme via point and click. When developing for WordPress sites in this way, I religiously abide by the following development process:
Start with the Design/Theme in Artisteer.
- Start a new project within Artisteer with the WordPress CMS.
- Work left to right with along the menu tabs on the ribbon across the top. Within each tab, work left to right with the avaible options and settings.
- On the far left tab, Ideas, click Suggest Design until a base design to work from is found or skip this and build the page using the Layour tab.
- Each tab focus has a 'Suggest' button for the helplessly creative.
- As you work to the last tabs, the design gets fine-tuned across page elements.
- Once a design is ready for site integration, click the arrow on Export button at the top of the menu bar. Select Export Options...
- On the properties option window, enter the author name, url, template version, template URL, any associated tags, and a brief description of the theme.
- Once this is entered, export your theme as a WordPress Theme. Exporting the theme as standard markup is available too, but is of no use inside WordPress.
Integrate into WordPress.
- Start up your FTP app of choice, FireFTP is convenient if your a FireFox user.
- Navigate and transfer a copy of your theme folder to:
/public_html/wp-content/themes/
- Log into your WordPress Dashboard.
http://YourSite.com/wp-admin
- Under the appearance drop-down on the sidebar, select Themes.
- Your theme once uploaded, should be listed among the themes avaialable to your site. Find yours and click 'Activate'.
Add Non-Artisteer Elements and Styles to Template
-
- Artisteer isn't going to always have every part of your site. You can make these from the 'editor' in the WordPress Dashboard listed under Appearance, or use a text editor and FTP.
- Making these modifications require knowing the WordPress Theme structure. Much of the code is in PHP, so background there also helps.
- Inside of every Artisteer generated WordPress theme, you will have the following in your Export folder
Open and add/change markup to THEME_NAME/header.php
for changes to the header area, usually META, LINK, and SCRIPT tags and body elements that precede the menu bar.
- Open and add/change markup to
THEME_NAME/templates/page.php
for changes to the pages Menu, Sidebar, down until the main content area is loaded. - Open and add/change markup to
THEME_NAME/templates/post.php
for changes to the content area of posts and pages across the site. - Open and add/change markup to
THEME_NAME/footer.php
for changes to the footer area, this is any markup that follows the pages main content area
(May be contained within outter-most DIV if designed so within the 'Sheet' in Artisteer). - Open and add/change markup to
THEME_NAME/404.php
for changes to text and verbage on the 404 page. - Open and add/change styles in
THEME_NAME/style.css
for changes to the stylesheet.
Site Structure and Content
- After the above is said and done, all thats left is organizing the structure of the site and loading it with content.
- Under
'Settings > General'
, change blog metadata and primary options. - Under
'Settings > Writing'
, set defaults and settings for publishing blog content. - Under
'Settings > Reading'
, set a static or blog listing homepage and set listing pages to show either summaries or full articles. - Under
'Settings > Discussion'
, configure comment restrictions and requirements. - Under
'Settings > Media'
, configure media (image and file) restrictions and requirements. - Under
'Settings > Privacy'
, configure whether the site is to be visible or not to Search Engines. - Under
'Settings > Permalinks'
, customize the URL structure. I generally stick to Month & Name or a Custom Structure using:/%category%/%postname%
- Determine sidebar widgets and make active under
'Appearance > Widgets'
. - Load posts and pages with content in their respective sections. Keep in mind to setup categories for posts if necessary.
Recent Posts



