كيفية انشاء صفحة البروفايل في ووردبريس

انشاء صفحة البروفايل في ووردبريس شيء مهم للراغبين باجبار المستخدمين للتسجيل كعضو في موقع ووردبريس. لذلك سوف نتعلم في هذا الكورس كيفية انشاء صفحة البروفايل بواسطة اضافة ووردبريس وكذلك باستخدام أكواد php.

سوف نحتاج قبل البدء في انشاء صفحة البروفايل في ووردبريس الى قراءة الخطوات التالية:

1. تنصيب اضافة ACF Custom field في موقع ووردبريس
2. انشاء ملف member-account.php في مجلد ثيم موقع ووردبريس
3. انشاء صفحة في موقع ووردبريس بإسم User Profile
4. انشاء ملف author.php في مجلد ثيم موقع ووردبريس

خطوات انشاء صفحة البروفايل في ووردبريس

1- تنصيب اضافة ACF Custom field في موقع ووردبريس

الغاية من هذه الاضافة انشاء الحقول المخصصة التي سنضيفها الى صفحة بروفايل المستخدم لكي يتمكن من ادخال بياناته وكذلك انشاء استمارة ( فورم ) ليتمكن المستخدم من تعبئة البيانات لاحقاً بعد تسجيله في الموقع.

اذهب الأن الى صفحة الاضافة في موقعك وقم بانشاء حقول مخصصة جديدة اعطها أي مسمى تريد على سبيل المثال user profile . وقم بانشاء حقول مخصصة وفقاً للبيانات التي تريد من العضو تعبئتها لاحقاً. ولاتنسى أن تقوم بتخصيص الحقول المخصصة الى user form كما هو موضح في الصورة التالية.

انشاء ملف member-account.php في مجلد ثيم موقع ووردبريس

تحتاج الآن الى انشاء ملف لصفحة المستخدم ( صفحة البروفايل في موقع ووردبريسس) كي تقوم باظهار بيانات الحقول المخصصة التي قام الزائر بتعبئتها لاحقاً في الفورم . في هذا الملف سنحتاج الآن الى كتابة بعض أكواد الـ php ولكن, هنا سوف أقوم بكتابة الأكواد بناءاًً على ما قمت انا بانشاءه من حقول مخصصة وانت تستطيع التعديل عليها اذا قمت بقراءة اضافة الحقول المخصصة ACF ووردبريس البرنامج التعليمي الكامل

 <?php /* * Template Name: Member Account */ ?>
 
<?php get_header(); ?>
<div class="container"> 
    <?php if ($attributes['show_title']) : ?>
        <h2><?php _e('Sign In', 'personalize-login'); ?></h2>
    <?php endif;  
    $current_user = wp_get_current_user(get_current_user_id());
    $user_info    = get_userdata($current_user->ID);
    $user_meta    = get_user_meta(get_current_user_id(), false);
    $username     = $user_info->user_login;
    $first_name   = $user_info->first_name;
    $last_name    = $user_info->last_name; 
    $birthday    = $user_info->birthday;
    $curauth = get_userdata(1);
    $description    = $user_info->description;
    $user_adresse    = $user_info->user_adresse;
    ?>



            <h1>  <?php echo $first_name .  '&nbsp;' . $last_name; ?>  </h1>
            <?php the_field('nationality', 'user_' . $current_user->ID); ?> | 
            <?php the_field('gender', 'user_' . $current_user->ID); ?>  
            <p> عضو في الموقع من تاريخ      : <?php echo $user_info->user_registered; ?> </p>
            <p><?php echo $description; ?></p>
                        <ul>
                          <li><b><?php _e('الايميل', 'personalize-login'); ?></b>: <?php echo $user_info->user_email; ?></li>
                          <li><b><?php _e('  العنوان  ', 'personalize-login'); ?></b>: <?php echo $user_adresse; ?></li>
                          <li><b><?php _e('الاسم الظاهر ', 'personalize-login'); ?></b>: <?php echo $user_info->display_name; ?></li>
                          <li><b><?php _e('   تاريخ الميلاد  ', 'personalize-login'); ?></b>: <?php $current_user = wp_get_current_user(); ?>  
                            <?php the_field('birthday', 'user_' . $current_user->ID); ?>   </li>
                          <li><b><?php _e(' الدرجة الدراسية الحالية', 'personalize-login'); ?></b> : <?php the_field('study_degree', 'user_' . $current_user->ID); ?></li>
                          <li><b><?php _e(' جنسيتك ', 'personalize-login'); ?></b>:  <?php the_field('nationality', 'user_' . $current_user->ID); ?></li>
                        </ul>

