Знаки отличия на персональной странице uCoz

Уважаемый гость! Для скачивания файлов с нашего портала необходимо авторизоваться:

Понравилась статья?

Поделись с друзьями!
Вероятно, Вы замечали на различных сайтах "Знаки отличия" , или проще говоря "Награды" пользователей. Есть несколько вариантов реализации такой функции, но я расскажу о самом удобном и оптимальном, который используется на сайте uCozBook. Скажу сразу, никаких скриптов устанавливать не придется. Все будет работать за счет условных операторов. Если Вы не имеете представления о них, советую прочитать пост на форуме uCoz "Условные операторы и системные коды" или же приобрести учебник, в котором все подробно описывается.

Для примера возьмем код награды, которая будет даваться за публикацию более одного материала на сайт.
Код
<?if($POSTS$>1)?>  
  <div class="nagrada">  
  <p>Автор</p>  
  <img src="http://ucozbook.ucoz.com/_ld/0/40105777.png">  
  </div  
<?endif?>


$POSTS$ — количество добавленных пользователем материалов. Если это число более одного, то выполняется действие IF и награда становится доступна. Если условие не выполнено, то награда отображаться не будет.

Для награды, которая будет выдаваться за активность в комментариях, вместо ($POSTS$>1) необходимо поставить ($_COM_ENTRIES$>=10), где 10 — минимальное количество оставленных комментарием, необходимое для получения знака отличия.
Пример кода награды:
Код
<?if($POSTS$>1)?>  
  <div class="nagrada">  
  <p>Комментатор</p>  
  <img src="http://ucozbook.ucoz.com/_ld/0/40105777.png">  
  </div  
<?endif?>


Код награды, которая дается за активность на сайте:
Код
<?if($_COM_ENTRIES$>=10)?>
  <div class="nagrada">  
  <p>Комментатор</p>  
  <img src="http://ucozbook.ucoz.com/_ld/0/40105777.png">  
  </div  
<?endif?>




Все коды системы uCoz и их применение в условных операторах подробно описаны в учебника ""Условные операторы и системные коды"




Специально для пользователей сайта uCozBook сделал блок "Знаки отличия" с различными наградами.


В нужное место на "Персональной странице пользователя" вставляем каркас блока:
Код
<div class="nagradi">  
  <?if($_COM_ENTRIES$>=10)?>
<div class="nagrada">  
<img src="http://ucozbook.ru/files/nagradi/chat.png" alt="">  
<p>  
Комментатор  
</p>  
</div>  
<?endif?>  
  <?if(!$_EMAIL_IS_VERIFIED$)?>  
<div class="nagrada">  
<img src="http://ucozbook.ru/files/nagradi/profle.png" alt="">  
<p>  
Подтвержденный  
</p>  
</div>  
<?endif?>  
  <?if($POSTS$>10)?>  
<div class="nagrada">  
<img src="http://ucozbook.ru/files/nagradi/megaphone.png" alt="">  
<p>  
Форумчанин  
</p>  
</div>  
<?endif?>  
  <?if($POSTS$>10)?>  
<div class="nagrada">  
<img src="http://ucozbook.ru/files/nagradi/frames.png" alt="">  
<p>  
Автор  
</p>  
</div>  
<?endif?>  
</div>

В конец таблицы CSS переносим стили:
Код
.nagradi{  
margin-top: 20px;  
text-align: center;  
  }  
  .nagrada {  
padding: 0px 10px;  
border: 1px solid #DEDEDE;  
width: 150px;  
transition: 0.5s;  
display: inline-block;  
  }  
  .nagrada:hover{  
background: #77B3D4;  
transition: 0.5s;  
  }  
  .nagrada:hover{  
color: white;  
transition: 0.5s;  
  }  
  .nagrada img{  
width: 75px;  
height: 75px;  
display: block;  
margin: 0px auto;  
padding-top: 10px;  
  }  
  .nagrada p{  
text-align: center;  
  }
Добавил: Admin Просмотров: 1691 Категория: Интересные решения Комментарии
avatar
1
На Урааа так же реализовано?
avatar
2
А вот за это спасибо.
avatar
0
3
Не за что)
avatar
4
А реально ли сделать кабинет пользователя как у вас на сайте? Тоже так хочется! )
avatar
5
Спасибо!)))) Круть!
avatar