Magento. Как добавить больше слайдов в слайдер

Из этого туториала Вы узнаете, как добавить больше слайдов в слайдер в Magento.

Magento. Как добавить больше слайдов в слайдер

Для того чтобы добавить больше слайдов в слайдер, следуйте таким инструкциям:

1. Войдите в админ панель, перейдите на вкладку CMS->Статические блоки (CMS->Static Blocks):

   

2. Найдите Блок «Слайдер» (Slideshow block) и откройте его:

   

3. Откройте поле «Содержимое» (Content field). Здесь Вы увидите код слайдера:

   

4. Для того чтобы добавить новый слайд, скопируйте часть кода, которая выводит один слайд. Скопируйте следующий фрагмент кода и поместите его над или под существующим кодом:

           <div data-src="{{skin url='images/camera/slides/slide3.jpg'}}">
               <div class="camera_caption fadeIn">
                 <a href="{{store url='headphones.html'}}">
                  <div class="container">
                   <div class="camera_caption_txt">
                     <p>The Best</p>
                      <h6>Musical Instruments</h6>
                       <span>Mes cuml dia sed inenias ingerto lot aliiqt dolore ipsumcommete.</span>
                       </div>
                       </div>
                       </a>
                     </div>
                   </div>
	          



5. Для того чтобы отобразить новое изображение в слайдере, перейдите на вкладку Главное меню (Top menu) и нажмите на кнопку Вставить изображение (Insert Image). Нажмите на кнопку Искать (Browse) и нажмите на кнопку Загрузить (Upload), для того чтобы загрузить новое изображение с вашего компьютера:

   

6. Выберите новое изображение и нажмите на кнопку Вставить файл (Insert File) в правом углу формы:

   

7. После этого шага Вы получите путь к файлу нового изображения:

   

8. Для того чтобы отобразить новое изображение в слайдере, замените «{{skin url=’images/camera/slides/slide3.jpg’}}»> на новый путь к файлу «{{media url=»wysiwyg/new_image.jpg»}}» alt=»» />. Сохраните изначальную структуру кода:

   

   

9. Удалите те части кода, что не будут использованы: <img src.

10. После внесения изменений, код будет выглядеть следующим образом:

               <div data-src="{{media url="wysiwyg/new_image.jpg"}}" alt="" />
                   <div class="camera_caption fadeIn">
                     <a href="{{store url='headphones.html'}}">
                      <div class="container">
                       <div class="camera_caption_txt">
                         <p>The Best</p>
                          <h6>Musical Instruments</h6>
                           <span>Mes cuml dia sed inenias ingerto lot aliiqt dolore ipsumcommete.</span>
                           </div>
                           </div>
                           </a>
                         </div>
                       </div>
    	          

11. Сохраните изменения и обновите ваш сайт. Вы можете видеть, что слайд был успешно добавлен.

Более того, Вы можете добавить новый слайд следующим образом:

1. Измените название изображения в папке skin, например, переименуйте slide3.jpg в slide4.jpg .<div data-src=»{{skin url=’images/camera/slides/slide4.jpg’}}»>. Сохраните изначальную структуру кода:

   

2. Загрузите новое изображение под названием slide4.jpg в следующую папку: skin/frontend/themes/themeXXX/images/camera/slides/.

3. Сохраните изменения. Вы можете видеть, что новый слайд был успешно добавлен.

Вы можете также ознакомиться с детальным видео-туториалом ниже:

Magento. Как добавить больше слайдов в слайдер