![Слайдер карусель зі звичайного слайдера (FastStone Image Viewer) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-eabde65e.png)
Доброго вам дня! Бажаю всім бути здоровими.
Частина третя про слайдерах. У статті мова піде про каруселі. Карусель слайдер шоу той же, що і звичайний слайдер тільки із серії зображень. Ставити собі таке задоволення чи ні це ваша справа і право, але погодьтеся коли на вашому блозі вже більше 60-70 постів і 20 хоча б ви вважаєте з них стоять, то перед вами проблема, як можна більш доступнішою розташувати ваші ранні пости для відвідування.
Весь сенс у слайдері, це звернути увагу на ранні пости або самі інформаційні. Інакше кажучи якомога довше затримати відвідувача зацікавивши його матеріалом. І заінтригувати його можна тим, що пости не лежать десь на полицях, як в бібліотеці, а самі вистрибують, змінюються і рясніють картинками, так і просяться візьми і кликни. Всі ми люди дикуни, побачив блискучу упаковку і рука тягнеться. Ось хоча б Макдональдс - ну банально, не смачно, не свіжіше, абсолютно не корисно зате чергу з дикунів. Голодні чи що? Та ні, на упаковку самого фастфуду купилися.
Плагін M-vSlider я випробував у всіх режимах і швидкість перевіряв до установки і після, різниці не помітив взагалі, тому як спочатку вантажиться тіло сайту, а потім сам слайдер.
А тепер на рахунок каруселей, багато цікавого є, але знову ж таки занадто трудомістким, код прописувати, зображення, там додавати скрипт, там код, тут прописувати url картинки. При всіх рухах простіше і зручніше. у всякому разі для мене, зробити карусель самому з слайдера M-vSlider.
У звичайних каруселях крутяться від сили 12 картинок, причому в самих наворочених, тобто 12 постів світиться. У нашому слайдері зробленому власними руками можна зробити 30 і це не межа, більше не пробував.
Ну-с, приступимо. Перша дія установка, знайшли в пошуку, встановили та активували. Тепер нам потрібно визначиться
- де буде слайдер карусель
- розміри каруселі
- пости для каруселі
- підготувати картинки для каруселі
- Дрімвівер для створення таблиці
Визначень начебто і багато, але це на перший погляд, насправді все це займе хвилин 15-20. Згоден, що в перший раз годину або два піде, але і то на підготовку картинок 90% часу, а на збірку каруселі хв 10 цілком вистачає.
Міряємо наш контент, для того щоб знати розмір ширини каруселі. Найкраще для цього підійде відмінний інструмент FastStone Image Viewer
Розмір потрібен приблизний, у мене близько 620 пікселів, все одно потім відредагуємо на сайті при установці точніше. Тепер визначимося з картинками. якщо зробити в ряд 5 зображень, то картинки будуть по дрібніше, чотири - побільше.
Роблю 4. Беремо 2 пікселя за відстань між картинками, якщо чотири зображення, значить 5 х 2 = 10 тепер 610/4 = 152,5 вийшло коротше кажучи 152 пікселя ширина картинки. Ширину потім відредагуємо більш точно за місцем.
Значить найрозумніше брати зображення 152 х 144, беремо це за основу.
Вибираємо зображення згідно постам за змістом. Йдемо в Power Point вибираємо формат по симпатичніше, для всіх зображень одного типу і вирізаємо або Snagit або FastStone Image Viewer
![Слайдер карусель зі звичайного слайдера (слайдера) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-5f6b9476.png)
Краще і зручніше робити серії по 5 картинок, щоб не заплутатися, відібрали 5 статей, 5 зображень приготували потрібного розміру. Як ви вже здогадалися у нас буде 4 слайдера в одній каруселі
Зайдемо в налаштування поставимо наші розміри, виберіть опцію без рамок (або з рамками, кому як), менше простору корисного займає.
![Слайдер карусель зі звичайного слайдера (слайдера) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-84eb6b58.png)
![Слайдер карусель зі звичайного слайдера (карусель) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-e9ed9eff.png)
![Слайдер карусель зі звичайного слайдера (слайдер) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-ebdd432e.png)
Наступний слайдер створюється в панелі M-vSlider, тиснемо зліва на «M-vSlider Setup» і переходимо в панель, тут в поле вписуємо назву другого слайдера, можна по темі. я написав 2 по англійськи
![Слайдер карусель зі звичайного слайдера (слайдер) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-dfebd64c.png)
і додаємо кнопкою, потрапляємо в панель налаштувань другого слайдера, наша пісня гарна й нова - починаймо її знову ...
Після завантаження і редакцію останнього слайдера переходимо в початкову панель і бачимо таку картину
![Слайдер карусель зі звичайного слайдера (слайдер) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-ad3821c7.png)
На скріншоті відзначений порядок копіювання коду, копіюємо обидва відразу, зліва направо, про це нижче ...
Ось тепер нам знадобиться Adobe Dreamweaver CS6 відкриваємо його
![Слайдер карусель зі звичайного слайдера (слайдера) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-e85cf91d.png)
і ділимо на два екрани, Код та Дизайн
![Слайдер карусель зі звичайного слайдера (слайдер) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-cc71964e.png)
Весь код в лівому вікні прибираємо, нам він не потрібен, тиснемо кнопка вставка / таблиця
![Слайдер карусель зі звичайного слайдера (карусель) Слайдер карусель зі звичайного слайдера](https://images-on-off.com/images/167/slayderkaruselizobichnogoslaydera-813ce32b.png)
Задаємо розміри таблиці, ширина вибираєте як у вас. все інше як у мене 🙂. на скрині. Далі копіюємо коди як на скрині з слайдером, копіюємо і вставляємо по черзі. З першого по останній. Вставляємо замість цього символи в код таблиці перший код першого слайдера.