شما اینجا هستید

آموزش صفحه ورود
ارسال شده در ش, 07/22/1396 - 14:09 -- توسط mehrdadk69

ساخت صفحه ورود کابران

قطعا یکی از صفحاتی که در وب سایت های دروپالی خودمون نگاه ویژه ای بهش داریم ، صفحه مربوط به ورود کاربران ، ثبت نام و درخواست بازیابی رمز عبور هستش. دراین آموزش قصد داریم تا یک صفحه ورود دروپالی زیبا رو طراحی کنیم.پیشنهاد میکنم برای انتخاب یک قالب یا تم برای این صفحه از سایت codepen یا از سایت bootsnipp استفاده کنید.

قطعا یکی از صفحاتی که در وب سایت های دروپالی خودمون نگاه ویژه ای بهش داریم ، صفحه مربوط به ورود کاربران ، ثبت نام و درخواست بازیابی رمز عبور هستش.
دراین آموزش قصد داریم تا یک صفحه ورود دروپالی زیبا رو طراحی کنیم.پیشنهاد میکنم برای انتخاب یک قالب یا تم برای این صفحه از سایت  codepen   یا از سایت  bootsnipp  استفاده کنید.
قالب دانلود شده ما برای صفحه ورود (دانلود قالب) ، دارای فایل های index.html  و  style.ss   هستش/
ابتدا باید فایل style.css رو در سایت فراخوانی می کنیم/ برای این کار فایل Info رو باز و کد زیر به اون اضافه میکنیم :

stylesheets[all][] = css/style.css

نکته : بعد از هر تغییری در فایل info باید کش سایت رو خالی کنیم.
خوب تا این جا فقط یک فایل css فراخوانی کردیم.در ادامه باید فایل index.html رو در تم خودمون جایگذاری کنیم.
آدرس صفحه ورود کاربران در دروپال بصورت user/login  هستش.همونطور که در آموزش نحوه نام گذاری فایل ها گفته شده بود یک فایل با نام page—user—login.tpl.php ایجاد میکنیم.
این صفحه دقیقا میتونه شامل هدر ، فوتر و هر بخش دیگه ای از صفحه اصلی سایت یا سایر صفحات سایت باشه.اما مهم ترین نکته فراخوانی ناحیه content در این صفحه هستش.پس کد زیر حتما باید در این صفحه وجود داشته باشه : 

<?php print render($page['content']); ?>

در ادامه میرسیم به قراردادن کدهای مربوط به فرم های ورود ! یک فایل با نام user-login.tpl.php ایجاد و کدهای index.html رو داخل اون کپی میکنیم.
پس فایل ما بصورت زیر خواهد شد :
 

<div class="container">
    <div class="row">
        <div class="col-sm-6 col-md-4 col-md-offset-4">
            <h1 class="text-center login-title">Sign in</h1>
            <div class="account-wall">
                <img class="profile-img" src="iamges/user.png"
                    alt="">
                 <h2><?php print render($intro_text); ?></h2>
				<?php
				if(user_is_anonymous()) {  
					$form = drupal_get_form('user_login_block');
						print drupal_render($form);
				}
			?>
                <a href="#" class="pull-right need-help">Need help? </a><span class="clearfix"></span>
                
            </div>
            <a href="<?php print base_path(); ?>user/register"> class="text-center new-account">Create an account </a>
        </div>
    </div>
</div>

خوب تا اینجا کار نهایی شده و اگر وارد صفحه user/login بشیم خواهیم دید که هیچ چیز تغییر نکرده !!! اشکال کار کجاست ؟
کاری که تا این لحظه انجام شده هیچ ایرادی نداره ، فقط چون ما داریم بلوک مربوط به فرم لاگین رو که در خود هسته هست  تغییر میدیم ، باید در فایل template.php این صفحه رو معرفی کنیم تا فرم ما در اونجا نمایش داده بشه.
 

<?php
function THEME_NAME_theme() {
  $items = array();
  // create custom user-login.tpl.php
  $items['user_login'] = array(
  'render element' => 'form',
  'path' => drupal_get_path('theme', 'THEME_NAME') . '/template',
  'template' => 'user-login',
  'preprocess functions' => array(
  'nrghost_preprocess_user_login'
  ),
 );
 
return $items;
}
?>

تنها کار باقی مانده ، خالی کردن کش هست که باید انجام بدیم تا تغییرات رو ببینیم.

برای صفحات درخواست گذرواژه و ثبت نام نیز دقیقا مانند همین مراحل انجام خواهد شد.
فایل page--user--register.tpl.php , page--user--password.tpl.php دقیقا مشابه page--user--login.tpl.php هستش.
تنها تغییرات بصورت زیر خواهد بود.
این کد مربوط به فایل template.php می باشد که برای هر سه بخش ورود ، ثبت نام و بازیابی رمزعبور قرارداده شده :

<?php

function THEME_NAME_theme() {
  $items = array();
  // create custom user-login.tpl.php
  $items['user_login'] = array(
  'render element' => 'form',
  'path' => drupal_get_path('theme', 'THEME_NAME') . '/template',
  'template' => 'user-login',
  'preprocess functions' => array(
  'nrghost_preprocess_user_login'
  ),
 );
// create custom user-register-form.tpl.php
  $items['user_register_form'] = array(
    'render element' => 'form',
    'path' => drupal_get_path('theme', 'THEME_NAME') . '/template',
    'template' => 'user-register-form',
    'preprocess functions' => array(
      'nrghost_preprocess_user_register_form'
    ),
  );
 // create custom user-pass.tpl.php
  $items['user_pass'] = array(
    'render element' => 'form',
    'path' => drupal_get_path('theme', 'THEME_NAME') . '/template',
    'template' => 'user-pass',
    'preprocess functions' => array(
      'nrghost_preprocess_user_pass'
    ),
  );

return $items;
}



?>

در فایل های user-register-form.tpl.php ، user-pass.tpl.php کدها بصورت زیر خواهد بود :

<div class="container">
    <div class="row">
        <div class="col-sm-6 col-md-4 col-md-offset-4">
            <h1 class="text-center login-title">Sign in</h1>
            <div class="account-wall">
                <img class="profile-img" src="iamges/user.png"
                    alt="">
                 <h2><?php print render($intro_text); ?></h2>
				<?php
          print drupal_render_children($form);
        ?>
                
               
            </div>
          
        </div>
    </div>
</div>

 

دسته بندی: 

دیدگاه‌ها

صفحه‌ها

افزودن دیدگاه جدید

دیدگاه

  • تگ‌های HTML مجاز: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <img>
  • خطوط و پاراگراف‌ها بطور خودکار اعمال می‌شوند.
  • نشانی صفحه‌ها وب و پست الکترونیک بصورت خودکار به پیوند تبدیل می‌شوند.

Plain text

  • تگ‌های HTML مجاز نیستند.
  • نشانی صفحه‌ها وب و پست الکترونیک بصورت خودکار به پیوند تبدیل می‌شوند.
  • خطوط و پاراگراف‌ها بطور خودکار اعمال می‌شوند.
كد امنيتي
این پرسش برای جلوگیری از ارسال اسپمهای اتوماتیک است.