Display suite

Tutoriály: Display Suite for Drupal 7

Display suite mimo jiné umožňuje:

  • zpřístupnit více možností konfigurace vzhledu a rozložení prvků stránky
  • klonovat nastvení rozložení vzhledu
  • vytvářet vlastní rozložení vzhledu
  • pro zobrazení zvolit konkrétní obrázek z multiple pole obrázků (všechny, první, druhý atd.)
  • definovat použití Image cache
  • vytvářet vlastní pole o definovaném obsahu
  • modifikovat výstupní kód (Field Templates)
  • definivat vlastní CSS třídy (např. kombinace "CSS classes -> CSS Classes for regions" + Manage Dispaly + "Custom Classes -> Class for layout")
  • definovat vlastní bloky (vložit části obsahu do různých regionů)
  • uživatelskou změnu módu zobrazení (switch view mode)
  • jednoduše vkládat extra pole jako je např. "Tweet tlačítko"
  • vlastní konfiguraci nadpisů
  • modifikovat rozložení a vzhled modulu Panels, Search, Views atd.
  • export nastavení a přenesení na jiný web
  • upravovat editační formulář obsahu
  • spolupracovat s Drush
    • drush help ds-build

Instalace a nastavení:

  1. Nainstalujte modul Chaos tool suite (ctools).
  2. Rozbalte modul Display suite 7.x-2.2 do adresáře sites/all/modules/.
  3. Povolte požadované moduly např.:
    • Display suite
    • Display Suite Extras
    • Display Suite Forms
    • Display Suite UI
    • Display Suite Format
  4. V admin/structure/ds/list/extras (Struktura, Display suite, Extras):
    • Field Templates povolte:
      • Enable Field Templates – umožňuje definovat HTML výstup
    • Other povolte:
      • Page title options - umožňuje sktrýt nebo ručně upravit nadpis v zobrazení "Full content"
      • Views Displays – umožňuje pomocí Display Suite měnit vzhled výsledků views např. nadpis, umístění stránkovače (pager) atd.
  5. V admin/structure/ds/fields (Struktura, Display suite, Pole) je možné vytvářet vlastní pole:
    • Code Field – nejuniverzálnější použítí (může obsahovat "cokoli")
    • Dynamic Field – jedno pole může obsahovat v různých pohledech (Teaser, Full node) různý obsah (výhodou je pouze jedna CSS třída)
    • Block Field – zobrazení libovolného bloku
    • Preprocess Filed
  6. Modul Drush umožňuje snadné vytváření vlastních šablon rozložení.
  7. ...

Podobné moduly:

  • Entity View Mode

Další moduly:

  • Field group – umožňuje seskupovat pole, rozbalovat a sbalovat seskupená pole, vytvářet přepínací hrizontální a vertikální záložky (tabs) atd.
  • Renderable elements – umožňuje u libovolného editačního formuláře entity modifikovat libovolný prvek včetně vertikálních záložek
  • Flag
  • Taxonomy display 
  • Fences
  • Field formatter settings
    • Linked Field enlightened
    • Empty fields enlightened
    • Field formatter conditions enlightened
    • Field Word Boundary | Smart Trim enlightened
    • Field injector enlightened
    • Field multiple limit
    • Field Delimiter
    • Field Formatter Class

Tipy:

Příklady vlastních polí

Detekce vyplnění reference na slovník:

<?php
//kpr($entity);
// Search Krumo: $var->field_product_type[LANGUAGE_NONE][0]['tid'];
if(!empty($entity->field_product_type[LANGUAGE_NONE][0]['tid'])): ?>
 [node:field_product_type]
<?php else: ?>
  //...
<?php endif ?>

Zobrazení požadovaného textu na základě hodnoty pole:

<?php
$count = reset(field_get_items('node', $entity, 'field_count'));
$count = $count['value'];
if ($count == 1) {
  $t1 = t('Only one');
} elseif ($count > 1 && $count < 5) {
  $t1 = t("$count > 1 and $count < 5");
} elseif ($count >= 5) {
  $t1 = t("More than 4");
}
print $c;
?>

Pokud je vyplněn odkaz v poli field_slide, stane se obrázek pole field_image odkazem:

