ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Стильная персональная страница Gryn для uCoz

Стильная персональная страница Gryn для uCoz

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

Так как недавно было изменение у нас на сайте, и честно сказать сразу же в ЛС пришло предложение о том что бы поделится данным дизайном. Я сразу же подумал что идея хорошая так как может кому и пригодится так как я её сделал красиво, аккуратно и не чего лишнего, да и честно сказать всё равно кому нужно начнут воровать, пусть в общем пользуются во благо своего ресурса. Для того что бы у вас работала данная страница пользователя как у нас на сайте то вам нужно пройти в настройки модуля пользователя и на против строчки Персональную страницу пользователя открывать: поставить в текущем окне.

Далее копируем дизайн страницы сайта и вставляем его в персональную страницу пользователя, затем там же находим теги которые я указал ниже

Код

$CONTENT$

И удаляем от туда

Код

$CONTENT$

Что бы получилось вот так

Код

И в замен

Код

$CONTENT$

Вставляем вот этот код персональной страницы пользователя

Код

<div style="position:relative;text-align:center; background:#EDEDED url(http://zornet.ru/Ajaxoskrip/Fyrkes/tzHcg7s.jpg); padding: 11px; border: solid 1px #E7E7E7; border-radius: 5px;">
  <div class="groupicon gColor4 hp_static" style=" padding: 6px; background: #A4D150; border-radius: 5px; text-transform: uppercase; "><b>$_GROUP_NAME$</b></div>
<?if($_AVATAR$)?><div class="user-avatar"><span id="a_avatar">$_AVATAR$</span></div><?endif?>
<table border="0" cellpadding="0" height="30" cellspacing="0" width="100%">
<tr>
<td align="right">
<?if($_CHANGE_DETAILS_URL$)?><a class="fNavLink" href="$_CHANGE_DETAILS_URL$" rel="nofollow"><input value="Изменить данные" type="button"></a><?endif?>
<?if($_PM_READ_URL$)?><a class="fNavLink" href="$_PM_READ_URL$" rel="nofollow"><input value="Читать ЛС ($UNREAD_PM$)" type="button"></a> <?endif?>
<?if($_PM_SEND_URL$)?><a class="fNavLink" href="$_PM_SEND_URL$" rel="nofollow"><input value="Отправить ЛС" type="button"></a><?endif?>
  </td>
</tr>
</table>
</div>
<div style="padding:3px;"></div>
<div class="box-title-text" style=" font-size: 17px;border-radius: 5px; padding: 5px; background: rgb(100, 172, 221); color: #fff; ">Информация о пользователе</div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><div class="udtlb">Пользователь:</div> <a href="javascript://" rel="nofollow" onclick="prompt('Адрес профиля данного пользователя','$_PROFILE_URL$')"><b><span id="h1_name">$_USERNAME$</span></b></a></div>
<?if($_REP_READ_URL$)?> <div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><div class="udtlb">Поощрения:</div> <div class="u_rate_t"><?if($_REP_DO_URL$)?> <a href="$_REP_DO_URL$" style=" padding: 0px 7px; background: #BD1D1D; color: #fff; border-radius: 10px; ">-</a><?endif?> <a title="Смотреть историю репутации" class="repHistory" href="$_REP_READ_URL$" style=" padding: 1px 15px; background: #ccc; color: #fff; border-radius: 10px; "> <b>$_REPUTATION$</b></a><?if($_REP_DO_URL$)?> <a href="$_REP_DO_URL$" style=" padding: 0px 7px; background: #1DBD62; color: #fff; border-radius: 10px; ">+</a><?endif?></div></div> <?endif?>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><div class="udtlb">E-mail:</div>
<?if($_IS_OWN_PROFILE$)?>$_EMAIL$
  <?if($_EMAIL_IS_HIDDEN$)?><span style="font-size:7pt">(Адрес скрыт)</span><?endif?>
<?else?>
  <?if($MODER_PANEL$)?><a href="mailto:$_EMAIL$">$_EMAIL$</a>
  <?if($_EMAIL_IS_HIDDEN$)?><span style="font-size:7pt">(Адрес скрыт)</span><?endif?>
  <?if(!$_EMAIL_IS_VERIFIED$)?><span style="color:red;" title="Not verified e-mail">*</span><?endif?>
  <?else?>
  <?if($_SEND_EMAIL_URL$)?><a href="$_SEND_EMAIL_URL$">Написать письмо пользователю</a>
  <?else?>$_EMAIL$
  <?endif?>
