Рейтинг: 4.5/13

Метки

вид фотографий для ucoz

Опрос: Чего добавлять больше?

Чего добавлять больше?

Результаты опроса

Всего ответов: 192

Главная » 2011 » Октябрь » 12 » Вид фотографий в фотоальбомах для uCoz: несколько вариантов оформления.

Это стандартное оформление фотографий на главной странице модуля "Фотоальбомы" системы uCoz



Именно его мы и будем изменять

Решение №1

все фотографии будут в аккуратной рамочке и как будто прилеплены в верхней части на прозрачный кусочек скотча





Установка:

1.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

1.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><span></span><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>
<?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?>


1.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

img {border: none;}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  margin: 10px;
  padding: 0;
  float: left;
  position: relative;
  width: 180px;
  height: 130px;
}
.gallery img {
  background: #fff;
  border: solid 1px #ccc;
  padding: 4px;
}
.gallery span {
  width: 77px;
  height: 27px;
  display: block;
  position: absolute;
  top: -12px;
  left: 50px;
  background: url(/images/tape.png) no-repeat;
}
.gallery a {
  text-decoration: none;
}
</style>

<!--[if lt IE 7]>
<style type="text/css">
  .gallery span { behavior: url(/iepngfix.htc); cursor: pointer; }
</style>
<![endif]-->


1.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


1.5 Закачать в корневую папку сайта файл iepngfix.htc из архива с исходниками
1.6 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файл tape.png из архива с исходниками.

Решение №2

в данном решении на мини-картинках фотографий будут выводиться результаты рейтинга фотографии в виде иконок с оценками





Установка:

2.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

2.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><img src="$PHOTO_DIRECT_URL$" alt="image" />
<?if($RATING$=0)?><span class="favorite0"></span><?endif?>
<?if($RATING$=1)?><span class="favorite1"></span><?endif?>
<?if($RATING$=2)?><span class="favorite2"></span><?endif?>
<?if($RATING$=3)?><span class="favorite3"></span><?endif?>
<?if($RATING$=4)?><span class="favorite4"></span><?endif?>
<?if($RATING$=5)?><span class="favorite5"></span><?endif?>
</a></li>
<div style="clear:both;padding:5px 5 5 10px;"><?if($CAT_NAME$)?><a href="$CAT_URL$"><?if(len($CAT_NAME$)>25)?><?substr($CAT_NAME$,0,23)?>...<?else?>$CAT_NAME$<?endif?></a><?endif?></div>


2.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

img {border: none;}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  margin: 10px;
  padding: 0;
  float: left;
  position: relative;
  width: 180px;
  height: 130px;
}
.gallery img {
  background: #fff;
  border: solid 1px #ccc;
  padding: 4px;
}
.gallery span {
  width: 40px;
  height: 40px;
  display: block;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.gallery .favorite5 {
  background: url(/evaluation/5.png) no-repeat;
}
.gallery .favorite4 {
  background: url(/evaluation/4.png) no-repeat;
}
.gallery .favorite3 {
  background: url(/evaluation/3.png) no-repeat;
}
.gallery .favorite2 {
  background: url(/evaluation/2.png) no-repeat;
}
.gallery .favorite1 {
  background: url(/evaluation/1.png) no-repeat;
}
.gallery .favorite0 {
  background: url(/evaluation/0.png) no-repeat;
}

}
.gallery a {
  text-decoration: none;
}
.gallery a:hover img {
  border-color: #666;
}
.gallery a:hover span {
  background-position: left -2px;
}
</style>


2.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


2.5 Создать (если не создана ранее) в файловом менеджере папку evaluation и закачать в неё содержимое одноимённой папки из архива с исходниками (Примечание: файлы оценок выполнены специально для этого урока PS-Studio.Info)

Решение №3

данное решение позволяет вывести поверх мини-фотографий стикеры с текстом (например,названием фотографии), цвет стикера меняется при наведении курсора мыши на фото





Установка:

3.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

3.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><em><?if($PHOTO_NAME$)?><?if(len($PHOTO_NAME$)>25)?><?substr($PHOTO_NAME$,0,23)?>...<?else?>$PHOTO_NAME$<?endif?><?endif?></em><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>


3.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

h1 em {
  border: dashed 1px #e3792c;
  display: block;
  padding: 10px 0;
  font-style: normal;
}