</div>
<?php get_footer(); ?>

لقد قمت في الكود السابق باظهار البيانات التي سيقوم المستخدم بتعبئتها بعد أن قام بالتسجيل في موقع ووردبريس.

انشاء صفحة في موقع ووردبريس بإسم User Profile

الآن في مجلد الثيم قم بانشاء هذه الصفحة واذهب الى خصائص هذه الصفحة, وقم بتعيين نموذج الصفحة الذي تراه باسم Member Account. الآن اصبح لكل مستخدم صفحة خاصة تسمى صفحة المستخدم الشخصية.

انشاء نموذج التحكم بالبيانات في صفحة User Profile

الآن قمنا بتجهيز كل شيء ماعدا أنّ المستخدم غير قادر بعد على ارسال النموذج أو التحكم ببياناته, لذلك سوف نقوم باضافة كود بسيط الى الصفحة السابقة member-account.php قبل علامة اغلاق </div> الاخيرة. ليصبح لدينا الكود الكامل

 <?php /* * Template Name: Member Account */ ?>
 
<?php get_header(); ?>
<div class="container"> 
    <?php if ($attributes['show_title']) : ?>
        <h2><?php _e('Sign In', 'personalize-login'); ?></h2>
    <?php endif;  
    $current_user = wp_get_current_user(get_current_user_id());
    $user_info    = get_userdata($current_user->ID);
    $user_meta    = get_user_meta(get_current_user_id(), false);
    $username     = $user_info->user_login;
    $first_name   = $user_info->first_name;
    $last_name    = $user_info->last_name; 
    $birthday    = $user_info->birthday;
    $curauth = get_userdata(1);
    $description    = $user_info->description;
    $user_adresse    = $user_info->user_adresse;
    ?>



            <h1>  <?php echo $first_name .  '&nbsp;' . $last_name; ?>  </h1>
            <?php the_field('nationality', 'user_' . $current_user->ID); ?> | 
            <?php the_field('gender', 'user_' . $current_user->ID); ?>  
            <p> عضو في الموقع من تاريخ      : <?php echo $user_info->user_registered; ?> </p>
            <p><?php echo $description; ?></p>
                        <ul>
                          <li><b><?php _e('الايميل', 'personalize-login'); ?></b>: <?php echo $user_info->user_email; ?></li>
                          <li><b><?php _e('  العنوان  ', 'personalize-login'); ?></b>: <?php echo $user_adresse; ?></li>
                          <li><b><?php _e('الاسم الظاهر ', 'personalize-login'); ?></b>: <?php echo $user_info->display_name; ?></li>
                          <li><b><?php _e('   تاريخ الميلاد  ', 'personalize-login'); ?></b>: <?php $current_user = wp_get_current_user(); ?>  
                            <?php the_field('birthday', 'user_' . $current_user->ID); ?>   </li>
                          <li><b><?php _e(' الدرجة الدراسية الحالية', 'personalize-login'); ?></b> : <?php the_field('study_degree', 'user_' . $current_user->ID); ?></li>
                          <li><b><?php _e(' جنسيتك ', 'personalize-login'); ?></b>:  <?php the_field('nationality', 'user_' . $current_user->ID); ?></li>
                        </ul>

