Need help implementing design in Drupal
Miroch - September 5, 2007 - 13:15
Hello I have a webdesign http://www.befriends.se/site/genericsite.gif
which I need implemented in Drupal.
Anyone got an idea how this could be done?
Maybe it could be done by tweaking one of the themes, i've tried to make Garland display solid colors but I failed the css-stylesheet is so massive and complex.
Help is greatly appreciated.
Best Regards
Miroch
Start With Blue Marine
There are a lot of didfferent things happening with garland that make it less than the ideal theme to modify. I would honestly either mod blue marine or just look at all the variable outputs in blue marine and build a template from scratch, that's my desired method. Alternatively, I've heard that a lot of people are liking the Zend theme, but again I prefer to roll my own for each and every project. If you are proficient in css/xhtml rolling your own brings many advantages and allows for complete control, though same results could be accomplished with modifying an existing theme I just find it easier.
Peace,
-mpare
--
Pare Technologies
Drupal Consulting, Themeing, and Module Development
806.781.8324 | 806.733.3025
www.paretech.com
Figure Something Out? Document Your Success!
You can say that again...
I decided to customize Garland for our website and some aspects were downright crazy with the Garland theme. It is "done" so we will stick with it... do not know that I would have made the effort if I understood what an effort it would be.
Hint: Make sure you view with Firefox, and have FireBug and Web Developer add-ons installed!!! ;-)
Thank you
I do have some skill with css/xhtml but I think i'll try tweaking Blue Marine first, it seems the quicker way.
And thanks for the tip about using Firefox.
Thanks a bunch
/Miroch
a simple page.tpl.php
I would agree that is better work all from zero. Below a cleaner code I used for page.tpl.php. It has a similar structure you need for your page:
-header
-3 columns (col1,col2,col3)
-footer (if necesary)
You can work your theme based on this scheme. Then, you can start to define your "style.css" from zero and based on the identifiers defined in page.tpl.php (wrapper,header,etc.). It's really faster then modifying a Drupal template.
Cheers,
David.
----page.tpl.php----
<!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" xml:lang="<?php print $language ?>" lang="<?php print $language ?>">
<head>
<title><?php print $head_title ?></title>
<?php print $head ?>
<?php print $scripts ?>
<?php print $styles ?>
</head>
<body<?php print phptemplate_body_class($sidebar_left, $sidebar_right); ?>>
<div id="wrapper">
<div id="header">
<div id="logo-floater">
<?php
// Prepare header
$site_fields = array();
if ($site_name) {
$site_fields[] = check_plain($site_name);
}
if ($site_slogan) {
$site_fields[] = check_plain($site_slogan);
}
$site_title = implode(' ', $site_fields);
$site_fields[0] = '<span>'. $site_fields[0] .'</span>';
$site_html = implode(' ', $site_fields);
if ($logo || $site_title) {
print '<h1><a href="'. check_url($base_path) .'" title="'. $site_title .'">';
if ($logo) {
print '<img src="'. check_url($logo) .'" alt="'. $site_title .'" id="logo" />';
}
print $site_html .'</a></h1>';
}
?>
</div>
<?php print $header; ?>
</div><!--/header-->
<div id="topMenu">
<?php if (isset($primary_links)) : ?>
<?php print theme('links', $primary_links, array('class' => 'links primary-links')) ?>
<?php endif; ?>
<?php if (isset($secondary_links)) : ?>
<?php print theme('links', $secondary_links, array('class' => 'links secondary-links')) ?>
<?php endif; ?>
</div>
<?php if ($sidebar_left): ?>
<div id="col1">
<?php print $sidebar_left ?>
</div><!--/col1-->
<?php endif; ?>
<div id="col2">
<?php if ($breadcrumb): print $breadcrumb; endif; ?>
<?php if ($mission): print '<div id="mission">'. $mission .'</div>'; endif; ?>
<?php if ($tabs): print '<div id="tabs-wrapper" class="clear-block">'; endif; ?>
<?php if ($title): print '<h2'. ($tabs ? ' class="with-tabs"' : '') .'>'. $title .'</h2>'; endif; ?>
<?php if ($tabs): print $tabs .'</div>'; endif; ?>
<?php if (isset($tabs2)): print $tabs2; endif; ?>
<?php if ($help): print $help; endif; ?>
<?php if ($messages): print $messages; endif; ?>
<?php print $content ?>
</div><!--/col2-->
<?php if ($sidebar_right): ?>
<div id="col3">
<?php print $sidebar_right ?>
</div><!--/col3-->
<?php endif; ?>
<div id="footer">
<?php print $footer_message ?>
<?php print $feed_icons ?>
</div>
</div>
<?php print $closure ?>
</body>
</html>