img {
  border: none;
}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  padding: 10px;
  margin: 0;
  float: left;
  position: relative;
  width: 180px;
  height: 130px;
}
.gallery li:hover img {
  border-color: #000;
}
.gallery img {
  background: #fff;
  border: solid 1px #888;
  padding: 5px;
}
.gallery em {
  background: #fff url(/images/grey-gradient.gif) repeat-y;
  color: #000;
  font-style: normal;
  padding: 2px 10px;
  display: block;
  position: absolute;
  top: 110px;
  left: 9px;
  border: 1px solid #999;
  border-left-color: #888;
}
.gallery a {
  text-decoration: none;
}
.gallery a:hover em {
  background: #ffdb01 url(/images/orange-gradient.gif) repeat-y;
  border-color: #c25b08;
}
</style>


3.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


3.5 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файлы изображений grey-gradient.gif и orange-gradient.gif из архива с исходниками.

Решение №4

Установка данного решения выводит всплывающие подсказки для мини-изображений на главной странице модуля "Фотоальбомы"





Установка:

4.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

4.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><em><?if($PHOTO_NAME$)?><?if(len($PHOTO_NAME$)>25)?><?substr($PHOTO_NAME$,0,23)?>...<?else?>$PHOTO_NAME$<?endif?><?endif?></em><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>


4.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

h1 em {
  border: dashed 1px #e3792c;
  display: block;
  padding: 10px 0;
  font-style: normal;
}

img {
  border: none;
}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  padding: 10px;
  margin: 0;
  float: left;
  position: relative;
  width: 180px;
  height: 130px;
}
.gallery img {
  background: #fff;
  border: solid 1px #ccc;
  padding: 5px;
}
.gallery li:hover img {
  border-color: #999;
}
.gallery em {
  width: 102px;
  background: url(/images/bubble.gif) no-repeat;
  padding: 3px 0 6px;
  display: none;
  position: absolute;
  top: -2px;
  left: 50px;
  font-style: normal;
  text-align: center;
}
.gallery a {
  text-decoration: none;
  color: #000;
}
.gallery a:hover em {
  display: block;
}</style>


4.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


4.5 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файл bubble.gif из архива с исходниками.

Решение №5

Ещё один вариант оформления вида фотографий в фотоальбомах для uCoz, на этот раз мы прикрепим стикер к фотографии канцелярской скрепкой





Установка:

5.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

5.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><span></span><em><?if($PHOTO_NAME$)?><?if(len($PHOTO_NAME$)>25)?><?substr($PHOTO_NAME$,0,23)?>...<?else?>$PHOTO_NAME$<?endif?><?endif?></em><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>


5.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

h1 em {
  border: dashed 1px #e3792c;
  display: block;
  padding: 10px 0;
  font-style: normal;
}

img {
  border: none;
}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  padding: 10px;
  margin: 0;
  float: left;
  position: relative;
  width: 180px;
  height: 130px;
}
.gallery li:hover img {
  border-color: #000;
}
.gallery img {
  background: #fff;
  border: solid 1px #ccc;
  padding: 5px;
}
.gallery em {
  background: #fff;
  color: #000;
  font-style: normal;
  padding: 2px 8px 0 22px;
  display: block;
  position: absolute;
  top: 20px;
  left: 5px;
  border: 1px solid #999;
}
.gallery a {
  text-decoration: none;
}
.gallery span {
  width: 30px;
  height: 60px;
  display: block;
  position: absolute;
  top: 7px;
  left: 9px;
  background: url(/images/paper-clip-mini.png) no-repeat;
  z-index: 3;
}
</style>
<!--[if lt IE 7]>
<style type="text/css">
  .gallery span { behavior: url(iepngfix.htc); cursor: pointer; }
</style>
<![endif]-->


5.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


5.5 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файл paper-clip-mini.png из архива с исходниками.

Решение №6

Хотите создать свою Третьяковскую галерею?) пожалуйста, с помощью данного решения вид фотографий приобретает такой стиль:





Установка:

6.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

6.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><span></span><em><?if($PHOTO_NAME$)?><?if(len($PHOTO_NAME$)>25)?><?substr($PHOTO_NAME$,0,23)?>...<?else?>$PHOTO_NAME$<?endif?><?endif?></em><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>


6.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

img {
  border: none;
}

.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  margin: 20px;
  padding: 0;
  float: left;
  position: relative;
  width: 212px;
  height: 175px;
}

