Question

I googled, but I didn't find any automated solution. So, I've started it manually. Mapping CSS files is easy, but I'm looking for a way to map blocks/templates. Please, help.

Was it helpful?

Solution

There is no direct way to do it nor any programmatic way. This is because the template structures differ so much. But here are the steps you should take for the fastest conversions...

  1. Load theme in Wordpress then view site in a browser. (the purpose of this is to extract the basic HTML structure of the template).
  2. View source on the page, copy all the HTML and drop into a text editor. Save into a new project folder.
  3. Copy over CSS and JS files to this new project folder. I recommend using a "css" folder and a "js" folder for organization.
  4. Copy over all images to this project folder. I recommend using "images" folder.
  5. Now you have the base template you need to turn it into a theme for Drupal. Time to get busy!
  6. I recommend copying the "garland" theme to a new project folder and renaming it to your new theme name. This will speed things up.
  7. Copy over the css, js, and images folders to the new theme project.
  8. Edit the .info file to load css and js files.
  9. Modify the css and js files to load any images and other file paths to be relative to them.
  10. Using a side-by-side comparison between the page.tpl.php and your template html file you will need to transform the structure of the tpl file to be close to that of the html file. Be careful not to remove dynamic references.
  11. Test, troubleshoot as needed.

Its a lot of steps, but it works. You can also use a theme framework that provides a skeleton theme to build upon. The only problem with this is that sometimes these frameworks are very heavy handed and do far more than is needed. Zen is a common one, but it is very heavy handed. You can find more on the Drupal website at drupal.org (search for themes). Below are some links to a few base themes.

  • Zen Framework
  • NineSixty (960 Grid System, very flexible concept, I have never used it though)
  • Fluid Grid (another great concept, I have seen this in action and its pretty nice)

Finally, here is a link to Drupal's theming guide.

OTHER TIPS

I agree with pthurmond's answer, but I would suggest not to copy the whole HTML and CSS but to do it step by step. Copy the HTML first for, say, the menu; then copy the CSS for it. Use Firebug for the process. This way you will end up with only the really required things. I also recommend a grid system line 960.gs as it is very flexible and you won't have any layout problems.

I too was looking for a way to convert a WordPress theme to Drupal but didn't find any easy solution.

Since my Drupal site is mostly text content I've decided to create an iframe within my WP site containing the Drupal site.

It looks like it's gonna workout. I've removed the header and footer from the Drupal template file and now all I have is the body inside my WP site.

I'll have to adjust the CSS on the Drupal site slightly but I'm really looking forward to this hybrid design.

Licensed under: CC-BY-SA with attribution
Not affiliated with drupal.stackexchange
scroll top