By preston3271 on

Hello, All:

I am new to the drupal development and I wanted to modify the default Article Content Type to a two - column 40% Left - 60% Right layout. I went into the following directory ../drupal/sites/all/modules/ds/layouts/ds_2col_stacked40_60 where I successfully added the the new content type. The content type show up as an option now, but when I go into the content type

Home » Administration » Structure » Content types » Article_40_60 » Manage display

to choose the layout type, the new option does to show up. What am I missing on the configuration. Side note, I am using Display Suite module as well. Do I have to configuration something where as well?

Preston

⋅ Categories: Drupal 7.x

Comments

preston3271’s picture

preston3271 commented

Okay, I think I found something with the Display Suite - Style panel

Configure styles which you can add to regions on the "manage display" screens. Add multiple styles line per line.
If you want to have a friendly name, separate class and friendly name by |, but this is not required. eg:
class_name_1
class_name_2|Friendly name
class_name_3

I okay, so . . . I have 

<?php

/**
 * @file
 * Display Suite 2 column stacked template.
 */
?>
<div class="ds-2col-stacked40_60 <?php print $classes;?> clearfix">

  <?php if (isset($title_suffix['contextual_links'])): ?>
  <?php print render($title_suffix['contextual_links']); ?>
  <?php endif; ?>

  <?php if ($header): ?>
    <div class="group-header<?php print $header_classes; ?>">
      <?php print $header; ?>
    </div>
  <?php endif; ?>

  <?php if ($left): ?>
    <div class="group-left<?php print $left_classes; ?>">
      <?php print $left; ?>
    </div>
  <?php endif; ?>

  <?php if ($right): ?>
    <div class="group-right<?php print $right_classes; ?>">
      <?php print $right; ?>
    </div>
  <?php endif; ?>

  <?php if ($footer): ?>
    <div class="group-footer<?php print $footer_classes; ?>">
      <?php print $footer; ?>
    </div>
  <?php endif; ?>
</div>

and CSS is 


.group-header {
}

.group-left {
  float: left;
  width: 40%;
}

.group-right {
  float: right;
  width: 60%;
}

.group-footer {
  clear: both;
}

Okay, how to do I make the magic here?