.gallery a {
  text-decoration: none;
  color: #666;
}
.gallery a:hover {
  color: #000;
  text-decoration: underline;
}
.gallery img {
  padding: 20px 0 0 21px;
}
.gallery em {
  width: 216px;
  background: url(/images/gold-frame.png) no-repeat;
  display: block;
  position: absolute;
  top: -2px;
  left: -2px;
  text-align: center;
  font: 100%/100% Georgia, "Times New Roman", Times, serif;
  padding-top: 168px;
}
</style>

<!--[if lt IE 7]>
<style type="text/css">
  .gallery em { behavior: url(iepngfix.htc); cursor: pointer; }
</style>
<![endif]-->


6.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


6.5 Закачать в корневую папку сайта файл iepngfix.htc из архива с исходниками
6.6 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файл gold-frame.png из архива с исходниками.

Решение №7

С помощью данного решения оформления миниатюры на главной фотоальбома приобретут акварельную рамку





Установка:

7.1 Установить в настройках модуля "Фотоальбомы" размеры демо-картинки 170х120

7.2 Заменить код в шаблоне "Вид фотографий" на следующий:

Code

<li><a href="$PHOTO_URL$"><span></span><em><?if($PHOTO_NAME$)?><?if(len($PHOTO_NAME$)>25)?><?substr($PHOTO_NAME$,0,23)?>...<?else?>$PHOTO_NAME$<?endif?><?endif?></em><img src="$PHOTO_DIRECT_URL$" alt="image" /></a></li>


7.3 Добавить стили css в секцию HEAD шаблона "Главная страница фотоальбома"

Code

<style type="text/css">

img {
  border: none;
}