<?endif?>
<?endif?><?if($_EMAIL_VERIFICATION_URL$)?>[ <b><a href="$_EMAIL_VERIFICATION_URL$"><span style="color:red">Подтвердить e-mail</span></a></b> ]<?endif?></div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><?if($_LOG_TIME$)?><div class="udtlb">Дата входа:</div> $_LOG_TIME$ <?endif?></div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><?if($_REG_TIME$)?><div class="udtlb">Дата регистрации:</div> $_REG_TIME$ <?endif?></div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><?if($_BIRTHDAY$)?><div class="udtlb">Дата рождения:</div>$_BIRTHDAY$ [ <b>$_AGE$</b> $_ZODIAC$ ] <?endif?></div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><div class="udtlb">Сайт:</div> <?if($_WWW$)?>$_WWW$ <?else?>Сайт не указан...<?endif?></div>
<div style=" border-bottom: 1px solid #D7D7D7; padding: 6px 15px 4px 0;"><?if($_SIGNATURE$)?><div class="udtlb">Подпись:</div> $_SIGNATURE$ <?endif?></div>

<?if($_IS_ACTIVITY$)?>
<div class="user-activ">
  <div class="user-a-comm"><center> <a href="$_COM_ACTIVITY_URL$" class="c_c1" target="_blank"><span><?if($_COM_ENTRIES$)?> $_COM_ENTRIES$ комментар<?if(($_COM_ENTRIES$%10=1)&&($_COM_ENTRIES$%100!=11))?>ий<?else?><?if(($_COM_ENTRIES$%10>=2)&&($_COM_ENTRIES$%10<=4)&&($_COM_ENTRIES$%100<10||$_COM_ENTRIES$%100>=20))?>ия<?else?>иев<?endif?><?endif?><?else?>0<?endif?></span></a></center></div>
<div class="user-a-post"> <center> <a href="$_LOAD_ACTIVITY_URL$" class="c_c1" target="_blank"><span> <?if($_LOAD_ENTRIES$)?> $_LOAD_ENTRIES$ Материа<?if(($_LOAD_ENTRIES$%10=1)&&($_LOAD_ENTRIES$%100!=11))?>лов<?else?><?if(($_LOAD_ENTRIES$%10>=2)&&($_LOAD_ENTRIES$%10<=4)&&($_LOAD_ENTRIES$%100<10||$_LOAD_ENTRIES$%100>=20))?>ла<?else?>лов<?endif?><?endif?><?else?>0 Материалов<?endif?></span></a> </center></div>
  <div class="user-a-postu"> <center> <a href="$_FORUM_ACTIVITY_URL$" class="c_c1" target="_blank"><span><?if($_FORUM_ENTRIES$)?> $_FORUM_ENTRIES$ Ответ<?if(($_FORUM_ENTRIES$%10=1)&&($_FORUM_ENTRIES$%100!=11))?>ов<?else?><?if(($_FORUM_ENTRIES$%10>=2)&&($_FORUM_ENTRIES$%10<=4)&&($_FORUM_ENTRIES$%100<10||$_FORUM_ENTRIES$%100>=20))?>а<?else?>а<?endif?><?endif?><?else?>0 Ответов<?endif?></span></a> </center></div
</div>
<?endif?>


<div class="box-title-left">
<div class="box-title-text" style=" font-size: 17px; padding: 5px;background: rgb(100, 172, 221); color: #fff; ">Отзывы о пользователе</div>
</div>
  <div class="box-content" style="padding: 0px;">
<div align="center">
<?if($_REPUTATION$=0)?>
<div style="text-align: center;">Отзывов пока нет у данного пользователя!</div>
<?else?>
<div id="testRepa" style="max-height: 250px; overflow-x: hidden; border-bottom: solid 1px #64ACDD;">
</div>
<script type="text/javascript">
var user_id = "$_USER_ID$";
</script>
  <script type="text/javascript" src="http://zornet.ru/Aben/Gsa/rep.js"></script>
<?endif?>
  </div>
</div>

  <?if($USERS_LIST_URL$)?>
<form method="post" action="/index" name="fuser" style="margin:0px"><table border="0" cellpadding="4" cellspacing="1" width="100%" id="usch"><tr><td align="center"><input type="button" class="allUsersBtn" style="width:140px;" onclick="window.location.href='/index/15-1'" value="Список пользователей" /> <input type="text" class="uSearchFl" name="user" style="width:230px;text-align:center;" size="20" value="Логин пользователя" onclick="if (this.value=='Логин пользователя'){this.value='';}" maxlength="25" /> <input type="submit" class="uSearchFlSbm" style="width:140px;" value="Найти пользователей" /></td></tr></table><input type="hidden" name="a" value="15" /></form>
<?endif?>

