Самописная форма регистрации на сайте WordPress пригодится многим веб-мастерам. Как вам известно, эта CMS предлагает для таких целей встроенный виджет регистрации wordpress, который всегда и везде не только одинаково выглядит, но и имеет несколько встроенных ссылок, которые, в принципе, никому не нужны.

Многие пользователи WordPress хотят убрать эти ссылки, но не знают, как это сделать. Можно установить wp плагин регистрации, который не имеет этих ссылок и имеет очень расширенный функционал, но этот вариант я оставляю на крайний случай.

Я покажу вам два примера, как сделать форму регистрации на wordpress своими руками и, естественно, без лишних ссылок. Кроме того, эта форма будет выглядеть нестандартно, так как стили к ней вы сможете менять тоже самостоятельно и независимо от существующего дизайна.

Форма регистрации

Многие не приветствуют то, как выглядит стандартная форма регистрации на wordpress, и я – не исключение. Ведь для того, чтобы вы смогли зайти на сайт, нужно сначала нажать кнопку «Войти», потом откроется новое окно, в котором вам необходимо ввести свой логин и пароль, и только после этого вы попадете на страницу своего профиля или в консоль блога.

Морока, в общем. Да и выглядит страница авторизации некрасиво, хотя я в своей статье Работа плагина BM Custom Login писал, как можно улучшить ее юзабилити.

Впрочем, всем известно, что плагины нагружают блог, увеличивают количество запросов к базе данных, ets… Поэтому предлагаю обойтись сегодня без плагинов – будем работать с кодом.

Чтобы у меня на сайте появилась своя форма регистрации для wordpress, я использовал код от стандартного виджета регистрации, только немного изменил некоторые его функции. Вот как теперь выглядит мой виджет для регистрации и авторизации на сайте/блоге:

Форма регистрации без плагина

Разница чувствуется, не так ли? Так вот, чтобы у вас появилась такая же форма регистрации wordpress, просто вставьте код, который вы видите ниже, в текстовый виджет сайдбара, ну или в то место основного шаблона index.php вашей темы, где вы хотите видеть эту форму.

Кнопки соцсетей я добавил другим виджетом, и к форме регистрации они отношения не имеют. Хотя потом я перенес этот код в код формы регистрации. Вот он:


<?php

// ========================================================

// User Login Form

// ========================================================

