Bir form temasını oluşturmak için şablon dosyası nasıl kullanılır?

Düğümler, yorumlar, bloklar ve Drupal'daki diğer birçok şey tema şablonu dosyaları (node.tpl.php gibi) kullanılarak temalandırılırken, formlar farklı bir hikayedir. Formlar için tema şablonu dosyaları yoktur. Özel tema şablonunu kullanmak için belirli bir formu nasıl alabilirim?

Bir formu görüntülemek için bir tpl dosyası kullanmak istemek tamamen mantıklı. Benzer sonuçlar elde etmek için çok fazla yabancı CSS ve #prefix/ #suffixözelliği kullanabilirsiniz, ancak tpl'leri kullanarak mantık ve sunum katmanlarınızı birbirinden ayırmanız gerekmez ve çirkin CSS seçicilerini hedeflemeniz gerekmez #user-login label. İşte Drupal 7'de bir örnek:

Mytheme / template.php:

function mytheme_theme($existing, $type, $theme, $path) {
    // Ex 1: the "story" node edit form.
    $items['story_node_form'] = array(
        'render element' => 'form',
        'template' => 'node-edit--story',
        'path' => drupal_get_path('theme', 'mytheme') . '/template/form',
    );

    // Ex 2: a custom form that comes from a custom module's "custom_donate_form()" function.
    $items['custom_donate_form'] = array(
        'render element' => 'form',
        'template' => 'donate',
        'path' => drupal_get_path('theme', 'mytheme') . '/template/form',
    );

    return $items;
}

custom_donate_form ():

function custom_donate_form($form, &$form_state) {
    $form['first_name'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('First name')),
    );
    $form['last_name'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('Last name')),
    );
    $form['address'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('Address')),
    );
    $form['city'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('City')),
    );
    $form['state'] = array(
        '#type' => 'select',
        '#options' => array(
            'default' => 'State',
            '...' => '...',
        ),
    );
    $form['zip'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('Zip')),
    );
    $form['email'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('Email')),
    );
    $form['phone'] = array(
        '#type' => 'textfield',
        '#attributes' => array('placeholder' => t('Phone')),
    );
    $form['submit'] = array(
        '#type' => 'submit',
        '#value' => 'Submit',
    );

    return $form;
}

Mytheme / şablon / form / donate.tpl.php:

<div class="row">
    <div class="small-12 medium-12 large-8 columns">

        <div class="row">
            <div class="small-12 columns">
                <h5>Contact Information</h5>
            </div>
        </div>

        <div class="row">
            <div class="small-12 large-6 medium-6 columns">
                <?php print render($form['first_name']); ?>
            </div>
            <div class="small-12 large-6 medium-6 columns">
                <?php print render($form['last_name']); ?>
            </div>
        </div>

        <div class="row">
            <div class="small-12 medium-6 large-6 columns">
                <?php print render($form['address']); ?>
            </div>

            <div class="small-12 medium-6 large-6 columns">
                <?php print render($form['city']); ?>
            </div>
        </div>

        <div class="row">
            <div class="small-12 medium-3 large-3 columns">
                <?php print render($form['state']); ?>
            </div>

            <div class="small-12 medium-3 large-3 columns">
                <?php print render($form['zip']); ?>
            </div>

            <div class="medium-6 large-6 columns"></div>
        </div>

        <div class="row">
            <div class="small-12 medium-6 large-6 columns">
                <?php print render($form['email']); ?>
            </div>

            <div class="small-12 medium-6 large-6 columns">
                <?php print render($form['phone']); ?>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="small-12 medium-12 large-8 large-offset-2 columns">
            <?php print render($form['submit']); ?>
        </div>
    </div>
</div>

<!-- Render any remaining elements, such as hidden inputs (token, form_id, etc). -->
<?php print drupal_render_children($form); ?>

Bu bize böyle bir form veren Vakfı kullanıyor :

Hook_form_alter () öğesini bir modülde veya template.php içinde uygulamanız ve formun #theme özelliğini ayarlamanız gerekir :

/**
 * Implements hook_form_alter().
 */
function hook_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'user_login') {
    $form['#theme'] = array('overwrite_user_login');
  }
}

Ardından yeni tema uygulayın:

/**
 * Implements hook_theme().
 */
function hook_theme($existing, $type, $theme, $path){
  return array(
    'overwrite_user_login' => array(
      'render element' => 'form',
      'template' => 'form--user_login',
      'path' => $path . '/templates',
    ),
  );
}

Ve sonra form - user_login.tpl.php şablonunu form oluşturmak için aşağıdaki kodla ekleyin:

<?php print drupal_render_children($form) ?> 