Далее добавим немного стилей и для этого допишите ни же указанные стили в стили вашего сайта

Код

.udtlb { clear:left; float:left; width:450px }
  .user-a-comm {
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 15px 20px;
  width: 265px;
  border-bottom: 1px solid #D2E5E8;
  background: #ECF1F2;
}
  .user-a-post {
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 15px 20px;
  width: 265px;
  border-left: 1px solid #D2E5E8;
  border-bottom: 1px solid #D2E5E8;
  background: #ECF1F2;
}
  .user-a-postu {
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 15px 20px;
  width: 265px;
  border-left: 1px solid #D2E5E8;
  border-bottom: 1px solid #D2E5E8;
  background: #ECF1F2;
}

Вроде бы всё и я не чего не забыл.

12 Сентября 2015 Просмотров: 1960 Комментариев: (14)

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

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

Kosten

Похожие материалы

Оставь свой отзыв

Комментарии: 14
Порядок вывода комментариев: Kvint 13 Сентября 2015 00:12¹ 0 Но теперь апатия начнется как на шаблон Орла, хотя смотрел здесь на сайте не дурно смотрится, для широкого сайта, отличное будет решение, главное, чтоб все работало. Просто слышал, что это персональная страница, связана самим видом материала и комментариев. Kosten 13 Сентября 2015 00:18² 0 Kvint, вы правильно говорите, что она связана с материалом, это где прописано, кто залил и его изображение. Но только в том дело, что там не будет не чего без этого кода и специально нужно прописывать, а персональная страница идет совершенно отдельно и от нее начинают играть, так сказать это форвард и он первый и подачи раздает, а брать ее, у каждого свое мнение будет, так как она совершенно автономна от всего. Canon 13 Сентября 2015 00:33³ 0 Красивая страница, вот не мешало бы, чтоб сам пользователь мог поставить свой фон на ее. Да, будет похоже чем то на социальную сеть известную, но зато у себя на сайте так же можно делать. Kosten 13 Сентября 2015 00:45⁴ 0 Об этом думал, но потом, зачем это все, другое дело, делать в странице общение и здесь такая функция не помешало и смотрелось бы как группа. Kolinkor 13 Сентября 2015 00:51⁵ 0 Но не сказать что она оригинальная по дизайну, функций ее выдают и она как вижу все остались. А так очень удобная и только для светлого сайта. Сопрано 13 Сентября 2015 00:56⁶ 0 Опаньки. то что искал и скачивать не чего не нужно и как посмотрел по коду, с ним идет всего 2 ссылки, что радует, хотя реально самое большое, должна одна, но как понимаю ее делали специально для сайта и так чтоб все еще отражалась в материалах, а точнее сколько где ответил и загрузил, все можно сделать через скрипт, главное уметь его написать и он будет не большой а просто информацию передавать в персональной и все. Kosten 13 Сентября 2015 01:11⁷ 0 Но что и нашел, теперь старый код убираем и ставим этот. Не забываем взять полностью страницу и только там прописать скрипт, а не только поменять. ZruBkul 13 Сентября 2015 01:47⁸ 0 Чем то похоже на одну страницу по такой же тематике на сайте, но там уже немного переделана и функций добавлены, к примеру помог, поставь плюс или помоги ресурсу, но без этого не куда сейчас. Все школьники сбегутся и что им дали на обет, помогут, да помогут и последнее скопируют. FeStemBer 13 Сентября 2015 02:06⁹ 0 Видно что обвод сделан, и он не успевает закруглиться по стилям и нужно что то другое придумать или вообще убрать его. Kosten 13 Сентября 2015 02:42¹⁰ 0 Да тоже это заметил. Может в красивую рамку поставить или стили вообще убрать. DALMATIN 17 Сентября 2015 03:58¹¹ 0 Помню когда я её делал и думал как фон сделать так что бы каждый пользователь мог установить свой и чёт не додумался, но вот на новом своём форуме не реклама http://forums.ucoz.com/index/8-1 я смог это организовать http://forums.ucoz.com/index/8-6 главное я для себя задал такой темп что с первых шагов продумывать что к чему будет так как в будщем трудно будет что то изменять Kosten 01 Октября 2015 18:29¹³ 0 DALMATIN, скинь код твоей страницы, на замену, только без значков. workman 01 Октября 2015 10:35¹² 0 DALMATIN Так поделись. Kosten 28 Октября 2016 19:37¹⁴ 0 Скрипт изменен и теперь страница полностью рабочая, вам останется по ширине блоки подогнать и все.