سلام دوستان. به درخواست یکی از کاربران سایت مدرسه وردپرس، در این مقاله از آموزش وردپرس میخوام که ساخت پاپ آپ ثبت نام ajax را آموزش بدم.

ساخت پاپ آپ ثبت نام ajax

برای شروع آموزش، ابتدا می بایست قسمت پاپ آپ و فرم عضویت را بسازید. برای این کار فایل footer.php را باز کنید و در انتها و در جای مناسب کد زیر را قرار دهید:

در قطعه کد بالا، ما کدهای HTML مورد نیاز برای ساخت پاپ آپ و فرم عضویت را نوشتیم. حالا نوبت به استایل دهی به پاپ آپ هستش. پس حالا فایل style.css و یا rtl.css را باز کنید و کد زیر را در انتها فایل قرار دهید:

حالا باید پاپ آپ ثبت نام ajax به شکل زیر باشد:

پاپ آپ ثبت نام

 

ساخت پاپ آپ ثبت نام ajax – کدهای JS

در این مرحله از آموزش وردپرس ، باید کدهای js مربوط به باز و بسته شدن پاپ آپ را قرار دهیم. پس برای این کار نیاز به کدهای jQuery داریم. کد زیر را در داخل یک فایل js قرار بدهید. در غیر اینصورت در فایل footer.php هم می توانید قرار بدید (بعد از wp_footer() )

نکته: اگر کد js را داخل فایل footer.php قرار می دهید، فراموش نکنید که همه کد را داخل تگ <script></script> قرار دهید.

 

حالا فایل را ذخیره کنید و وارد بخش فهرست سایت شوید، یک منو جدید با عنوان “عضویت” ایجاد کنید و با لینک “#” و به این منو کلاس “register-link” بدهید و فهرست را ذخیره کنید.

فهرست ها در وردپرس

برای ساخت فهرست جدید در وردپرس مقاله ” فهرست ها در وردپرس ” را مطالعه کنید.

نکته: برای دیدن فیلد “کلاس های css ” در منو، بخش تنظیمات صفحه را باز کنید و تیک گزینه “کلاس css” را فعال کنید.

فهرست ها در وردپرس

 

ساخت پاپ آپ ثبت نام ایجکس – کدهای php

در این مرحله از آموزش وردپرس ، نوبت به کدهای php می باشد. در این قسمت فرم ثبت نام را تکمیل میکنیم و در انتهای مرحله فرم ثبت نام ajax خواهیم داشت.

مجدد یک فایل js ایجاد کنید و یا فایل footer.php را باز کنید و کد های js زیر را در فایل قرار دهید:

در کد بالا، ما ایجکس را صدا زدیم و با استفاده از اکشن signup_user این فرم را به php وصل می کنیم و مقادیر فرم را ارسال میکنیم.

حالا فایل functions.php را باز کنید و کد زیر را قرار دهید:

در کد بالا، مقادیر را از فرم دریافت کردیم و با استفاده از تابع wp_insert_user() کاربر را اضافه کردیم. همچنین با استفاده از تابع wp_mail() ایمیل عضویت هم برای کاربر ارسال خواهد شد.

 

نکته: برای عدم نمایش پاپ آپ ثبت نام ajax برای کاربرانی که وارد سایت شده هستند کافیست کد HTML پاپ آپ را داخل بلاک شرط زیر قرار دهید:

همچنین می توانید مقاله ” لاگین ajax در وردپرس ” را مطالعه کنید

آموزش امروز مدرسه وردپرس درباره ساخت پاپ آپ ثبت نام ajax هم به پایان رسید. امیدوارم لذت برده باشید.

موفق باشید

7 دیدگاه برای “ساخت پاپ آپ ثبت نام ajax

  • آرگان
    - ۱۶ خرداد , ۱۳۹۷

    سلام من خیلی اتفاقی از گوگل اومدم
    .
    با اجازتون من اینجارو برای دوستم تو واتس اپ میفرستم ،، به کارش میاد
    .
    ممنونم واقعا

  • لیمو
    - ۲۸ خرداد , ۱۳۹۷

    سلام

    جالبه برام از وقتی اومدم سایتتون ۱ ساعت گذشته و متوجه نشدم خخخخ

    هرچی میچرخم اینجا قسمت هایی که دوست دارم پیدا میکنم

    سایت خوبی پیدا کردم ولی سر سری سایتتونو دیدم حالا سایتتونو تو گوشیم سیو کردم وقتم ازاد شد میام دوباره میبینم

    ممنون

  • مصطفی نورزاده
    - ۲۹ آبان , ۱۳۹۷

    سلام
    ارور دارم از این بخش :

    برای چی؟

  • مصطفی نورزاده
    - ۲۹ آبان , ۱۳۹۷

    echo admin_url(“admin-ajax.php”)

  • سیروس
    - ۳۰ آبان , ۱۳۹۷

    سلام و خسته نباشید ، چون کدها رو کپی کردید کاراکتر “ را باید خودتون تایپ کنید مجدد

  • مصطفی نورزاده
    - ۱۶ آذر , ۱۳۹۷

    سلام . این کدها برای من کار نمیکنه . نه اروری دارم و نه کاربری ایجاد میکنه
    مشکل از چی میتونه باشه؟

    • سیروس
      - ۱۸ آذر , ۱۳۹۷

      لطفا بین کدهای جاوا اسکریپت دیباگر بزارید و بررسی کنید که اجرا میشن یا خیر

دیدگاه خود را بیان کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Captcha loading...