it-swarm.asia

كيفية استخدام ملف قالب لتهيئة نموذج؟

في حين أن العقد والتعليقات والكتل والعديد من الأشياء الأخرى في Drupal يتم تمييزها باستخدام ملفات قالب السمة (مثل node.tpl.php) ، فإن النماذج هي قصة مختلفة. لا توجد ملفات قالب السمة للنماذج كيف يمكنني الحصول على نموذج معين لاستخدام قالب موضوع مخصص؟

49
Chaulky

من المعقول تمامًا أن ترغب في استخدام ملف tpl لعرض نموذج. يمكنك استخدام الكثير من CSS الدخيلة و #prefix/#suffix خصائص لتحقيق نتائج متشابهة ، ولكن باستخدام tpl's ، لا يتعين عليك تشويش الفصل بين طبقات المنطق والعروض التقديمية وليس عليك استهداف محددات CSS القبيحة مثل #user-login label. إليك مثال في Drupal 7 ...

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/template/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); ?>

هذا يستخدم Foundation ، والذي يعطينا نموذجًا مثل هذا:

enter image description here

73
Charlie Schliesser

يجب عليك تنفيذ hook_form_alter () في وحدة نمطية أو template.php وتعيين خاصية النموذج # theme :

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

ثم قم بتطبيق سمة جديدة:

/**
 * 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',
    ),
  );
}

ثم قم بإضافة النموذج - قالب user_login.tpl.php مع التعليمات البرمجية لتقديم النموذج:

<?php print drupal_render_children($form) ?> 
17
mrded

على الرغم من أنك قد تكون قادرًا على استخدام حل kiamlaluno أنا شخصياً لن أفعل ذلك.

ما هو سبب حاجتك لملف قالب لنموذج؟ إذا كان ذلك لأنك تريد ترميزًا مختلفًا قليلاً لنموذج موجود؟ إذا كان الأمر كذلك ، فيمكنك استخدام hook_form_alter() لتعديل النموذج قبل تقديمه. باستخدام Form API ، يمكنك تعديل جميع حقول النموذج لإدخال عناصر html وما إلى ذلك.

في ما يلي مثال على hook_form_alter() التي قمت بإنشائها والتي تعدل معيار drupal كتلة نموذج تسجيل الدخول:

/**
 * 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;
  }
}

يلف المثال أعلاه النموذج بأكمله داخل DIV الذي يحتوي على نمط مضمن لتحويل لون الخلفية إلى اللون الأحمر. كما يضيف فقرة من نص التعليمات إلى بداية النموذج.

هذا ما يبدو عليه نموذج تسجيل دخول المستخدم الآن بمجرد تحميل الرمز أعلاه:

Customised login form

راجع مرجع Form API لمزيد من المعلومات: Form API Reference

13
Camsoft

في الواقع لم أكن في حاجة إلى استخدام ملف قالب لنموذج.
بقدر ما أستطيع أن أرى ، Drupal يستخدم وظائف السمة ، عندما يحتاج تقديم نموذج أو جزء من نموذج بطريقة معينة ؛ وظيفة السمة التي calls drupal_render () عادةً ما تكون كافية لأي غرض.

للرد على السؤال ، لا يختلف إنشاء ملف قالب لنموذج عن إنشاء ملف قالب ليس لنموذج.

حدد وظيفة السمة ، باستخدام وظيفة السمة اسم رد منشئ النموذج. يجب أن يكون الرمز مشابهًا لما يلي:

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

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

إذا احتوى النموذج على القيمة $form['field_1'] ، فستتوفر قيمته في ملف القالب كـ $field_1. سيتمكن ملف القالب أيضًا من استخدام أي قيم تم تمريرها من template_preprocess_mymodule_form().

12
kiamlaluno

أود دائمًا أن أضيف نمطًا إلى ملف CSS الخاص بي باستخدام المحددات لتحديد العنصر الذي سيتم تصميمه على النحو التالي لنموذج تسجيل الدخول الأساسي

#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;
}

ما سبق أضف ببساطة إلى sites/all/themes/theme-name/css/theme-name.css

إذا كان ما تحتاجه في النمط لا يحتوي على معرف أو محدد دقيق بما فيه الكفاية ، فمن الضروري استخدام نهج hook لتعديل HTML لإضافة معرفات أيضًا.

تعد المنظمة البحرية الدولية التي تستخدم النمط المضمن للعناصر ممارسة سيئة للغاية يجب إيقافها واستبدالها باستخدام class و id

1
Richard Harrison

لتزيين نموذج ، يمكنك استخدام css مخصص ، كما هو موضح في Themeing Drupal 7 Forms (بما في ذلك CSS و JS).

تحتاج بشكل أساسي إلى تنفيذ هذه الخطوات:

  1. تسجيل مسار إلى النموذج باستخدام hook_menu ()
  2. حدد النموذج
  3. تسجيل وظيفة السمة باستخدام hook_theme ()
  4. اكتب وظيفة السمة
  5. قم بإنشاء ملفات CSS و JavaScript
0
shasi kanth