» »

Мини профиль из кнопок на сайт uCoz

Мини профиль из кнопок на сайт uCoz

Этот мини профиль создан из шрифтовых кнопок и занимает мало места. Здесь вы можете подключить другие иконки и оригинально будет. Раньше такой профиль стоял на сайте веб мастер uCoz и сейчас там поменялся, что теперь этот можете установить на сайт, а главное понять как он сделан. Просто он место мало занимает и по функциям не чем другим не уступает. А это закачать файл или перейти на добавление материала. Также на персональную страницу и остальные функций.

Всегда такой скрипт идет через операторы, что с начало видно вход на сайт или регистрация и после когда вы зайдете как пользователь, то появится такая картина. Здесь просто поставил в блок сайта в контейнера и не будет операторов на переход. Но прежде вам нужно установить стили на кнопки, чтоб выводили их, также будет возможность заменить их по форме и по гамме цвету.

Если ставить в блок сайта, то иде так:

По умолчанию:

Стильный мини профиль uCoz

Чтоб зайти на сайт:

Красивый мини профиль для uCoz

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

Скрипт ввод на сайт

Также вы возможно видели такой вход на сайт, это как раз здесь нет и нужно самому через оператор устанавливать.

Приступаем к установке:

Вверх сайта пропишем стиль.

Код
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">


Все по шрифтовым иконкам вы найдете в статье.

Ставим в блок или там где вы считаете нужным, хоть в низ сайта.

Код
<div class="user-box">
<?if($USER_LOGGED_IN$)?>
<div class="h_search_right">
<div class="h_userprofile">
<center>
<?if($ADD_ENTRY_LINK$)?><a href="/load/0-0-0-0-1" style="color:#165a8e;"><i class="fa fa-cogs"></i></a><?endif?>  
<a href="/index/8"><i class="fa fa-user-secret"></i></a>
<a href="http://zornet.ru/index/14"><i class="fa fa-envelope"></i></a>
<a href="/index/15"><i class="fa fa-users"></i></a>
<a href="/index/11"><i class="fa fa-cog"></i></a>
<a href="javascript://" onclick="viytiSsaitaweb()"><i class="fa fa-power-off"></i></a></center>
</div>
</div>
<?else?>
  Войти в аккаунт!
  $LOGIN_FORM$
  <?endif?>
  </div>


CSS:

Код
.h_userprofile a{font-size:28px;display:inline-block;padding-left:12px;margin-top:16px;color:#7faaf2;position:relative}
.h_userprofile a:hover{color:#498bfa}
.h_userprofile a span{position:absolute;display:block;background:#e33c3c;right:-8px;top:-3px;font-size:11px;color:#FFF;padding:2px 0px;width:18px;text-align:center;-webkit-border-radius:40px;-moz-border-radius:40px;border-radius:40px;}


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

Но а также ознакомитесь с шрифтовыми иконками и как их установить и как они работают.

Источник: Webmaster-ucoz.ru
2017-02-13 Просмотров: 1184 Комментарий: (7)

Поделиться в социальных сетях

Материал разместил

Комментарий: 7
Сопрано
Сопрано 2017-02-13 00:451
0
Если его ставить в горизонтальное меню или вверх сайта (шапка) то здесь он не полный и нужны кнопки или хотя скрипт входа и регистраций. Хотя как помню видел на сайте профиль как здесь стоит, можно от туда взять. А что по установке в блок, то у каждого по своему будет отображаться. Это уже настройка в админ панели в форме входа.
Kosten
Kosten 2017-02-13 00:512
0
Так и написано, что под блок, вот к примеру как гость изначально видит форму здесь на сайте и этот код просто выше установить. Здесь можно много говорить, есть от ураа мини профиль и часть как раз от туда можно взять и как только зашел на сайт, ты просто видишь мини профиль в таком виде дизайн. Просто думаю эта и есть главная часть профиля.

Kosten
Kosten 2017-02-13 00:543
0
Можно посмотреть как этот профиль работает, он установлен на одном сайте - здесь и попробуйте просто зарегистрироваться через социальные закладки и увидите.

Другое дело, если форме входа установлены социальные закладки и не нужно забывать, что можно перевести на локального пользователя, где уже их не будет. Если кому нужно так как в материале представлено, то код скину.
FeStemBer
FeStemBer 2017-02-13 01:144
0
Так и здесь профиль от урааа, а чтоб понять, он же выложен на сайте и его работа и как ставить эту часть, вот скрипт и там он полностью установлен.
Kosten
Kosten 2017-02-13 01:185
0
Да есть информационная панель, в ней как раз поставил мини профиль что на сайте, там точно понятно, просто убираем вторую часть и ставим эту, чтоб кнопками показывало.
avatar
nik96ek98 2017-02-23 12:426
0
а как можно дать пользователю возможность удалять свои объявления прям из профиля
Kosten
Kosten 2017-02-23 19:057
0
Нет, у пользователя нет таких пока прав.
avatar