Nivo Slider

Вам необходимо переместить код вашего слайдера из шаблона (скорее всего "Страница") в шаблон "HTML" вставив его перед строкой

<div style="background:#fff; width:966px; min-height: 400px; padding-top:30px; border:1px solid #E5E5E5;">

В шаблоне HTML найдите строку ( примерно 883 строка)

<div style="z-index:3;  height: 40px;width:248px;position:absolute;  margin-left:-476px;  left:50%; top: 194px; background: #f6f6f6;" >
</div>

и удалите ее

Извиняюсь за возникшее недопонимание. Данная задача со слайдером является наиболее простой для любого даже начинающего верстальщика, да и инструкций полно, но некоторые мелочи очевидные ему не всегда могут быть очевидны не столь подготовленному пользователю. Попробую рассказать с максимумом деталей, на примере нашей системы, нашего редактора тем, нашего html редактора шаблонов о том как поставить слайдер на свой сайт Nivo Slider... Итак поехали:

• Скачиваем себе на компьютер следующий архив, я его специально подготовил, все до одного лишние файлы удалил:
     slider.zip
  
• Распаковываем на своём компьютере.
  
• Заходим в панель управления магазином, через форму авторизации.
  
• Переходим в раздел "Сайт" > "Редактор тем".
  
• Скролим вниз до блока файлов, нажимаем кнопку добавить файлы, появится 5 полей для файлов.
  nyro1.jpg
  
• В каждое поле вставляем те файлы, что распаковались из архива, их как раз 5.
  nyro2.jpg
  
• Проверяем закачались ли эти файлы, выглядят они в редакторе тем как-то так:
  nyro3.jpg
  
• Открываем файл HTML, находим следующий код (у меня это 53 строка, используйте встроенный поиск браузера, Ctrl+f, чтобы не искать глазами.):
  

  <!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
  

  
  После него вставляем вот такой код:
  

  <!-- Загрузка Jquery галереии Nyro -->
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyro_default.css" type="text/css" media="screen" />
  <script src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js" type="text/javascript"></script>
  

  
  Получается как-то так:
  

  <!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
  
  <!-- Загрузка Jquery галереии Nyro -->
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyro_default.css" type="text/css" media="screen" />
  <script src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js" type="text/javascript"></script>
  

  
  В браузере выглядит так:
  nyro4.jpg
  
• Нажимаем кнопку "сохранить" сверху.
  
• Далее скролим вниз этого файла (html) находим (естественно встроенным поиском, Ctrl+f, глазами искать не всегда есть гуд.) вот такой не сложный код:
  

  {BODY}
  

  
  Перед ним! Вставляем вот такой код:
  

  <!-- Вешаем слайдер на главной -->
  {% IF index_page %}
  <!-- Обёртка, указывающая стиль темы -->
  <div class="theme-default" style="padding-top:1em;">
  <!-- Непосредственный код слайдера -->
  <div id="slider">
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider.png" alt="" />
  <a href="http://dev7studios.com"><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/nemo.png" alt="" /></a>
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/toystory.png" alt="" title="Пример картинки с заголовком" />
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/walle.png" alt="" />
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/cars.png" alt="" />
  </div>
  </div>
  
  <!-- Запуск слайдера -->
  <script type="text/javascript">
  $(window).load(function() {
  $('#slider').nivoSlider();
  });
  </script>
  {% ENDIF %}
  

  
  Получается вот так:
  

  <!-- Вешаем слайдер на главной -->
  {% IF index_page %}
  <!-- Обёртка, указывающая стиль темы -->
  <div class="theme-default" style="padding-top:1em;">
  <!-- Непосредственный код слайдера -->
  <div id="slider">
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider.png" alt="" />
  <a href="http://dev7studios.com"><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/nemo.png" alt="" /></a>
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/toystory.png" alt="" title="Пример картинки с заголовком" />
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/walle.png" alt="" />
  <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/cars.png" alt="" />
  </div>
  </div>
  
  <!-- Запуск слайдера -->
  <script type="text/javascript">
  $(window).load(function() {
  $('#slider').nivoSlider();
  });
  </script>
  {% ENDIF %}
  
  {BODY}
  

• Нажимаем кнопку "сохранить", выглядит это так:
  nyro5.jpg
  
• Заходим на главную страницу сайта, нажимаем F5 либо Ctrl+R
  
• Должен получиться вот такой результат:
  nyro6.jpg nyro7.jpg nyro8.jpg

Если слайдер не завёлся и не поехал, то видимо что-то сделали не так, напишите об этом постараюсь рассказать ещё детальней о том месте, где возникла ошибка.

Пример живого слайдера (демо)

Здравствуйте! Ваши изображения очень большого размера, уменьшите их разрешение в графическом редакторе(фотошоп)

А так? не отображается ссылка вк, и картинки слайдера. Картинки 700*300рх
qNw7N8uXwvc.jpg PBgQ6g6njBk.jpg IHGwWSpRMNA.jpg

Изображения слайдера не отображаются по тому что они не доступны по указанным ссылкам. Попробуйте загрузить свои изображения в раздел Сайт -> Файлы и указать их в html коде:

<div id="slider">
								 <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider_1.jpg" alt="" />
								 <a href="http://dev7studios.com"><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider_2.jpg" alt="" /></a>
								 <img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider_3.jpg" alt="" />
							 </div>

Тут в атрибуте src указаны ссылки на изображения.
В атрибуте href ссылка на страницу.

И так же не доступны изображения для иконки вк. В коде:

<a href="https://vk.com/keksik_for_you"><img src="http://foto.nnov.ru/psh200/0/55/dd/58/1d/7b/c2/9af0a353f45d06cb.gif" border=0 alt="Мы в Контакте"></a>

Тут вам нужно будет загрузить свое изображение в раздел Сайт -> Файлы. И затем ссылку на нее указать в атрибуте src.

код вставила, картинки загрузила. Ничего не изменилось и размер слайдера такой же огромный.
Для ссылки вк должно быть так как на картинке, т.е. там и название видно и участников можно отдельно открыть и кнопка подписаться

Вы пользовались инструкцией по установки слайдера http://storeland.ru/about/faq#51
И код для группы вк нужно генерировать на сайте vk а потом уже вставлять этот код на сайт.
http://forum.storela...ппа-вк-на-сайт/