Стилизация аватара пользователями


Стилизация аватара пользователями

1134
10 из 10
Проголосовало: 2






С помощью этого скрипта ваши пользователи смогут настроить стиль своего аватара, а именно:
- Выбрать фоновое изображение, либо цвет фона
- Сделать рамку для аватара

Также доступен предпросмотр аватара в настройках. Не пугайтесь таким большим количеством пунктов в установке, на самом деле скрипт устанавливается очень легко!

Установка:

1) ПУ -> Пользователи -> Настройки модуля -> Активируем поле "Домашняя страница":


2) Скачиваем файл скрипта и загружаем его в папку "js"

3) ПУ -> Управление дизайном -> Пользователи -> Страница редактирования данных -> Перед </body> вставляем код:

Code
<div style="display:none;"><div id="web41k_avi_nastr">  
  <fieldset style="border-radius:3px;"><legend>Описание</legend>  
  Добро пожаловать в меню настройки аватара! Здесь вы можете настроить стиль отображения своего аватара, а именно:<ul style="text-align:left;"><li>Выбрать фоновое изображение, либо цвет фона</li><li>Настроить обводку</li></ul></fieldset>  
  <fieldset style="border-radius:3px;"><legend>Настройка</legend>  
  <table><tr><td style="width:50%;">Фон аватара:</td><td style="width:50%;"><input type="text" id="user_fon_av" placeholder="Ссылка или HTML-цвет"></td></tr><tr><td style="width:50%;">Размер обводки:</td><td style="width:50%;"><input type="text" id="user_border_size" placeholder="Например: 1px"></td></tr><tr><td style="width:50%;">Цвет обводки:</td><td style="width:50%;"><input type="text" id="user_border_color" placeholder="Например: #0589ff"></td></tr><tr><td style="width:50%;">Стиль обводки аватара:</td><td style="width:50%;"><select id="border_style"><option value="solid">Solid</option><option value="dotted">Dotted</option><option value="dashed">Dashed</option><option value="double">Double</option><option value="groove">Groove</option><option value="ridge">Ridge</option><option value="inset">Inset</option><option value="outset">Outset</option></select></td></tr></table><input type="button" onclick="avka_save()" value="Сохранить"><input type="button" onclick="avka_demo()" value="Предпросмотр"></fieldset>  
  </div></div>  
  <div style="display:none;"><div id="avka_demo"><img src="$USER_AVATAR_URL$"></div></div>  
  <script type="text/javascript" src="/js/web41k_avi_style.js"></script>


4) ПУ -> Управление дизайном -> Пользователи -> Персональная страница -> Ищем что-то вроде этого кода:

Code
<?if($_WWW$)?>  
  <div id="block8" class="udtb"><div class="udtlb">Домашняя страница</div> $_WWW$</div>  
  <?endif?>


И удаляем. В этом же коде находим:

Code
$_AVATAR$


И меняем на:

Code
<?if($_AVATAR$)?><div id="avka"><div style="<?substr($_WWW$, '7')?>">$_AVATAR$</div></div><?endif?>


5) На все нужные страницы сайта перед </body> вставляем код:

Code
<script type="text/javascript">  
  $(document).ready(function() {  
  $('#ava_load').load('/index/8 #avka');  
  $('#ava_load_com').load('index/8-0-$USERNAME$ #avka');  

  });  
  </script>


6) И теперь в нужном месте сайта вставляйте этот код:

Code
<div id="ava_load" style="width:150px; height:150px;"></div>


6.1) Для комментариев и форума код будет таким:

Code
<div id="ava_load_com" style="width:150px; height:150px;"></div>


Установка завершена!

Настройка

Настройка выведения аватара:

В коде:

Quote
<script type="text/javascript">$(document).ready(function() {
$('#ava_load').load('/index/8 #avka');
$('#ava_load_com').load('index/8-0-$USERNAME$ #avka');
}); </script>


Меняем выделенное красным цветом на нужное:
Для мини-профиля: /index/8.
Для каталогов (вид материалов): /index/8-0-$USERNAME$
Для каталогов (страница материала): /index/8-0-$USER$
Автор публикации: Загрузка
Загрузка
Volt, это его n материал
Источник: http://web41k.ru/
  • Оставить первым комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 24
Скрипты и модификации для Ucoz 2101
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 429
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Поставил ваш код он начинает считать от 0 до 100 и останавливаеться. я думал он будет в случайном порядке показывать цыфры
как поставить свою ссылку и логотип
  • Сатурн-1 написал:
  • Похвально.
  • Winston888 написал:
  • Я не говорил что делаю только скрипты. Я делаю шаблоны, скрипты, адаптации с разных движков под ucoz и на оборот + я ещё и сам рисую. В данный момент занимаюсь дизайном для webo4ka сам рисую сам верстаю.
  • Сатурн-1 написал:
  • Заметь, мы делаем почти одну и ту же работу.
    Ты - скрипты, я -шаблон. И каждый делает это бесплатно, НО
    ты делаешь скрипты без шаблона, я делаю шаблон без скриптов (не считая основных).
    Я тоже могу сказать что твои скрипты не идеальны, но не буду т.к. даже не знаю какие из всех существующих твои.
    Поэтому ты не сравнивай скрипты и шаблоны да еще и на Ucoz'e, мы же не на хакатоне каком нибудь.
    Последние темы
    Опрос
    403
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 4
    Гостей: 3
    Пользователей: 1
    0
    Сегодня были
    Топ пользователей: