Question

I have graphical project of three-column Drupal front page which has first column for one piece of custom content and two other colums designed for most recent news (one content type) as it is shown on image below:

I am quite new to Drupal and so far I created my own page.front.tpl.php in my PHPTemplate theme with regions like header, footer, menu, search_box etc and content of course. Now I have problem with $content region, in which there should be columns as I described above. My question is: How do I style them (CSS? somewhere in Drupal’s admin? use separate blocks? Some module?) to look like in project?

page.front.tpl.php fragment:

<?php if ($content): ?><div class="content-middle"><?php print $content; ?></div><?php endif; ?>

Output simplified HTML structure (so far only two most recent news), I want to style this somehow:

<div class="content-middle">

  <div class="node">
    <h2 class="title">
    <div class="content">

  <div class="node">
    <h2 class="title">
    <div class="content">

Answer 1

You can create 3 new sections in your theme. Modify your .info file (for example MyThemeName.info) and write the following :

regions[content_center_left] = Left Sidebar
regions[content_center_middle] = Middle Sidebar
regions[content_center_right] = Right Sidebar

The next step is to modify your page.tpl.php or if you want these sections to be available only in front page you can modify page-front.tpl.php. Write the following where you want the sections to be displayed:

<?php if ($content_center_left): ?>
   <div class="content-left">
      <?php print $content_center_left?>
   </div><!-- /content_center_left -->
<?php endif; ?>
<?php if ($content_center_middle): ?>
   <div class="content-middle">
      <?php print $content_center_middle?>
   </div><!-- /content_center_middle -->
<?php endif; ?>
<?php if ($content_center_right): ?>
   <div class="content-right">
      <?php print $content_center_right?>
   </div><!-- /content_center_right -->
<?php endif; ?>

Now you can create your views (as blocks) and display them in these sections.