function serpentsoft_create_login($just_login = false) {

   global $user_ID, $user_identity, $user_level;

   if($user_ID):

       if($just_login == false): ?>

           <div id="logged-in">

               <p class="welcome"><?php _e('Добро пожаловать', 'serpentsoft'); ?><strong><?php echo $user_identity; ?></strong> .</p>

               <span class="avatar-container"><?php echo get_avatar($user_ID, $size = '65'); ?></span>

               <ul class="icons-ul">

                   <li><i class="icon-li icon-caret-right"></i><a href="<?php echo esc_url( home_url('/') ); ?>wp-admin/"><?php _e('Управление', 'serpentsoft'); ?></a></li>

                   <li><i class="icon-li icon-caret-right"></i><a href="<?php echo esc_url( home_url('/') ); ?>wp-admin/profile.php"><?php _e('Ваш профиль', 'serpentsoft'); ?></a></li>

                   <li><i class="icon-li icon-caret-right"></i><a href="<?php echo esc_url( wp_logout_url( get_permalink() ) ); ?>"><?php _e('Выйти', 'serpentsoft'); ?></a></li>

               </ul>

               <ul class="author-personal-info social-networks clearfix">

                   <?php serpentsoft_login_user_social_icons_list($user_ID); ?>

               </ul>

           </div>

   <?php endif; // Just Login

   else: // else UserID ?>

       <div id="frmLogin">

           <form action="<?php echo esc_url( home_url('/') ); ?>wp-login.php" method="post" class="login-form">

               <!-- UserName Input -->

               <div class="input-prepend input-block-level">

                   <span class="add-on"><i class="icon-envelope"></i></span>

                   <input id="log" name="log" class="span10" type="text" placeholder="User Name" required="required" value="<?php _e('Имя пользователя', 'serpentsoft'); ?>"

                           onfocus="if(this.value == '<?php _e('UserName', 'serpentsoft'); ?>') { this.value = ''; }" 

                          onblur="if(this.value == '') { this.value = '<?php _e('UserName', 'serpentsoft'); ?>'; }" size="33" />

               </div>

               <!-- Password Input -->

               <div class="input-prepend input-block-level">

                  <span class="add-on"><i class="icon-key"></i></span>

                   <input id="pwd" name="pwd" class="span10" type="password" placeholder="Password" required="required" value="<?php _e('Пароль', 'serpentsoft'); ?>" 

                           onfocus="if(this.value == '<?php _e('Password', 'serpentsoft'); ?>') { this.value = ''; }"

                           onblur="if(this.value == '') { this.value = '<?php _e('Password', 'serpentsoft'); ?>'; }" size="33" />

                </div>

               <button type="submit" name="submit" class="btn-theme" value="<?php _e('Log in', 'serpentsoft'); ?>"><?php _e('Войти', 'serpentsoft'); ?></button>

               <input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" />

               <label class="checkbox" for="rememberme">

                   <input name="rememberme" id="rememberme" type="checkbox" /><?php _e('Запомнить меня', 'serpentsoft'); ?>

               </label>

           </form>

           <ul class="login-lost-pass icons-ul">

       <?php if(get_option('users_can_register')) : wp_register('<li><i class="icon-li icon-circle"></i>', '</li>', true); endif; ?>

               <li><i class="icon-li icon-circle"></i><a href="<?php echo esc_url( home_url('/') ); ?>wp-login.php?action=lostpassword"><?php _e('Забыли пароль?', 'serpentsoft'); ?></a></li>

           </ul>

       </div>

   <?php endif; // UserID ?> 

Есть еще одно решение, чтобы самописная регистрация в wordpress появилась на страницах вашего блога – оно намного проще в смысле количества строчек php кода. Вот оно:


<div> <?php

               global $user_ID, $user_identity;

               get_currentuserinfo();

               if (!$user_ID):

           ?>

         <form name="loginform" id="autoriz" action="<?php echo get_settings('siteurl'); ?>/wp-login.php" method="post">

             <div class="left">

                 <input type="text" name="log" placeholder="Логин" value="" id="login" />

             </div> <div>

                 <input type="password" name="pwd" placeholder="Пароль" value="" id="password" />

                 <input type="submit" name="submit" value="Войти" id="enter" /><br/>

             </div> <div>

                 <input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" />

                  <a href="<?php bloginfo('wpurl'); ?>/wp-login.php?action=lostpassword">Забыли пароль?</a>

                 <a href="<?php bloginfo('wpurl'); ?>/wp-login.php?action=register">Регистрация</a> 

             </div> </form> 

           <?php else: ?>

           <h5 class="smile">Добро пожаловать, <?php echo $user_identity; ?>.</h5>

           <?php endif; ?> 

           <?php if (current_user_can('level_10')){ ?><br/>

             <div class="left">

                 <a href="<?php bloginfo('url'); ?>/wp-admin/">Администрирование</a>

             </div>

             <div class="right" style="text-align:right">

                 <?php wp_loginout(); ?>

             </div> <?php } ?> </div>

Этот виджет выглядит вот так:

Форма регистрации без плагина

Даже без применения стилей css виджет выглядит очень симпатично – строго и функционально, ничего лишнего. Стили вы сможете добавить сами – я специально не проставлял классы и id для div-ов кода.

А если вы все-таки хотите установить плагин регистрация вордпресс, то я вам советую перечитать еще раз вот эту статью — Регистрация пользователей в WordPress. Пользуйтесь на здоровье, и пусть у вас все получится! До встреч!