/* ---------- gallery styles start here ----------------------- */
.gallery {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gallery li {
  margin: 10px;
  padding: 0;
  float: left;
  position: relative;
  width: 212px;
  height: 175px;
}

.gallery a {
  text-decoration: none;
  color: #999;
}
.gallery a:hover {
  color: #000;
  text-decoration: underline;
}
.gallery img {
  border: none;
  padding: 14px 12px 12px 13px;
}
.gallery em {
  width: 193px;
  height: 25px;
  display: block;
  position: absolute;
  top: 2px;
  left: 2px;
  background: url(/images/watercolor-mask.png) no-repeat;
  text-align: center;
  font: italic 100%/100% Georgia, "Times New Roman", Times, serif;
  padding-top: 140px;
}

</style>

<!--[if lt IE 7]>
<style type="text/css">
  .gallery em { behavior: url(iepngfix.htc); cursor: pointer; }
</style>
<![endif]-->


7.4 Там же, в шаблоне "Главная страница фотоальбома" найти в коде следующее

Code
$BODY$


и переписать таким образом

Code
<ul class="gallery">$BODY$</ul>


7.5 Закачать в корневую папку сайта файл iepngfix.htc из архива с исходниками
7.6 Создать (если не создана ранее) в файловом менеджере папку images и закачать в неё файл watercolor-mask.png из архива с исходниками.

Итак, вы увидели семь различных вариантов оформления вида материалов на главной странице модуля "Фотоальбомы" системы uCoz, надеюсь они вам понравятся и вы с успехом используете их на страницах своих сайтов!

Продолжение следует!



Источник
Адаптация для uCoz: PS-Studio.Info
Ссылка:
BB-код:
HTML-код:

Ещё по теме:

Всего комментариев: 11
  1.   Нет оценки: 0
    11  saw 2012-01-10, 11:42

    Quote

    saw, спасибо!!!
    Быстро, четко и внятно - все сделал, ибо понятно!
    Мои благодарности!
    Еще вопрос в догонку - как изменить положение Категории на фото? Перенес на верх (это ладно), нужно немного опустить и свинуть на фото...
    Подскажите?


    Подскажем, в шаблоне "Вид фотографий" код заменяем на такой:

    Code

    <li><a href="$PHOTO_URL$"><img src="$PHOTO_DIRECT_URL$" alt="image" />  
    <?if($CAT_NAME$)?><a class="ctg" href="$CAT_URL$"><?if(len($CAT_NAME$)>25)?><?substr($CAT_NAME$,0,23)?>...<?else?>$CAT_NAME$<?endif?></a><?endif?>
      <?if($RATING$=0)?><span class="favorite0"></span><?endif?>  
      <?if($RATING$=1)?><span class="favorite1"></span><?endif?>  
      <?if($RATING$=2)?><span class="favorite2"></span><?endif?>  
      <?if($RATING$=3)?><span class="favorite3"></span><?endif?>  
      <?if($RATING$=4)?><span class="favorite4"></span><?endif?>  
      <?if($RATING$=5)?><span class="favorite5"></span><?endif?>
      </a></li>  


    а в CSS-стили добавляем строку:

    Code

    .ctg {display: block;  
      position: absolute;  
      top: 10px;  
      left: 10px;}

  2.   Понравилось: +1
    10  lifecool 2012-01-09, 08:30

    saw, спасибо!!!
    Быстро, четко и внятно - все сделал, ибо понятно!
    Мои благодарности! smile
    Еще вопрос в догонку - как изменить положение Категории на фото? Перенес на верх (это ладно), нужно немного опустить и свинуть на фото...
    Подскажите?

  3.   Нет оценки: 0
    9  saw 2012-01-08, 20:20

    Quote

    Бился весь день - пришлось прощаться с мозгом
    А узнать хочу только одно - как на новых фото с новыми настройками, немного опустить отображение оценки? (Решение №2). Старое так и осталось, как осталось. Как быть с новыми? Решения в сети не нашел Понял только, что в обработке нуждается код CSS, но что там именно!?
    Буду благодарен за помощь!


    в CSS стилях редактируйте здесь

    Code

      .gallery span {  
      width: 40px;  
      height: 40px;  
      display: block;  
      position: absolute;  
      bottom: 10px;  
      right: 10px;  
      }  


    параметр bottom:10px;

  4.   Нет оценки: 0
    8  lifecool 2012-01-08, 16:55

    Бился весь день - пришлось прощаться с мозгом biggrin
    А узнать хочу только одно - как на новых фото с новыми настройками, немного опустить отображение оценки? (Решение №2). Старое так и осталось, как осталось. Как быть с новыми? Решения в сети не нашел sad Понял только, что в обработке нуждается код CSS, но что там именно!?
    Буду благодарен за помощь!

  5.   Понравилось: +1
    7  Егор 2012-01-07, 09:18

    Ещё раз спасибо за ответы и за Ваш отличный сайт! Всё заработало!

  6.   Нет оценки: 0
    6  saw 2012-01-07, 07:38

    Вот соорудил небольшое демо

    Демо

  7.   Нет оценки: 0
    5  saw 2012-01-07, 07:31

    ну зачем же скриптом, тут всё довольно просто: исходя из общей ширины поля страницы нужно сначала уменьшить размеры фотографий (пропорционально), например, размеры фотографии на демо-странице были 170х120, я уменьшил их до 120х87, чтобы на том же месте уместилось 5 рядов, а дальше всё просто: редактируем код таблицы:

    Code

    <ul class="gallery"><table border="0" cellspacing="1" cellpadding="3" width="100%">
    <tr>
    <td class="phtTdMain"><li><a href=""><em>Дорога</em><img src="http://pstest.ucoz.ru/images/1.jpg" alt="image" width="120" height="87"/></a></li>     
    </td>
    <td class="phtTdMain"><li><a href=""><em>Капля</em><img src="http://pstest.ucoz.ru/images/2.jpg" alt="image" width="120" height="87"/></a></li>     
    </td>
    <td class="phtTdMain"><li><a href=""><em>Трасса</em><img src="http://pstest.ucoz.ru/images/3.jpg" alt="image" width="120" height="87"/></a></li>     
    </td>
    <td class="phtTdMain"><li><a href=""><em>Водопад</em><img src="http://pstest.ucoz.ru/images/4.jpg" alt="image" width="120" height="87"/></a></li>     
    </td>
    <td class="phtTdMain"><li><a href=""><em>Замок</em><img src="http://pstest.ucoz.ru/images/5.jpg" alt="image" width="120" height="87"/></a></li>     
    </td></tr><!-- Здесь закончился первый ряд фото и начинается второй -->
    <tr><td class="phtTdMain"><li><a href=""><em>В лесу</em><img src="http://pstest.ucoz.ru/images/6.jpg" alt="image" width="120" height="87"/></a></li>     
    </td></tr><tr></tr></table></ul>


    Последним шагом нужно подкорректировать в css-стилях положение прямоугольника с заголовком фотографии, ведь когда я изменил размеры фото, положение прямоугольника с заголовком тоже поменяется, потому что оно задается относительно высоты фото, в примере это top: 110px; то есть заголовок расположен от верха фото на расстоянии в 110px при заданной высоте фото 120px:

    Code

    .gallery em {     
         background: #fff url(/images/grey-gradient.gif) repeat-y;     
         color: #000;     
         font-style: normal;     
         padding: 2px 10px;     
         display: block;     
         position: absolute;     
         top: 110px;     
         left: 9px;     
         border: 1px solid #999;     
         border-left-color: #888;     
         }


    если я поменял размеры фото, в частности, его высоту с 120 до 87px, то координату заголовка по высоте тоже меняем с 110 на 77px (получается, что от низа фото останутся те же 10px)

    Code

    .gallery em {     
         background: #fff url(/images/grey-gradient.gif) repeat-y;     
         color: #000;     
         font-style: normal;     
         padding: 2px 10px;     
         display: block;     
         position: absolute;     
         top: 110px;     
         left: 9px;     
         border: 1px solid #999;     
         border-left-color: #888;     
         }

  8.   Понравилось: +1
    4  Егор 2012-01-07, 06:00

    Спасибо большое! Это то, что было нужно. Только вот все настройки полностью берутся из класса gallery. У меня в фотоальбоме по ширине - 3 колонки с фотографиями. А на этой странице хочу сделать 5 колонок и фотографии меньшего размера. Размер изменить не проблема, а вот с количеством колонок - загвоздка. Может это решается каким то отдельным классом или скриптом?

  9.   Нет оценки: 0
    3  saw 2012-01-04, 10:03

    а потом коде шаблона "Страницы сайта" в секции HEAD добавить стили CSS для оформления галереи

    Code

    <style type="text/css">  
      
      h1 em {  
      border: dashed 1px #e3792c;  
      display: block;  
      padding: 10px 0;  
      font-style: normal;  
      }  
      
      img {  
      border: none;  
      }  
      
      .gallery {  
      list-style-type: none!important;  
      margin: 0;  
      padding: 0;  
      }  
      .gallery li {  
      padding: 10px;  
      margin: 0;  
      float: left;  
      position: relative;  
      width: 180px;  
      height: 130px; list-style-type: none!important;  

      }  
      .gallery li:hover img {  
      border-color: #000;  
      }  
      .gallery img {  
      background: #fff;  
      border: solid 1px #888;  
      padding: 5px;  
      }  
      .gallery em {  
      background: #fff url(http://pstest.ucoz.ru/demo/1/images/grey-gradient.gif) repeat-y;  
      color: #000;  
      font-style: normal;  
      padding: 2px 10px;  
      display: block;  
      position: absolute;  
      top: 110px;  
      left: 9px;  
      border: 1px solid #999;  
      border-left-color: #888;  
      }  
      .gallery a {  
      text-decoration: none;  
      }  
      .gallery a:hover em {  
      background: #ffdb01 url(http://pstest.ucoz.ru/demo/1/images/orange-gradient.gif) repeat-y;  
      border-color: #c25b08;  
      }  
      </style>

  10.   Нет оценки: 0
    2  saw 2012-01-04, 10:03

    Здравствуйте!

    Если я вас правильно понял, вопрос ваш в том, как создать еще одну страницу сайта? и на ней сделать оформление по примеру №3, верно?

    вам нужно войти в панель управления сайтом, далее в Редактор страниц и там увидите кнопку "Добавить страницу", жмёте, откроется окно добавления новой страницы сайта, в нём нужно разместить html-код фотогалереи типа

    Code

    <ul class="gallery"><table border="0" cellspacing="1" cellpadding="3" width="100%"><tr><td class="phtTdMain"><div id="entryID12"><li><a href=""><em>Дорога</em><img src="http://pstest.ucoz.ru/images/1.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td><td class="phtTdMain"><div id="entryID11"><li><a href=""><em>Капля</em><img src="http://pstest.ucoz.ru/images/2.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td><td class="phtTdMain"><div id="entryID10"><li><a href=""><em>Трасса</em><img src="http://pstest.ucoz.ru/images/3.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td></tr><tr><td class="phtTdMain"><div id="entryID9"><li><a href=""><em>Водопад</em><img src="http://pstest.ucoz.ru/images/4.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td><td class="phtTdMain"><div id="entryID8"><li><a href=""><em>Замок</em><img src="http://pstest.ucoz.ru/images/5.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td><td class="phtTdMain"><div id="entryID7"><li><a href=""><em>В лесу</em><img src="http://pstest.ucoz.ru/images/6.jpg" alt="image" width="170" height="120"/></a></li>  
      <?if($RATING$)?><div style="clear:both;padding:5px 5 5 10px;"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?></div></td></tr><tr></tr></table></ul>

1-10 11-11
Имя *:
Email:
Код *: