آموزش افزودن باکس ورود به وردپرس بدون افزونه و با کد آموزش افزودن باکس ورود به وردپرس بدون افزونه و با کد - جنوب وب ، آموزشگاه وردپرس

تخفیف 50% برای قالب listingpro به مدت محدودتوضیحات و خرید

تاریخ انتشار : مرداد ۱۳ام, ۱۳۹۷

برای قرار دادن باکس ورود به سایت افزونه های زیادی وجود دارد اما پیشنهاد ما استفاده از آموزش افزودن باکس ورود به وردپرس بدون افزونه است

افزودن باکس ورود به وردپرس

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

دلیلی اینکه بهتر است از کد و نه افزونه استفاده کنید این است که افزونه باعث ایجاد باگ و همچنین افت سرعت سایت شما خواهد شد

آموزش افزودن باکس ورود به وردپرس بدون افزونه :

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


<div class="logebox">
<div class="logobox">

ورود به سایت </div>
<?php
if ( is_user_logged_in() ) {
?>
<p>شما قبلا وارد شده اید</p>
<?php
} else {
?>
<form name="loginform" id="loginform" action="<?php bloginfo('url'); ?>/wp-login.php" method="post">
<input type="text" name="log" id="user_login" value="" tabindex="1" placeholder="نام کاربری">
<input type="password" name="pwd" id="user_pass" value="" tabindex="2" placeholder="کلمه عبور">
<input type="submit" name="wp-submit" class="comment-button" value="ورود" tabindex="3">
<input type="hidden" name="redirect_to" value="<?php bloginfo('url'); ?>">
<input type="hidden" name="testcookie" value="1">
</form>
<p style="text-align:center;margin-bottom: 0px;"><a href="<?php bloginfo('url'); ?>/wp-login.php?action=lostpassword">بازیابی کلمه عبور</a></p>
<?php } ?>

</div>

</div>

حالا وبسایت شما دارای باکس ورود می باشد اما این باکس ورود نیاز به زیباسازی خواهد داشت پس فایل style.css و یا rtl.css سایت خود را باز کرده و کد زیر را درون ان قرار دهید


.logebox {
background: #fff;
padding: 15px;
border-radius: 4px;
text-align: center;
line-height: 20px;
box-shadow: 0px 2px 2px #1111111a;
margin-bottom: 5px;
}
.logebox input {
border: 1px solid #f2f2f2;
margin: 10px 0px;
color: #cbcbcb;
}
.logebox .comment-button {
text-align: center;
margin-bottom: 10px;
width: 100%;
background: #d86a00;
border: 0px solid;
color: #fff;
padding: 15px;
margin-top: 0px;
}

با قرار دادن این کد ها یک باکس مشابه تصویر زیر برای وروددر وبسایت شما ایجاد خواهد شد

افزودن باکس ورود به وردپرس

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

پیشنهاد : فروش قالب فروشگاهی بامیلو برای ووکامرس

سعی میکنم اموزش های وردپرسی رو به زبان ساده برای شما عزیزان آماده کنم

نازنین فرهادی

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

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

تمامی حقوق این وبسایت متعلق به شرکت جنوب وب می باشد