Top Tags

Convert a Word Press theme to Drupal

Nov 10, '07 5:22 PM
Author paddy

The example WP theme I am trying to use is sodelicious_black.

page.tpl.php

Combine header.php, page.php and footer.php into on new file called page.tpl.php. In this new page.tpl.php file:

  • Replace your DOCTYPE and HTML lines with
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
  • Replace the TITLE with
    <title><?php print $head_title ?></title>
  • Replace the links to style sheets, RSS news feeds and the such with
    <?php print $head ?>
    <?php print $styles ?>
    <?php print $scripts ?>
  • Clean up the page.tpl.php by removing the obsolete calls to get_header() and get_footer()
  • Replace echo get_settings('home') with print base_path()
  • Replace bloginfo('name') with print $site_slogan ? $site_slogan : $site_name
  • Drupal uses syntax such as <?php if (isset($primary_links)) {
    print theme('links', $primary_links, array('class' => 'navmenu primary-links'));
    } ?>
    <?php if (isset($secondary_links)) {
    print theme('links', $secondary_links, array('class' => 'navmenu secondary-links'));
    } ?>
    for navigation, so replace the navigation block with this code
  • At the beginning of the main content block, Drupal customarily has a bunch of information such as
    <div class="post-main">
    <?php if ($breadcrumb) { print $breadcrumb; } ?>
    <?php if ($mission) { print '<div id="mission">'. $mission .'</div>'; } ?>
    <?php if ($tabs) { print '<div id="tabs-wrapper" class="clear-block">'; } ?>
    <?php if ($title) { print '<h2'. ($tabs ? ' class="with-tabs"' : '') .'>'. $title .'</h2>'; } ?>
    <?php if ($tabs) { print $tabs .'</div>'; } ?>
    <?php if (isset($tabs2)) { print $tabs2; } ?>
    <?php if ($help) { print $help; } ?>
    <?php if ($show_messages && $messages) { print $messages; } ?>
    </div>
    <?php print $content; ?>
  • The Search blocks are created by Drupal, so remove any code builds a search block – just remember where it was located (top, left, centre, right, footer regions)
  • Replace get_sidebar(); with print $sidebar_left . $sidebar_right;
  • The Recent Posts blocks are created by Drupal, so remove any code that builds a Recent Posts block – just remember where it was located
  • Clean up the code and balance all your DIV’s and SPAN’s

node.tpl.php

The single.php will get trimmed to become the node template – node.tpl.php

  • Start off by removing everything that is already in the page template – page.tpl.php – basically everything before and including the while (have_posts()) loop
  • Replace the_ID() with print $node->nid;
  • Replace permalink() with print $node_url;
  • Replace the_title() with print $title;
  • Replace the Author block with <?php if ($submitted) { print '<span class="submitted">' . $submitted . '</span>'; } ?>
  • Replace the Category block with <?php if ($taxonomy) { print '<div class="terms">' . $terms . '</div>'; } ?>
  • Replace the Comments block with <?php if ($links) { print '<div class="post-tags">' . $links . '</div>'; } ?>
  • Add <?php print $picture ?> before the content to support user pictures
  • Replace the_content('Read more'); with print $content;

comment.tpl.php

The comment.php will get trimmed to become the comment template – comment.tpl.php

  • As before, start off by removing everything that is already in the page template – page.tpl.php – basically everything before and including the foreach ($comments) loop
  • Replace comment_ID() with print $comment->cid;

Results

And there you should have an almost working Drupal theme closely relating the previous WP theme.

  • Sodelicious homepage
  • Sodelicious content
  • Sodelicious edit
  • Sodelicious gallery
  • That’s all folks.
<Previous PostAdded "The Dark Theme" to Drupal Themes
>Next PostBlog Theme for Expression Engine convert to Drupal