<?php
  if (empty($object->field_slide[0]['url'])) {
    print [field_image];
  } 
  else {
    print l('[field_image]', url($object->field_slide[0]['url'], array('absolute' => TRUE)), array('html' => TRUE));
  }
?>

Odkaz číst dál

<?php if($object->readmore) { echo l(t("Read more"), "node/$object->nid"); } ?>​

Odkaz na soubor

<?php if(isset($object->field_file[0]['fid'])): ?>
<a href="/[field_file-filefield-filepath]"><?php echo t('Download') . " ("; ?> [field_file-filefield-filesize_formatted] <?php echo ") - "; ?>[field_file-filefield-filename]</a>
<?php endif; ?>

Detekce Flag příznaku "logo" viz dokumentace The Flag 3.x API (PHP)

<?php
  $flag = flag_get_flag('logo');
  if ($flag && $flag->is_flagged($object->nid)) {
    print "This node has flag Logo!";
  }
?>

Vložení hlavního menu:

<?php
  $menu = menu_navigation_links('main-menu');
  print theme('links__main-menu', array('links' => $menu));
?>

Zobrazení termínů včetně aktivních odkazů:

<?php
//kpr($entity);
for ($i = 0; $i < count($entity->field_town[LANGUAGE_NONE]); $i++) {
  $tid =  $entity->field_town[LANGUAGE_NONE][$i]['taxonomy_term']->tid;
  $term = taxonomy_term_load($tid); // load term object
  $term_uri = taxonomy_term_uri($term); // get array with path
  $term_title = taxonomy_term_title($term);
  $term_path = $term_uri['path'];
  $link = l($term_title,$term_path);
  print '<div class="field-item">'. $link .'</div>';
}
?>

Příklad zobrazení vlastního formátu data (z pole typu "Date"):

<?php
  //kpr($entity);
  $DateFrom = new DateTime($entity->field_date['und'][0]['value']);
  if(isset($entity->field_date['und'][0]['value2'])) {
    $DateTo = new DateTime($entity->field_date['und'][0]['value2']);
    $DateTo = ' – '. $DateTo->format('j. n. Y');
  } else {
    $DateTo = '';
  }
  print ' <span>('. $DateFrom->format('j. n.') . $DateTo .')</span>';
?>

Příklad zobrazení vlastního formátu data (z pole typu "Unix timestamp"):

<?php
  //kpr($entity);
  $day = date("D", $entity->field_program_date[LANGUAGE_NONE][0]['value']);
  $date = date("j.n.", $entity->field_program_date[LANGUAGE_NONE][0]['value']);
  $time = date("G:i", $entity->field_program_date[LANGUAGE_NONE][0]['value']);
  print t($day) .' <span>'. $date .'</span> '. $time;
?>

Kromě základních API funkcí je možné využívat i funkce dalších povolených modulů např. ořez titulku pomocí funkce "views_trim_text()" z modulu Views:

<?php
  //kpr($entity);
  $alter = array(
    'max_length' => 15,
    'word_boundary' => true,
    'ellipsis' => true,
);
  $value = $entity->title;
  print views_trim_text($alter, $value);
?>

Vložení obrázku požadované velikosti definované ve stylech obrázků (Get Image Style Path):

<?php
  //kpr($entity);
  $img_style = "thumbnail";
  $img_url = $entity->field_image['und'][0]['uri'];
  $img_alt = $entity->field_image['und'][0]['alt'];
  if (!empty($img_style) && !empty($img_url)) {
    print '<img src="'. image_style_url($img_style, $img_url) .'" alt="'. $img_alt .'" />';
  }
?>

Vlastní funkce

Větší kontrolu nad poli Display Suite nabízí vlastní funkce umístěné do souboru template.php v aktivním tématu vzhledu případně do vlastního modulu.

Zobrazení pouze prvního obrázku v režimu "náhled":

/**
* Implements hook_field__expert__FIELD_ID().
*/
function mytheme_field__expert__field_images(&$variables) {
  // Inspect the contents of $variables.
  //krumo($variables);
  // View mode detection
  if ($variables['element']['#view_mode'] == 'teaser') {
    // In teaser mode, only output the first image.
    $item = $variables['items'][0];
    $variables['items'] = array(0 => $item);
  }
  return theme_ds_field_expert($variables);
}

...