Темный мини профиль для uCoz

Скрипты для uCoz

na3uTuB4uk

22.05.25, 14:16

Описание:
Новенький, красивый мини профиль выполненный в темных тонах, отлично подойдет для многих тематик сайтов. Данный мини профиль адаптирован с шаблона imax-cinema для Dle, а так же это не просто мини профиль, но и авторизация на сайте. Он имеет уникальный вид и не имеет ничего лишнего, все компактно и красиво.

Вот так будет выглядеть кнопка войти и кнопка профиля:
Темный мини профиль для uCoz

А вот так будет выглядеть окно авторизации и самого мини профиля после нажатия на кнопку входа или ваш логин:

Теперь перейдем непосредственно к установке шаблона:
1. Загрузить папку mprofile через файловый менеджер на сайт;
2. Установим форму входа: Пользователи » Форма входа пользователей, меняем все что там есть на данный код:

Код

<div class="autnav-1">
<a href="#" class="login-button witcfa"><span style="font-weight: 700;">Войти</span><div class="icons-nav" style="border: none;"><img src="/mprofile/images/pix.svg" style="border-radius: 0px;"></div></a>
<div class="login-block">
<div class="login-ava" style="display:none;"><img src="/mprofile/images/noavatar.png" alt="" /></div>
<div class="name-as">Добро пожаловать в мир IMAX CINEMA</div>
<div class="block-ask">
<div class="name-puls">Вы можете войти с помощью:</div>
<div class="sociallogin">
<a href="jаvascript://" onclick="return uSocialLogin('vkontakte');" target="_blank"><img src="/mprofile/social/vkmini.png"/></a>
<a href="jаvascript://" onclick="return uSocialLogin('ok');" target="_blank"><img src="/mprofile/social/ok.png" /></a>
<a href="jаvascript://" onclick="return uSocialLogin('facebook');" target="_blank"><img src="/mprofile/social/facemini.png" /></a>
<a href="jаvascript://" onclick="return uSocialLogin('google');" target="_blank"><img src="/mprofile/social/gogmini.png" /></a>
<a href="jаvascript://" onclick="return uSocialLogin('twitter');" target="_blank"><img src="http://www.sitepronews.com/wp-content/uploads/2013/11/twitter-bird-white-on-blue.png" style="width: 24px; height: 24px;"/></a>
<a href="jаvascript://" onclick="return uSocialLogin('yandex');" target="_blank"><img src="/mprofile/social/yas.png" /></a>
</div>
</div>

<div class="left-avtors">
<div class="nameemail">Логин или E-mail:
<div class="login-line"><input name="user" type="text" class="login-input-text" title="Login" /></div></div>

<div class="nameemail">Пароль:</div>
<div class="login-line"><input name="password" type="password" class="login-input-text" title="pass" /></div>
<input name="sbm" type="submit" class="enter" value="Войти" />
<input id="rem$PAGE_ID$" type="checkbox" name="rem" value="1" checked="checked" style="display:none;">
</div>

<div class="rightlogis">
<div class="regast">У Вас еще нет аккаунта в мире IMAX CINEMA?</div>
<div class="login-link">
<a href="$REGISTER_LINK$" title="Registration">Зарегистрируйтесь!</a>
<a href="$REMINDER_LINK$" title="ups">Забыли пароль?</a>
</div>
</div>

<div style="clear: both;"></div>
<div class="window_close" style="top: 5%;"></div>
</div>
</div>

<style>
#uidLogButton {display: none;}
#baseLogForm {display: block!important;}
#uidLogButtonAjx {display: none;}
#baseLogFormAjx {display: block!important;}
</style>

3. Теперь установим сам мини профиль, для этого в нужное вам место установите данный код:

Код

<?if($USER_LOGGED_IN$)?>
<div class="autnav-1"><a href="#" class="login-button witcfa"><span>$USERNAME$</span><div class="icons-nav"><img src="<?if($USER_AVATAR_URL$)?>$USER_AVATAR_URL$<?else?>/images/noavatar.png<?endif?>"></div></a></div>
<div class="login-block">
<div class="happes">Привет $USERNAME$, Что будем делать?</div>
<div class="ministrs">

<div class="lenta-ava">
<div class="login-ava" style="display:block;"><img src="<?if($USER_AVATAR_URL$)?>$USER_AVATAR_URL$<?else?>/images/noavatar.png<?endif?>" alt="$USERNAME$" /></div>
</div>

<div class="l-link">
<?if($USER_GROUP$='Администраторы')?><div class="dzig"><div class="stat-log-bl"><a href="/panel/" target="_blank"><img src="/mprofile/images/setting.svg"></a></div><div class="txt-asr"><a href="/panel/" target="_blank">Админпанель</a></div></div><?endif?>
<div class="dzig"><div class="stat-log-bl"><a href="$PERSONAL_PAGE_LINK$"><img src="/mprofile/images/pep.svg"></a></div><div class="txt-asr"><a href="$PERSONAL_PAGE_LINK$">Профиль</a></div></div>
<div class="dzig"><div class="stat-log-bl"><a href="$PM_URL$"><img src="/mprofile/images/message.svg"></a></div><div class="txt-asr"><a href="$PM_URL$">Сообщения ($IS_NEW_PM$)</a></div></div>
<div class="dzig"><div class="stat-log-bl"><a href="/index/11"><img src="/mprofile/images/favor.svg"></a></div><div class="txt-asr"><a href="/index/11">Настройки</a></div></div>
<?if($ADD_ENTRY_LINK$)?><div class="dzig"><div class="stat-log-bl"><a href="$ADD_ENTRY_LINK$"><img src="/mprofile/images/add.svg"></a></div><div class="txt-asr"><a href="$ADD_ENTRY_LINK$">Новость</a></div></div><?endif?>
<div class="dzig"><div class="stat-log-bl"><a href="$LOGOUT_LINK$"><img src="/mprofile/images/exit.svg"></a></div><div class="txt-asr"><a href="$LOGOUT_LINK$">Выход</a></div></div>
<div style="clear: both;"></div>
</div>
<div class="window_close"></div>
</div>
</div>
<?else?>
$LOGIN_FORM$
<?endif?>
<style>@import url('/mprofile/mprofile.css') all;</style>
<script type="text/jаvascript" src="/mprofile/mprofile.js"></script>

4. После установки зайдите в /mprofile/mprofile.css и удалите строки:

Код

/* Удалите эти строки перед тем как установить на сайт */
.autnav-1 { background-color: #d9dedf; width: 100%; }

5. Все, установка завершена. По умолчанию мини профиль выравнивается по правую сторону, если хотите отредактировать, то найдите строку:

Код

.autnav-1 { float: right; }

и отредактируйте по своему.

1828_mprofile.zip [49.1 Kb] (Скачали 1)