Форма авторизации - system.auth.form

Этот компонент предназначен для размещения формы авторизации в любом месте шаблона сайта: в шапке сайта, в левой или правой колонке. Чтобы пользователю не надо было переходить на страницу авторизации, а он мог авторизоваться на любой странице сайта. Пример вызова компонента:

$APPLICATION->IncludeComponent(
"bitrix:system.auth.form",
"",
array(
"FORGOT_PASSWORD_URL" => "/auth/",    // Страница забытого пароля
"PROFILE_URL" => "/auth/profile.php", // Страница профиля
"REGISTER_URL" => "/auth/",           // Страница регистрации
"SHOW_ERRORS" => "Y",                 // Показывать ошибки
)
);

Cкопируем шаблон компонента и оформим под наш дизайн:

• Откуда: bitrix/components/bitrix/system.auth.form/templates/.default
• Куда: local/templates/название_сайта/components/bitrix/system.auth.form/.default

После внесения изменений шаблон имеет вид:

<?
/*
* Файл local/templates/название_сайта/components/bitrix/system.auth.form/.default/template.php
*/
if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true) die();
CJSCore::Init();
?>
<div class="system-auth-form">
<h3><?= GetMessage('SYS_AUTH_FORM_TITLE'); /* заголовок формы */ ?></h3>
<?
// сообщения об ошибках при заполнении формы
if ($arResult['SHOW_ERRORS'] == 'Y' && $arResult['ERROR']) {
ShowMessage($arResult['ERROR_MESSAGE']);
}
?>
<? if ($arResult["FORM_TYPE"] == "login"): /* пользователь не авторизован, показываем форму авторизации */ ?>
<form name="system_auth_form<?= $arResult["RND"]; ?>" method="post" target="_top" action="<?= $arResult["AUTH_URL"]; ?>">
<? if ($arResult["BACKURL"] <> ''): ?>
<input type="hidden" name="backurl" value="<?= $arResult["BACKURL"]; ?>" />
<? endif; ?>
<? foreach ($arResult["POST"] as $key => $value): /* передача полученных POST-параметров */ ?>
<input type="hidden" name="<?= $key; ?>" value="<?= $value; ?>" />
<? endforeach; ?>
<input type="hidden" name="AUTH_FORM" value="Y" />
<input type="hidden" name="TYPE" value="AUTH" />
<div>
<span><?= GetMessage('SYS_AUTH_FORM_LOGIN'); /* поле логин */ ?> <i>*</i> <!-- поле обязательно для заполнения --></span>
<span><input type="text" name="USER_LOGIN" maxlength="50" value="" /></span>
</div>
<script>
BX.ready(function() {
var loginCookie = BX.getCookie("<?= CUtil::JSEscape($arResult["~LOGIN_COOKIE_NAME"]); ?>");
if (loginCookie) {
var form = document.forms["system_auth_form<?= $arResult["RND"]; ?>"];
var loginInput = form.elements["USER_LOGIN"];
loginInput.value = loginCookie;
}
});
</script>
<div>
<span><?= GetMessage('SYS_AUTH_FORM_PASSWORD'); /* поле пароль */ ?> <i>*</i> <!-- поле обязательно для заполнения --></span>
<span><input type="password" name="USER_PASSWORD" maxlength="50" autocomplete="off" /></span>
</div>
<? if ($arResult["SECURE_AUTH"]): /* безопасная авторизация (зашифрованная передача пароля пользователя) */ ?>
<!-- код удален -->
<? endif?>
<? if ($arResult["CAPTCHA_CODE"]): /* если используется CAPTCHA */ ?>
<div class="captcha">
<h4><? echo GetMessage('SYS_AUTH_FORM_CAPTCHA_TITLE'); /* Защита от роботов */ ?></h4>
<input type="hidden" name="captcha_sid" value="<?= $arResult["CAPTCHA_CODE"]; ?>" />
<img src="/bitrix/tools/captcha.php?captcha_sid=<?= $arResult["CAPTCHA_CODE"]; ?>" width="180" height="40" alt="CAPTCHA" />
<span><?= GetMessage('SYS_AUTH_FORM_CAPTCHA_TEXT'); /* введите код с картинки */ ?> <i>*</i> <!-- поле обязательно для заполнения --></span>
<span><input type="text" name="captcha_word" maxlength="50" value="" /></span>
</div>
<? endif; ?>
<? if ($arResult["STORE_PASSWORD"] == "Y"): /* checkbox «Запомнить меня» */ ?>
<div class="remember">
<input type="checkbox" id="USER_REMEMBER_frm" name="USER_REMEMBER" value="Y" />
<label for="USER_REMEMBER_frm"><?= GetMessage('SYS_AUTH_FORM_REMEMBER'); ?></label>
</div>
<? endif; ?>
<div class="submit">
<input type="submit" name="Login" value="<?= GetMessage('SYS_AUTH_FORM_SUBMIT_LOGIN'); /* кнопка отправки формы */ ?>" />
</div>
</form>
<? if ($arResult["NEW_USER_REGISTRATION"] == "Y"): /* ссылка на страницу регистрации */ ?>
<p><a href="<?= $arResult["AUTH_REGISTER_URL"]; ?>" rel="nofollow"><?= GetMessage('SYS_AUTH_FORM_REG_USER'); ?></a></p>
<? endif?>
<p><a href="<?= $arResult["AUTH_FORGOT_PASSWORD_URL"]; ?>" rel="nofollow"><?= GetMessage('SYS_AUTH_FORM_FORGOT'); /* ссылка на страницу восстановления пароля */ ?></a></p>
<? else: /* пользователь авторизован, показываем имя и логин пользователя, ссылку на профиль и кнопку выхода */ ?>
<p><?= $arResult["USER_NAME"]; /* имя пользователя */ ?></p>
<p><?= $arResult["USER_LOGIN"]; /* логин пользователя */ ?></p>
<p><a href="<?= $arResult["PROFILE_URL"]; ?>"><?= GetMessage('SYS_AUTH_FORM_PROFILE'); /* ссылка на профиль */ ?></a></p>
<form action="<?= $arResult["AUTH_URL"]; ?>">
<? foreach ($arResult["GET"] as $key => $value): /* передача полученных GET-параметров */ ?>
<input type="hidden" name="<?= $key; ?>" value="<?= $value; ?>" />
<? endforeach; ?>
<input type="hidden" name="logout" value="yes" />
<div class="submit">
<input type="submit" name="logout_butt" value="<?= GetMessage('SYS_AUTH_FORM_SUBMIT_LOGOUT'); /* кнопка отправки формы */ ?>" />
</div>
</form>
<? endif; ?>
</div>

<?
/*
 * Файл local/templates/название_сайта/components/bitrix/system.auth.form/.default/lang/ru/template.php
 */
$MESS['SYS_AUTH_FORM_TITLE']          = 'Личный кабинет';
// авторизация теперь по e-mail
$MESS['SYS_AUTH_FORM_LOGIN']          = 'E-mail';
$MESS['SYS_AUTH_FORM_PASSWORD']       = 'Пароль';
$MESS['SYS_AUTH_FORM_REMEMBER']       = 'Запомнить меня';
$MESS['SYS_AUTH_FORM_CAPTCHA_TITLE']  = 'Защита от роботов';
$MESS['SYS_AUTH_FORM_CAPTCHA_TEXT']   = 'Введите символы с картинки';
$MESS['SYS_AUTH_FORM_SUBMIT_LOGIN']   = 'Войти';
$MESS['SYS_AUTH_FORM_SUBMIT_LOGOUT']  = 'Выйти';
$MESS['SYS_AUTH_FORM_REG_USER']       = 'Зарегистрироваться';
$MESS['SYS_AUTH_FORM_FORGOT']         = 'Забыли пароль?';
$MESS['SYS_AUTH_FORM_PROFILE']        = 'Мой профиль';

/*
* Файл local/templates/название_сайта/components/bitrix/system.auth.form/.default/style.css
*/
.system-auth-form {
margin-top: 15px;
}
.system-auth-form > p {
margin: 5px 0;
}
.system-auth-form > h3 {
margin-bottom: 10px;
}
.system-auth-form > p > a {
text-decoration: underline;
}
.system-auth-form > form > div {
margin-bottom: 5px;
}
.system-auth-form > form > div > span {
display: block;
}
.system-auth-form > form > div > span:first-child {
margin-bottom: 2px;
}
.system-auth-form > form > div > span > input[type="text"],
.system-auth-form > form > div > span > input[type="password"] {
width: 100%;
padding: 3px;
border: 1px solid #ccc;
}
.system-auth-form > form > div.captcha {
border: 1px solid #ccc;
padding: 15px 10px 10px 10px;
position: relative;
margin-top: 15px;
}
.system-auth-form > form > div.captcha > h4 {
position: absolute;
top: -10px;
font-weight: normal;
font-size: 16px;
background: #eee;
padding: 0 10px;
color: #999;
}
.system-auth-form > form > div.captcha > span:first-of-type {
margin-top: 10px;
}
.system-auth-form > form > div.remember label {
font-weight: normal;
cursor: pointer;
border-bottom: 1px dashed #333;
position: relative;
top: -3px;
margin-left: 5px;
}
.system-auth-form > form > div.submit > input[type="submit"] {
width: 50%;
padding: 5px;
background: #333;
color: #fff;
border: none;
margin-top: 10px;
}
.system-auth-form i {
font-style: normal;
font-weight: bold;
color: #f00;
}