থিম একটি যোগাযোগ ফর্ম

Question

আমি ড্রুপাল ৮-তে একটি পরিচিতি ফর্ম থিম করতে চাই I'd

আমি কিছু উপাদানগুলিতে কিছু উপাদান রাখতে চাই (জমা বোতামটি, ফর্মটি নিজেই)।

Comments

আমি আপনার সমস্যাটি আরও বিশদে বর্ণনা করার এবং আপনি ইতিমধ্যে কী চেষ্টা করেছেন তা বলার পরামর্শ দিচ্ছি। এটি কিছু উদ্যোগ প্রদর্শন করবে এবং অন্যকে আপনাকে আরও ভাল উত্তর দিতে সহায়তা করবে।

— আরম বায়াজায়ান

Answer 1

আপনার YOURTHEMENAME.theme ফাইলটি খুলুন এবং নিম্নলিখিত কোডটি যুক্ত করুন:

function YOURTHEMENAME_form_contact_message_feedback_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id) {

  // Name
  $form['name']['#prefix'] = '<div class="row"><div class="col-md-6"><div class="form-group">';
  $form['name']['#suffix'] = '</div>';
  $form['name']['#attributes']['placeholder'][] = $form['name']['#title'].'*';
  $form['name']['#attributes']['class'][] = 'form-control';
  unset($form['name']['#title']);

  // Mail
  $form['mail']['#prefix'] = '<div class="form-group">';
  $form['mail']['#suffix'] = '</div>';
  $form['mail']['#attributes']['placeholder'][] = $form['mail']['#title'].'*';
  $form['mail']['#attributes']['class'][] = 'form-control';
  unset($form['mail']['#title']);


  // Subject
  $form['subject']['widget'][0]['value']['#attributes']['class'][] = 'form-control';
  $form['subject']['widget'][0]['value']['#attributes']['placeholder'][] = $form['subject']['widget'][0]['#title'].'*';
  $form['subject']['widget'][0]['#title'] = '';
  unset($form['subject']['widget'][0]['value']['#title']);
  $form['subject']['widget'][0]['#prefix'] = '<div class="form-group">';
  $form['subject']['widget'][0]['#suffix'] = '</div></div>';

  // Message
  $form['message']['widget'][0]['value']['#attributes']['class'][] = 'form-control';
  $form['message']['widget'][0]['value']['#attributes']['placeholder'][] = $form['message']['widget'][0]['#title'].'*';
  $form['message']['widget'][0]['#title'] = '';
  unset($form['message']['widget'][0]['value']['#title']);
  $form['message']['widget'][0]['#prefix'] = '<div class="col-md-6"><div class="form-group">';
  $form['message']['widget'][0]['#suffix'] = '</div></div></div>';

  // Submit
  $form['actions']['#prefix'] = '<div class="clearfix">';
  $form['actions']['#suffix'] = '</div>';
  $form['actions']['submit']['#attributes']['class'][] = 'btn';
  $form['actions']['submit']['#attributes']['class'][] = 'btn-success';
  $form['actions']['submit']['#attributes']['class'][] = 'pull-right';

}

এবং এখানে আপনার ফলাফল:

আপনার ক্যাশে সাফ করতে ভুলবেন না;)

Comments

যদি আমার থিমটির নাম 'এবিসি', এবং আমার ফর্মের নামযুক্ত 'আমাদের সাথে যোগাযোগ করুন', তবে আমি ফাংশনটির নাম কি রাখি?

— ড্যানিয়েল ডিউহার্স্ট

{theameame} _for_contact_message_ {formname} _for_alter

— জোহান হায়েস্ট

এটি এত দুর্দান্ত!

— আইপওয়া

Answer 2

আপনি কীভাবে চান প্রতিটি ফর্মটি কেবল থিম করতে পারেন। আমি @ আরপায়ানমের এই পদ্ধতিটি পছন্দ করি না, এটি প্রিন্টেনের পক্ষে কঠিন এবং শক্ত পাঠযোগ্য, বড় আকারগুলির সাথে এটি একমাত্র র‌্যাপার এবং সাধারণ কাঠামো নয়।

থিমটি ব্যবহার করার চেষ্টা করা প্রতিটি ফর্ম তাদের মেশিনের নামের সমান। আপনি এই টেম্পলেটটির নামটি $form['#theme']কেবলমাত্র পরিবর্তনের মাধ্যমে খুঁজে পেতে পারেন, এটি সর্বদা (বা বেশিরভাগ ক্ষেত্রে) ফর্ম আইডি মেশিনের নামের মতো। আপনার যা করা দরকার তা হ'ল এটির জন্য টেমপ্লেট নিবন্ধন করুন। আপনার বাস্তবায়ন করা দরকার hook_theme()। আপনি এটি CUSTOMMODULE.module বা THEMENAME.theme এ লিখতে পারেন। থিম কীটি অবশ্যই সেই একই হওয়া উচিত $form['#theme'], সুতরাং এটি স্বয়ংক্রিয়ভাবে এটি ব্যবহার করে, অন্যথায় আপনাকে ফর্ম পরিবর্তনের মাধ্যমে নতুন যুক্ত করতে হবে।

/**
 * Implements hook_theme().
 */
function MODULENAME_theme($existing, $type, $theme, $path) {
  return [
    'FORM_ID_THEME' => [
      'template' => 'custom-form-template-name',
      'render element' => 'form',
    ]
  ];
}

