طراح 24

دامنه طراح 24 با آدرس اینترنتی tarah24.com به فروش می رسد.
بالاترین پیشنهاد تماس با شماره زیر:
قالب وردپرس شرکتی کوادکوپتر
خانه / مقالات آموزشی / آموزش وردپرس / آموزش ساخت صفحه لاگین وردپرس با php

آموزش ساخت صفحه لاگین وردپرس با php

آموزش ساخت صفحه لاگین وردپرس با php

ساخت صفحه لاگین وردپرس روش های متعددی دارد که امروز قصد داریم تا یکی از ساده ترین راه های ساخت صفحه ورود با php را به همراهان طراح ۲۴ آموزش دهیم. در این آموزش کدهای html و css و php را بصورت آماده و همراه با توضیحات قرار میدهیم. با استفاده از این متد قادر خواهید بود در هر سایتی صفحه لاگین را بدون مشکل بسازید.
ابتدا باید یک دکمه در سایت خود ایجاد کنید. بهتر است دکمه ورود به سایت را در قسمت هدر قرار دهید. برای اینکار میتوانید از منوها نیز استفاده کنید و دکمه را با ul و li ایجا کنید که ما در این آموزش از تگ div و a استفاده کرده ایم. نتیجه نهایی کار، عکس زیر میباشد که با کلیک بر روی دکمه ضربدر صفحه بسته میشود و مجددا برای نمایش آن باید بر روی دکمه حساب کاربری کلیک نمایید.

آموزش ساخت صفحه لاگین وردپرس با php

کدهای html زیر را کپی کنید و یا خودتان مانند کدهای زیر یک دکمه بسازید.

کدهای css زیر بصورت کاملا حرفه ای نوشته شده و از افکت های بینظیر و بسیار جذاب جهت ایجاد دکمه حساب کاریری و یا همان دکمه ورود به سایت استفاده شده است:
خب تا اینجای کار که توضیحات چندانی لازم ندارد چون کدها کاملا مشخص هستند و یک div با آیدی login-btn استفاده شده که در این div نیز تگ a نوشته شده است. اما نوشتن کد php برای صفحه لاگین در وردپرس کمی پیچیده تر است و ما سعی کرده ایم ساده ترین راه ممکن را در این مقاله قرار دهیم تا شما براحتی یک صفحه ورود برای خودتان ایجاد کنید.
ابتدا یک فایل php با نام مثلا login-box.php یا هر چیزی که شبیه به این اسم باشد بسازید. سپس این فایل را با برنامه ای مانند ++Notepad باز کنید و کدهای زیر را در آن کپی نمایید:
در این کد از یک div برای ایجاد هدر صفحه ورود وردپرس استفاده شده که در خط اول مشاهده میکنید. چون این صفحه بصورت لایت باکس میباشد و زمانی که کاربران بر روی دکمه حساب کاربری کلیک میکنند، صفحه کوچکی در صفحه اصلی سایت باز میشود، از یک تگ i که مخصوص fontawesome است استفاده کرده ایم که حجم کمتری نسبت به عکس دارد. اگر از این فونت ها استفاده نمی کنید میتوانید یک تگ img به جای آن بگذارید، اما باید استایل عکس را در کدهای css به جای کدهای تگ i قرار دهید.
به یاد داشته باشید که حتما id، name و class هایی که در کد php نوشته شده را تغییر ندهید که به مشکل برمی خورید.
حالا باید این فایل php را در یکی از فایل هایی که در تمام قسمت های سایت وجود دارد include کنیم. بهترین فایل برای این کار header.php میباشد که میتوانید آن را بعد از تگ body قرار دهید. برای این کار از کد زیر استفاده نمایید:
شما میتوانید فایل login-box.php را در پوشه ای با نام inc قرار دهید یا مستقیما آن را در پوشه قالب ایجاد کنید. در کد بالا ما فایل را درپوشه ای به نام inc ساخته ایم.
تا اینجای کار کدنویسی php تمام شده و حالا باید به کدهایی که نوشته ایم استایل بدهیم. اگر در همین حالت سایت خود را رفرش کنید، هدر سایتتان بهم ریخته می باشد، اما نگران نباشید، اگر کدهای css زیر را در فایل استایل خودتان کپی کنید مشکل حل خواهد شد:
حالا برای اینکه کد تکمیل شود باید کدهای جی کوئوری صفحه لاگین وردپرس را در فایل js قرار دهید. برای اینکار یک فایل js با نام main.js ایجاد کنید و آن را در پوشه js قالب خودتان ایجاد کنید و کدها را به آن منتقل نمایید:
برای انجام خدمات طراحی سایت، سئو و امنیت وردپرس با شماره زیر تماس بگیرید:
شماره موبایل: ۰۹۱۰۷۸۱۴۷۰۱
پست الکترونیکی: saeedimani06@gmail.com

درباره ی سعید ایمانی

دیدگاهتان را بنویسید

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

14 − 9 =