Kiamlaluno'nun çözümünü kullanabilmenize rağmen şahsen kullanmam.

Bir form için bir şablon dosyasına ihtiyaç duyma nedeniniz nedir? Eğer mevcut bir form için biraz farklı biçimlendirme istediğiniz için mi? Öyleyse hook_form_alter(), oluşturulmadan önce formu değiştirmek için kullanabilirsiniz . Form API'sini kullanarak, html öğelerine enjekte edilen tüm form alanlarını değiştirebilirsiniz.

İşte hook_form_alter()standart drupal giriş formu bloğunu değiştiren bir örnek oluşturdum:

/**
 * Implements hook_form_alter().
 */
function MYMODULE_form_alter(&$form, &$form_state, $form_id) {

  switch ($form_id) {
    case 'user_login_block':

      // Form modification code goes here.
            $form['divstart'] = array(
                '#value' => '<div style="background-color: red;">',
                '#weight' => -1,
            );

            $form['instruct'] = array(
                '#value' => '<p>Enter your username and password to login</p>',
                '#weight' => 0,
            );          

            $form['divend'] = array(
                '#value' => '</div>',
                '#weight' => 4,             
            );
      break;
  }
}

Yukarıdaki örnek, tüm formu arka plan rengini kırmızıya çevirmek için satır içi stilde olan bir DIV içinde sarar. Ayrıca, formun başına bir yardım metni paragrafı ekler.

Yukarıdaki kod yüklendiğinde kullanıcı oturum açma formum şunun gibi görünüyor:

Daha fazla bilgi için Form API referansına bakın: Form API Referansı

Aslında bir form için bir şablon dosyası kullanmaya hiç ihtiyacım olmadı.
Görebildiğim kadarıyla, Drupal çekirdek kodu, bir formun veya bir formun bir kısmının belirli bir şekilde oluşturulması gerektiğinde tema işlevlerini kullanır; drupal_render () öğesini çağıran bir tema işlevi normalde herhangi bir amaç için yeterlidir.

Soruyu yanıtlamak için, bir form için şablon dosyası oluşturmak, form için olmayan bir şablon dosyası oluşturmaktan farklı değildir.

Bir tema işlevi tanımlayın, tema işlevi olarak form oluşturucu geri çağırma adının adını kullanın. Kod aşağıdakine benzer olmalıdır:

/**
 * Implementation of hook_theme().
 */

 function mymodule_theme() {
   return array(
     'mymodule_form' => array(
       'template' => 'mymodule-form',
       'file' => 'mymodule.admin.inc',
       'arguments' => array('form' => NULL),
     ),
   );
 }

Form değeri içeriyorsa, değeri $form['field_1']şablon dosyasında olduğu gibi olacaktır $field_1. Şablon dosyası ayrıca iletilen değerleri de kullanabilecek template_preprocess_mymodule_form().

Her zaman çekirdek giriş formu için stillendirilecek öğeyi tanımlamak için seçicileri kullanarak CSS dosyama ekleyerek stil verirdim.

#user-login
{
   border:1px solid #888;
   padding-left:10px;
   padding-right:10px;
   background-image: url(http://www.zaretto.com/images/zlogo_s.png);
   background-repeat:no-repeat;
   background-position:right;
}

#user-login label
{
    display: inline-block;
}

Yukarıdaki ben sadece eklemek sites/all/themes/theme-name/css/theme-name.css

Biçimlendirmeniz gerekenler bir kimliği veya yeterince doğru bir seçiciye sahip değilse hook, HTML'yi değiştirmek için bu yaklaşımı kullanmak için de tanımlayıcı ekleyin.

IMO elemanlarında satır içi stil kullanarak ise çok kötü bir uygulama kaldırılmış ve kullanımıyla değiştirilmesi gerektiğini classveid

Bir formun temasını yapmak için, Drupal Drupal 7 Formlarının Düzenlenmesi (CSS ve JS dahil) bölümünde açıklandığı gibi özel bir css kullanabilirsiniz .

Temel olarak şu adımları uygulamanız gerekir:

1. Hook_menu () kullanarak forma yol kaydedin
2. Formu tanımla
3. Hook_theme () ile bir tema fonksiyonunu kaydedin
4. Tema işlevini yaz
5. CSS ve JavaScript dosyalarını oluşturun

Formlar için bir şablon kullanabildiğinize eminim, ancak şablonu ilk etapta kaydetmek için hook_theme kullanmak zorundasınız. Ben formu bir durum oldu gerçekten esaslı bir tablo olması gerektiği ziyade dayalı div ve basit #prefix ve #suffix değişiklikler gerçekten kesmek değildi. Eğer ilgilenirseniz muhtemelen bir örnek bulmaya çalışabilirim.