ফর্মের সাথে ড্রুপাল পাস $ ফর্মের পরিবর্তনশীল।

তারপরে আপনাকে অবশ্যই তৈরি করতে হবে custom-form-template-name.html.twig(আপনার টেমপ্লেটের নামটি হুক_থেম () থেকে)।

সর্বনিম্ন টেম্পলেটটি

{{ form }}

আপনি যেখানে চান সেখানে ফর্ম থেকে প্রতিটি ক্ষেত্রও মুদ্রণ করতে পারেন

{{ form.field_name }}

এখানে আপনি মার্কআপ দিয়ে যা খুশি তা করতে পারেন।

আপনি প্রয়োগ করে টেমপ্লেটে অতিরিক্ত ডেটাও পাস করতে পারেন template_preprocess_TEMPALTENAME

function template_preprocess_FORM_ID_THEME(&$variables) {
  $variables['example'] = 'This is added via preprocess';
}

এবং তারপরে টেমপ্লেটে ব্যবহার করুন

{{ example }}
<div class="first-field">
  {{ form.first_field }}
</div>

<div class="second-field">
  {{ form.second_field }}
</div>

<div class="buttons">
  {{ form.submit }}
  {{ form.preview }}
</div>
{#
Don't forget to add printing form special info at the end.
Without this data form will not working propertly.
#}
{{ form.form_build_id }}
{{ form.form_token }}
{{ form.form_id }}

আমি মনে করি এই পদ্ধতিটি আরও ফ্লিক্সেবল, পরিষ্কার এবং শক্তিশালী।

আমার ইংরেজিটির জন্য দুঃখিত, আশা করি কেউ আমার ভুলগুলি সংশোধন করে ঠিক করেছেন :)

এই পদ্ধতিটি ব্যবহার করে জটিল ফর্মের উদাহরণ।

Comments

মনে রাখবেন যে আমার জন্য, আমি {{ form.submit }}{{ form.actions.submit }}

— 19

@ নিক্লান: আমি আমার কাস্টম সত্তা বান্ডিল ফর্মের জন্য একই কোডটি অনুসরণ করেছি। যদি আমি ব্যবহার {{ form }}করি তবে এটি পুরো ফর্মটি মুদ্রণ করছে ut তবে আমি যদি নির্দিষ্ট ক্ষেত্রের মতো ব্যবহার করি তবে {{ form.my_field }}কিছুই প্রদর্শিত হয় না। কোনও ধারণা কীভাবে আমরা কাস্টম সত্তা বান্ডিল ফর্মের প্রতিটি ক্ষেত্র প্রদর্শন করতে পারি?

— কালিদাসন

@ কালিদাসন প্রতিটি ক্ষেত্র প্রিন্ট না করে মুদ্রণের চেষ্টা করুন {{ form }}। আমি পরামর্শ দিচ্ছি যে {{ form }}সমস্ত ফর্ম উপাদান মুদ্রণের পরে চিহ্নিত করা '#rendered' => TRUEহবে এবং শীঘ্রই রেন্ডার হবে না। যদি আপনি এই পদ্ধতিটি ফর্মটি ব্যবহার করতে না চান তবে আপনাকে অবশ্যই প্রতিটি ক্ষেত্র পৃথকভাবে মুদ্রণ করতে হবে। drupal_render_children()ড্রুপাল 8-তে কোনও নেই , আপনি নিজে লিখে না নিলে। যাইহোক, ডিফল্টরূপে এটি সদৃশ হয়ে যাবে, সুতরাং প্রতিটি ক্ষেত্রটি ম্যানুয়ালি মুদ্রণের চেষ্টা করুন।

— নিকলান

@ নিকলান: আমি {{ form }} & {{ form.my_field }}একসাথে ব্যবহার করি নি । প্রথমে কেবল চেষ্টা করেই {{ form }}এখানে পুরো ফর্মটি দেখতে পাচ্ছি। তারপরে {{ form }}টেমপ্লেট থেকে সরানো হয়েছে এবং প্রতিটি ফর্ম ক্ষেত্রের জন্য পৃথক পৃথকভাবে চেষ্টা করে দেখুন {{ form.my_field }}, etc , তবে কোনও ফল পাবেন না। কিছুই প্রদর্শিত হয় না।

— কালিদাসন

@ কালিদাসন আপনি এতে শিরোনাম আনসেট করতে পারেন template_preprocess_FORM_ID_THEME(&$variables)। এই প্রিপ্রোসেসে আপনি নতুন ভেরিয়েবল যুক্ত করতে পারেন, ফর্ম উপাদানগুলি সহ বিদ্যমান পরিবর্তন করতে পারেন। আমি এটি কখনও দেখিনি {{ form.field_name.widget }}এবং আমি প্রায়শই ফর্মগুলি ফর্ম করি। দেখে মনে হচ্ছে এই ক্ষেত্রটি তৃতীয় পক্ষের মডিউল দ্বারা কাস্টম তৈরি বা যুক্ত হয়েছে? আমি মনে করি এটি অনুমোদিত তবে অন্যের পক্ষে নিয়ম নয়। আমি আপনাকে প্রিপ্রোসেস হুক দিয়ে শুরু করার পরামর্শ দিচ্ছি এবং এটি $variables['form']ভিতরে কী রয়েছে তা কেবল দেখুন ।

— নিকলান