Интересная замена фотографий «Нет аватара» для uCoz

Дата13 Июл 15 в 13:12
Категория Скрипты для uCoz

Интересное решение для замены картинки указывающей, что пользователь не установил аватар. Разноцветные аватарки с большой первой буквой логина в середине. К каждой букве присвоен свой цвет.

Разноцветные аватарки с большой первой буквой логина в середине. К каждой букве присвоен свой цвет. Данный скрипт даже полезен в некоторых моментах, если допустим ставите информер где выводятся пользователи с аватарами установив данное решение вы можете не на много снизить нагрузку на сайт.

Установка для персональной страницы

На персональной странице заменяем код $_AVATAR$ на следующий:

Код

<div class="avat_url_bl">
<?if($_AVATAR$)?>
<img src="<?substr($_AVATAR$,54,-65)?>" class="avt_url" />
<?else?>
<div class="user_favt alt<?substr($_USERNAME$,0,1)?>">
<?substr($_USERNAME$,0,1)?>
</div>
<?endif?>
</div>

Далее вставляем стили в таблицу стилей:

Код

.avt_url {
  height: 110px; /*Размер*/
  width: 110px; /*Размер*/
  border-radius:4px;
}
.user_favt {
  font-size: 70px !important; /*Размер текста*/
  color: #FFF;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 110px !important; /*Размер*/
  font-weight: bold;
  text-align: center;
  height: 110px; /*Размер*/
  width: 110px; /*Размер*/
  border-radius:4px;
  text-transform: uppercase;
  background-color: #F00;
}
.avat_url_bl {
  height: 110px; /*Размер*/
  width: 110px; /*Размер*/
}
.altq {background-color: #00CC00;}
.altw { background-color: #1877E0;}
.alte {background-color: #6633FF;}
.altr {background-color: #00CCFF;}
.altt {background-color: #3300FF;}
.alty {background-color: #FFFF00;}
.altu {background-color: #CCCC33;}
.alti {background-color: #999966;}
.alto {background-color: #33CC33;}
.altp {background-color: #993300;}
.alta {background-color: #9966CC;}
.alts {background-color: #006600;}
.altd {background-color: #CC0033;}
.altf {background-color: #CC0066;}
.altg {background-color: #CCCC00;}
.alth {background-color: #66FF66;}
.altj {background-color: #663300;}
.altk {background-color: #330033;}
.altl {background-color: #003366;}
.altz {background-color: #FF3300;}
.altx {background-color: #CC3399;}
.altc {background-color: #CCFF00;}
.altv {background-color: #996633;}
.altb {background-color: #3399CC;}
.altn {background-color: #669966;}
.altm {background-color: #993333;}

Что-бы изменить размеры аватаров и заменителей вам нужно в 7 местах где комментарий /*Размер*/ указать свое число.

Установка для других страниц (информеры,модули)

Замените старый код отвечающий за вывод аватара в нужном месте на:

Код

И в стили:

Код

.avt_url {
  height: 50px; /*Размер*/
  width: 50px; /*Размер*/
  border-radius:4px;
}
.user_favt {
  font-size: 70px !important; /*Размер текста*/
  color: #FFF;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 50px !important; /*Размер*/
  font-weight: bold;
  text-align: center;
  height: 50px; /*Размер*/
  width: 50px; /*Размер*/
  border-radius:4px;
  text-transform: uppercase;
  background-color: #F00;
}
.avat_url_bl {
  height: 50px; /*Размер*/
  width: 50px; /*Размер*/
}

И опять же где комментарий /*Размер*/ заменяем число 50 на нужный размер.

Источник Uday