Como envolvo dois elementos da matriz de renderização em uma div?

Dada essa matriz renderizável:

$output = array(
    'twitter-icon' => array(
      '#type' => 'markup',
      '#markup' => '<div class="twitter-icon"></div>'
    ),
    'twitter-link' => array(
      '#type' => 'markup',
      '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/zujava'),
    ), 
  );

Como envolvo esses dois elementos em um único DIV?

7 theming

— Justin
fonte

Respostas:

Você também pode usar o #containerelemento do formulário e um código semelhante ao seguinte:

$wrapper = array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('class-name'),
  ),
);

$wrapper['twitter-icon'] => array(
  '#type' => 'markup',
  '#markup' => '<div class="twitter-icon"></div>'
);

$wrapper['twitter-link'] => array(
  '#type' => 'markup',
  '#markup' => l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
);

O elemento #container agrupa seus elementos filhos com uma <div>tag, cuja classe CSS é a que foi passada na #attributespropriedade

Você pode até usar um contêiner para o elemento "twitter-icon", mas isso não fornece nenhum profissional, exceto no caso de você poder adicionar um elemento a ele, como no código a seguir:

$wrapper = array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('class-name'),
  ),
);

$wrapper['twitter-icon'] => array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('twitter-icon'),
  ),
);

if ($condition) {
  $wrapper['twitter-icon']['twitter-icon-text'] => array(
    '#type' => 'markup',
    '#markup' => t('Icon text'),
  );
}

$wrapper['twitter-link'] => array(
  '#type' => 'markup',
  '#markup' => l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
);

— kiamlaluno
fonte

Para mim, esta é a melhor resposta, pois ela usa a estrutura do array físico para representar o que está sendo quebrado, copiará e colará melhor (mover um elemento na resposta @ninjascorner pode quebrar as DIVs de abertura / fechamento) e não requer extra funções do tema. Obrigado!

— 6117 Justin

Isso está correto: você pode adicionar outro elemento que é renderizado no mesmo contêiner, sem mover a #suffixpropriedade do último elemento ou a #prefixpropriedade do primeiro elemento para o novo elemento adicionado. Como você disse, isso é menos propenso a erros.

— kiamlaluno

É isso que você está procurando?

$output = array(
    'twitter-icon' => array(
      '#type' => 'markup',
      '#markup' => '<div class="twitter-icon"></div>'
      '#prefix' => '<div class="test">',
    ),
    'twitter-link' => array(
      '#type' => 'markup',
      '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/fdgf'),
      '#suffix' => '</div>',
    ), 
);

Espero que ajude!

— ninjascorner
fonte

@nija + 1ed, ótima resposta Eu tinha esquecido esses atributos. Por favor, leia minha resposta, isso pode ser alcançado através de uma alternativa baseada em temas ao seu sufixo e prefixo.

— stefgosselin

@stefgosselin, você quer criar um arquivo tpl para o tema?

— Ninjascorner 6/12/11

Obrigado por esta resposta. Eu sabia como fazer isso em um elemento, mas não me ocorreu dividir o sufixo e o prefixo. Interessante. Parece uma bagunça para mim, mas não consigo articular o porquê, então não posso realmente ter um problema.

— 1176 Justin

@ninjascorner Desculpe pelo atraso, não consegui encontrar a nota que eu tinha sobre esse assunto. Há também acho que uma maneira possível menos elegante do que outras respostas, utilizáveis em tema ou módulo que está usando o gancho tema theme_render_example_add_div Veja api.drupal.org/api/examples/... )

— stefgosselin

Isso só é bom se você tiver certeza absoluta de que os dois elementos serão sempre renderizados. É fácil acabar com <div> não fechado ao dividir assim.

— kufeiko

Você também pode criar um tema para isso.

$form['twitter']['#theme'] = 'my_twitter_theme';

$form['twitter']['icon'] = array(
'twitter-icon' => array(
  '#type' => 'markup',
  '#markup' => '<div class="twitter-icon"></div>'
);

$form['twitter']['link'] = array(
  '#type' => 'markup',
  '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/zujava'),
);

E no gancho do seu tema:

function my_hook_theme(){
  return array(
    'my_twitter_theme' => array('form' => NULL)
  );
}

E na função do tema:

function theme_my_twitter_theme($form){
  $output = "";

  $output .= "<div class=\"twitter\">";
  $output .= drupal_render($form['icon']);
  $output .= drupal_render($form['link']);
  $output .= "</div>";    

  $output .= drupal_render($form);
  return $output;
}

Eu uso isso no Drupal 6, não tenho certeza se funciona também no D7, mas espero que sim

— Gnuget
fonte

Sim, descobri esse método depois da postagem (copiei o módulo de exemplos). Funciona muito bem, mas não o considero o melhor método porque (se entendi corretamente), você deve colocar o nome da sua classe na função, reduzindo sua reutilização.

— 6117 Justin