</div>
 
            <h4>تستطيع الآن تعديل كل معلوماتك من النموذج </h4>
            <?php acf_form_head();
            if (is_user_logged_in()) {
            $user = wp_get_current_user();
            $options = array(
            'field_groups' => ['43349'],
            'form_attributes' => array(
            'method' => 'POST',
             ),
            'html_before_fields' => sprintf(
            '<input type="hidden" name="action" value="adaptiveweb_save_profile_form">
            <input type="hidden" name="user_id" value="user_%s">',
            $user->ID
            ),
            'post_id' => "user_{$user->ID}",
            'form' => true,
            'html_submit_button' => '<button type="submit" class="btn btn-dark" value="Update Profile">تعديل الملف الشخصي</button>',
            );
            acf_form($options); 
            } else {
            ?>
              <?php 
              }?>
<?php get_footer(); ?>

في السطر التالي يوجد الرقم 43349 وهو معرّف الحقول المخصصة التي قمت بانشائها في اضافة ووردبريس . انظر الصورة لكي تعرف أكثر من أين ستحصل على هذا الرقم.

        'field_groups' => ['43349'], 

انشاء ملف author.php في مجلد ثيم موقع ووردبريس

الآن تحتاج الى انشاء صفحة لك كأدمن من متابعة المعلومات التي سيقوم المستخدمون لديك في موقع ووربريس بارسالها بدون الرجوع لك كأدمن الى لوحة التحكم في ووردبريس .

بعد أن قمت بانشاء الملف السابق author.php قم بلصق الكود التالي وكما قلت سابقاً هنا سوف أقوم بكتابة الأكواد بناءاًً على ما قمت انا بانشاءه من حقول مخصصة وانت تستطيع التعديل عليها اذا قمت بقراءة اضافة الحقول المخصصة ACF ووردبريس البرنامج التعليمي الكامل.

<?php get_header(); ?>

    <?php
    $curauth = (isset($_GET['author_name'])) ? get_user_by('slug', $author_name) : get_userdata(intval($author));
    $description    = $user_info->description;
    $birthday=date('Y-m-d');
    ?>
<div class="container">

<h2> <?php echo $curauth->first_name; ?> <?php echo $curauth->last_name; ?>  </h2>
  <p> <?php the_field('nationality', 'user_' . $current_user->ID); ?> الجنسية        /  
  الجنس     <?php echo $curauth->gender; ?>   </p> 
          <p><?php echo $curauth->description; ?>  </p> 
                  <ul>
                      <li> <b>   الجنس   </b>:    <?php echo $curauth->gender; ?></li>
                      <li><b>   العنوان    </b>: <?php echo $curauth->user_adresse; ?>  </li>
                       
                       <li><b> الايميل    </b>:  <?php echo $curauth->user_email; ?></li>
                       <li><b> الاسم الظاهر  </b>:  <?php echo $curauth->display_name; ?></li>
                      <li><b>   تاريخ الميلاد   </b>: <?php $current_user = wp_get_current_user(); ?>   
                               <?php echo $curauth->birthday; ?>  </li>
                  <li><b>  الدرجة الدراسية الحالية    </b> :  <?php echo $curauth->study_degree; ?></li>
                  
                  <li><b>  جنسيتك     </b>:   <?php echo $curauth->nationality; ?></li>
           
                  </ul>
</div>
<?php get_footer();?>

خلاصة شرح انشاء صفحة البروفايل في ووردبريس

موضوع انشاء صفحة البروفايل في ووردبريس يحتاج الى خبرة بسيطة بكيفية التعامل مع اكواد php وكذلك التعامل مع اضافة ACF في موقع ووردبريس.

روابط مفيدة :

• شرح اضافة ACF
• شرح user Roles and Capabilities
• كيفية انشاء نموذج تسجيل في ووردبريس