Слайдер с текстом для Вордпресс — плагин Master Slider. Wordpress слайдер
MetaSlider | WordPress.org
Create powerful, SEO-optimized slideshows in minutes with the world’s #1 slider plugin!
With WordPress’ most popular slider plugin, enhancing your blog or website couldn’t be easier: simply select images from your WordPress Media Library, drag and drop them into place, and then set the slide captions, links and SEO fields all from one page.
Choose one of 4 different slideshow types, and use our provided short-code or template to embed the slideshows.
Included slideshow types:
- Flex Slider 2 — responsive, 2 transition effects, carousel mode
- Nivo Slider — responsive, 16 transition effects, 4 themes
- Responsive Slides — responsive & incredibly light weight
- Coin Slider — 4 transition effects
Возможности
- Simple, easy to use interface — perfect for individual users, developers & clients!
- Create Responsive, SEO-optimized slideshows in seconds
- Unrestricted support for Image slides (supports caption, link, title text, alt text)
- Full width slideshow support
- Drag and drop slide reordering
- Admin preview
- Intelligent image cropping
- Set image crop position
- Built in Widget and Shortcode
- Loads of slideshow configuration options — transition effect, speed etc (per slideshow)
- Fully localized
- WordPress Multi Site compatible
- Compatible with translation plugins (WPML, PolyLang & qTranslate)
- Extensive Developer API (hooks & filters)
- Fast — only the minimum JavaScript/CSS is included on your page
- Free basic support (covering installation issues and theme/plugin conflicts)
- Lightbox support with the MetaSlider Lightbox addon
General:* Simple and intuitive interface – perfect for individual users, developers & clients!* Fast – requires only the minimum JavaScript/CSS on your page* Creatively responsive
Creative:* Unrestricted full-width support for image slides, including captions, links, title texts and alt. texts.* Includes drag and drop slide reordering, intelligent image cropping, set image crop position.* Multiple slideshow configuration options (e.g. for speed,* Has Admin Preview
Other:* Includes Admin preview, plus built-in Widget and Short-code* Fully localized* WordPress Multi-site compatible, and* compatible with translation plugins (WPML, PolyLang & qTranslate)* Developer Friendly, with extensive hooks & filters
Support:* Includes free basic support (covering installation issues and theme/plugin conflicts).
The MetaSlider Pro includes added support for:
- YouTube & Vimeo slides
- HTML slides
- Layer slides with CSS3 animations & HTML5 Video backgrounds
- Dynamic Post Feed/Featured Image Slides (content slider)
- Custom Themes
- Thumbnail Navigation
- Premium Support
Read more and thanks to:
Find out more at https://www.metaslider.com
Follow us on Twitter: @wpmetaslider
ru.wordpress.org
Слайдер WordPress на русском: сделать быстро и самостоятельно
Уважаемые посетители, приветствую вас на страницах моего блога start-luck. Сегодня я расскажу как просто, а главное бесплатно поставить красивый слайдер на ваш сайт. Он будет привлекательным элементом дизайна для любой статьи или отличной альтернативой рекламному блоку, с которого вы можете получать прибыль.
С 2013 года всевозможные исследования пророчат слайдерам скорый уход со страниц интернета, но их популярность до сих пор не угасает. Что ни говорите, они «оживляют» портал, привлекают внимание к информации. На них так и хочется нажать. Конечно, если слайдер красив и грамотно составлен, но к этому мы еще вернемся.
Я буду рассказывать про слайдер WordPress. Как привнести в свой сайт что-то привлекательное и интересное быстро, бесплатно и даже не обладая особенными знаниями. Обсудим стоит ли делать его своими руками. А также вы получите несколько полезных советов по наполнению.
Ну что, приступим?
Meta Slider
Для начала мне бы хотелось рассказать вам про лучший плагин для сайта на ВордПресс. Редкий случай, когда удается найти что-то ценное и бесплатное одновременно.
Если вы читали мою статью про то, как при помощи дополнительного софта создать продающую страницу на ВордПресс, то помните, как я был возмущен некоторыми предложениями. Утилита из той публикации еще и денег стоила.
Положительнее я отнесся к сервису для баннеров. Создавать я там не рекомендовал, но у него были свои преимущества. Так что я все-таки нашел ему применение. Предложенный ресурс можно было использовать с выгодой. Что касается утилиты для слайдера, о котором сегодня пойдет речь, то я очень доволен.
Называется программа, как вы уже поняли из заголовка — Meta Slider. Она на русском и сделать в ней можно очень красивые элементы с переходами, ссылками на нужные страницы, в ней есть множество дополнительных настроек.
Meta Slider позволит с легкостью и быстротой добавить новый блог на главную страницу или в публикацию, если вам нужна симпатичная галерея.
Ну что ж, давайте я покажу как работать с программой.
Установка
Итак, подробную статью о том, как найти и добавить приложение на WordPress вы можете прочитать в моем блоге. Кратко повторим что делать в конкретной ситуации. Заходим в раздел плагины и выбираем из списка опцию «Добавить новый» в поисковую строчку в правом верхнем углу вбиваем: «Meta Slider» и Enter. Как только страница с нужным приложением открывается, жмем «Установить».
Не забудьте активировать Meta Slider через вкладку «Установленные» или в открывшемся окне после установки.
В результате в панели управления справа должна появиться новая категория. Вы можете купить Pro-версию за 19$ или пользоваться бесплатной, на мой взгляд ее функций вполне хватает, так приобретение совсем не обязательно.
Возможности
Теперь давайте разберемся как создать и вставить карусель, иногда слайдер называют еще и так. Проходим в приложение по ссылке справа (в панели администратора ВордПресс) и жмем на плюс рядом фразой «Добавить новый».
Далее привычным образом закидываем слайды, сперва нажав на кнопку «Добавить».
Вы можете загружать сколько угодно фотографий, но не рекомендую перебарщивать. Слишком много никто просматривать не станет. Оптимальное число колеблется от трех до восьми.
Справа от загруженных картинок находится поле, куда вы можете ввести адрес страницы, на которую будет переходить человек при нажатии на фото. Также вы можете добавить описание, обрезать рисунок и вставить теги Title и alt к изображениям.
Также у вас есть 4 варианта дизайна. В видео чуть ниже я покажу как выглядит каждый из них.
Pro версия предполагает все варианты эффектов, то есть как один слайд будет сменять другой, для каждого метода отображения. В бесплатной версии возможности ограниченны. Но их все равно предостаточно. Хороший вариант вы найдете.
Помимо 4 основных вариаций дизайна вы можете выбрать еще одну из четырех цветовых схем.
Помимо этого всего, есть еще и дополнительная настройка. Если вы хотите предоставить читателю возможность управления перемоткой, нужно поставить галочку рядом со словом «Стрелки». Навигация также возможна посредством точек. Обязательно давайте читателю возможность самостоятельного управления, особенно если это рекламный блок.
Что касается размеров, то вы можете их поставить. Однако плагин не тупой, он видит максимальные ограничения и автоматически встраивается в дизайн. Если вы устанавливаете его в боковые панели главной страницы, чуть позже я покажу как это сделать, то пропорции изменятся автоматически.
Далее идут «Расширенные настройки». Тут можно увеличить или уменьшить длительность показа кадров и скорость анимации. Они не должны двигаться очень быстро, иначе с вашего сайта уйдут. Если фотографий много лучше разрешить показ картинок вразнобой.
Во время смены изображения, картинка может делиться на несколько частей. Не советую указывать небольшое количество. В противном случае будет рябить в глазах. Ну а вместо стрелок для перемотки рекомендую добавить свой текст.
На скриншоте ниже вы можете посмотреть созданный мною слайдер. Чтобы было проще, рекомендую использовать возможность предварительного просмотра. В меню создания есть две полезные кнопки справа сверху: «Показать», чтобы увидеть изменения, и сохранить.
В самом низу правой панели есть шорт-код для вставки в записи и css-код для шаблона. Продвинутым разработчикам это нужно, а новичкам я покажу как добиться стильного эффекта простыми методами. Но об этом чуть позже.
Сперва посмотрите как выглядит слайдер в деле. Конечно же, все нужно тестировать на собственном сайте, многое я упустил и не показал в этом видео, но вы уже сможете создать примерное представление о программе.
Интеграция в блог
Вставить созданную карусель не сложно. Для этого ничего особого копировать не надо. Единственное, о чем я забыл упомянуть в предыдущем пункте, называйте свои слайдеры корректно, чтобы не запутаться.
Откройте запись, в которую хотите добавить новый слайдер, или создайте новую. Далее поставьте курсор в предполагаемое место, где расположится карусель. Теперь нажмите «Добавить слайдер», кнопка находится в верхней части рабочего поля.
Выбираем из списка нужное название и кликаем «Вставить слайдшоу».
Готово. В моем случае на сайте это будет выглядеть вот так.
Чтобы поставить блок на главной странице зайдите в категорию «Внешний вид» — «Виджеты». В верхней части вы увидите «Meta Slider».
Перенесите эту плашку в нужное место, где должен будет стоять слайдер. Если вы хотите поставить его сразу после поиска, то и в этом списке он должен будет находиться здесь. Выберите слайдер из списка созданных и сохраните изменения.
На моем тестовом сайте блок справа выглядит так.
Дизайн этого сайта предполагает размещение в контентной области и подвале, нижней части сайта. Если я захочу добавить блок сюда, то я просто перенесу плашку в нужное место.
Отображение на сайте сразу изменится.
В завершение хотелось бы дать вам несколько рекомендаций. Если вы хотите получать неплохой заработок от рекламы, я настоятельно советую вам не скупиться на дизайн самих картинок. Одному человеку требуется много времени, чтобы разобраться во всех тонкостях маркетинга, прочитать уйму книг по визуальной рекламе и отточить навыки дизайна.
Пока не сможете развиться в этой области, советую прибегнуть к помощи фрилансеров. Сделать это можно на сайтах WebLancer.net и FL.ru. Первый чуть проще, а на втором вы можете повстречать настоящих профессионалов.
Цена зависит от вашего бюджета, но думаю, что картинка обойдется вам максимум в 500 рублей. За эту сумму можно купить и три, но в этом случае желающих исполнить заказ будет меньше, а значит и результат вы получите хуже.
Я желаю вам успехов и если эта статья вам понравилась – подписывайтесь на рассылку. До новых встреч.
start-luck.ru
Cлайдер записей wordpress — ТОП
Здравствуйте !
Сегодня я расскажу и покажу как сделать на своём сайте слайдер записей wordpress. Что это такое ? в слайдере будут отображаться записи вашего сайта, а точнее главное изображение записи, заголовок записи, отрывок текста из записи и ссылка для перехода на страницу записи. Конечно слайдер можно будет настроить, например можно будет выбрать показывать или не показывать изображение в слайдере или заголовок и т.д. В общем, о том как настроить слайдер, я подробно расскажу в данной статье. Вот скриншот примера слайдера:
Создать слайдер записей wordpress, можно будет с помощью плагина — Carousel Horizontal Posts Content Slider. Установить данный плагин вы сможете прямо из своей админ-панели wordpress. Перейдите по вкладке: Плагины — Добавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте открывшийся плагин.
Чтобы настроить плагин, перейдите по вкладке: CHPC Slider.
Разберём настройки: (General)
— Show featured image, включить показ изображений в слайдере ? Enable — включить.
— Show direction arrows, включить стрелки в слайдере ? Enable — включить.
— Show read more text, включить в слайдер ссылку — Читать далее или Подробнее, которая ведёт на страницу записи. Enable — включить.
— Show title, включить заголовок записи в слайдере. Enable — включить.
— Show excerpt, показывать в слайдере отрывок из записи. Enable — включить.
— Show pagination, показать разбиение на страницы.
— Featured image size, здесь можно выбрать размер для изображения. Thumbnail — самый маленький. Full — самый большой.
— Auto scroll, выберите, слайдер будет автоматически прокручиваться или вручную.
— Circular, если включите данную настройку то слайдер будет прокручиваться по кругу.
— Excerpt length, укажите здесь сколько слов будет в отрывке из записи.
— Read more text, здесь вместо английских слов, можно указать — Подробнее или Читать далее.
— Categories/Terms, выберите категории из которых будут браться записи для слайдера. Чтобы выбрать несколько категорий, нажмите на клавиатуре на кнопку Ctrl и выберите несколько категорий.
— Number of posts, укажите здесь количество постов, записей для отображения в слайдере.
— Posts order, выберите в каком направлении будут отображаться записи. Ascending — по возрастанию. Descending — по убыванию. Random — случайно.
— Posts orderby, иерархия записей определяется по номеру ID, оставьте без изменений данное значение.
— Transition effect, выберите эффект перехода от слайда к слайду.
— Easing effect, здесь можно задать ослабление эффекта. То же некий эффект для перехода. Linear — линейный, swing — качели, quadratic — квадратичный, cubic — кубический, elastic — эластичный.
— Timeout between elements, здесь можно задать временной тайм-аут между переходами слайдов. Только если включена автопрокрутка.
— Infinite, если включите данную настройку, то прокрутка слайдера будет бесконечной.
— Align the items in Slider, здесь можно задать положение для элементов слайдера. По центру, слева или справа.
— General width of items, укажите здесь ширину слайдера в пикселях.
— General height of items, укажите высоту слайдера.
— Pick text in excerpt field, если включена настройка, то отрывок текста для слайдера будет взят не из содержания записи, а из специального мета поля, в том случае если вы пишите отдельные мета описания для записей.
— Touch Swipe, если включена настройка, то в мобильных устройствах или планшетах можно будет прокручивать слайдер с помощью пальца руки.
— CSS3 Transtitions, если включить настройку, эффект перехода будет использоваться CSS3 или аппаратное ускорение. Используется jQuery.транзит плагин. Не включайте данную настройку, если не понимаете о чём здесь написано.
— Direction to scroll the carousel, выберите направление для прокрутки слайдера, влево или вправо.
— Direction arrows colour, выберите цвет для стрелок слайдера.
— Direction arrows background colour, выберите цвет фона стрелок. По умолчанию — прозрачный.
— Direction arrows hover colour, выберите цвет при наведении на стрелки.
— Size of direction arrows, укажите размер стрелок в пикселях.
— Default image URL, url адрес по умолчанию для изображений. Оставьте поле пустым.
— Custom styles, пользовательские стили. Можно задать свой стиль для слайдера, но необязательно. Оставьте поле пустым, если не разбираетесь. В конце сохраните настройки.
Настройки: (Advanced)
— Load jQuery, отключите данную настройку, если на вашем сайте уже имеется скрипт jQuery. Если не понимаете о чём здесь написано, оставьте без изменений.
— Load transit, отключите данную настройку, если на вашем сайте уже имеется данный скрипт. Оставьте без изменений, если не понимаете о чём здесь написано.
— Load caroufredsel, отключите данную настройку, если на вашем сайте уже имеется данный скрипт. Оставьте без изменений, если не понимаете о чём здесь написано.
— Load TouchSwipe, отключите данную настройку, если на вашем сайте уже имеется данный скрипт. Оставьте без изменений, если не понимаете о чём здесь написано.
— Loading place, выберите где все скрипты должны быть размещены, в footer или header, ничего не меняйте.
— Deactivation, включите настройку, чтобы после деактивации плагина все настройки удалились, сбросились.
В конце сохраните настройки.
Чтобы добавить слайдер на сайт, перейдите на страницу установленных плагинов, возле плагина — Carousel Horizontal Posts Content Slider, нажмите на вкладку — Детали.
В открывшемся окне, в верхнем меню, перейдите на вкладку — Установка.
Спуститесь вниз страницы, установить слайдер вы сможете, либо с помощью шорткода, либо с помощью php кода. Шорткод вставляется в запись или на страницу, а php-код вставляется либо в файл footer.php (подвал сайта) или header.php (самый верх сайта).
Так же, слайдер записей wordpress, можно вставить на сайт через Виджет — CHPC Slider. Просто перетащите виджет в сайдбар и при необходимости укажите название для виджета.
На этом всё, если у вас остались вопросы по данной статье, то пишите в Обратную связь, либо оставляйте свои комментарии к данной записи. Я всем отвечу, до новых встреч ! А знаете как сделать стильный слайдер с эффектными переходами ? тогда читайте — WordPress плагин слайдер.
info-effect.ru
10 лучших слайдеров для Wordpress
Недавно выкладывал PSD исходники слайдеров, сегодня хочу представить несколько плагинов, на которые эти исходники можно накрутить. Плюс, небольшое описание каждому плагину, чтобы не качать «кота в мешке». Лишний раз проверять, что умеет плагин и его работоспособность никому не нравится, верно? Скажу сразу — все слайдеры в формате плагинов для WordPress, поэтому проблем с установкой и настройкой быть не должно.
Один из лучших, на мой взгляд, по возможности настройки и одновременной простоте, но проигрывает Nivo, который ниже. Позволяет установить размер картинки из админки, не углубляясь в дебри кода. Добавляется изменением шаблона. Превьюшек нет, что печально.
Поистине король слайдеров. Честно говоря, не очень рекомендую пользоваться именно плагином для WordPress по причине того, что он давненько не обновлялся, в отличии от скрипта. А последняя версия для WordPress — платная. Ну или как вариант — приспособить новый скрипт к старой оболочке плагина, но тут нужны знания посерьёзнее. 16 вариантов смены картинки, поддержка тем, превью, отличная и валидная верстка, богатые настройки. Я пока не встречал скрипта, который бы уделал Nivo.
Еще один весьма навороченный слайдер, но теперь это слайдер контента. Очень богатые настройки, интеграция в редактор постов, несколько тем в комплекте. Есть возможность вставить разные слайдеры в каждый пост. Есть Pro версия, которая может ещё кучу всяких клёвых штук, но цена в 99$ за слайдер меня очень и очень смущает.
Этот кандидат попроще, но и у него есть своя фишка. Во-первых, он умеет встраиваться по шорткоду, это удобно. Во-вторых, он умеет создавать несколько слайдшоу, которые можно использовать в разных местах. В-третьих, он умеет встраиваться в сайдбар виджетом. И там крутить картинки. По моему, достаточно круто. И да, поддержка русского в комплекте
Этот слайдер тоже умеет дружить с редактором постов WordPress, тоже может встраиваться шорткодом и у него есть превью картинок. Поддержка локализации, с помощью po/mo файлов. Плюс, для больших картинок поддерживается лайтбокс, то есть увеличение картинки по клику.
Неплохой плагин, с превью картинок, хорошей версткой и прочими вкусностями. Но у него есть отличная черта — он поддерживает мобильные устройства, что на данный момент достаточно редкая штука. Но есть и минус, даже два, чтобы скачать нужно зарегистрироваться и нет версии для WordPress. Только вариант скрипта, но возможности слайдера стоят того, чтобы немного потрудиться над установкой.
Что сказать про этот плагин? Он маленький, полностью настраиваемый внешне, неплохие настройки из админки. И он работает.
Очень неплохой слайдер с поддержкой нескольких тем. Авторы обещают SEO-верстку, автоматическую обрезку и кэширование изображений, кроссбраузерность вплоть до IE7 и поддержку WordPress 3.x. Также умеет встраиваться в виджет, что существенно повышает его ценность.
Он сможет показать вам все, что вы захотите. Больше 10 шаблонов вывода в комплекте, собственное API, поддержка мобильных устройств и куча других вкусностей. Поверьте — на сегодняшний день это лучший слайдер. И стоит всего 12$, конечно же, все последующие версии бесплатны. Да, как заявляет разработчик — этот плагин единственный, кто поддерживает в полном объёме IE10, который установлен в Win8.
Удачного дня
gering111.com
Слайдер для WordPress - Meta Slider | WPNICE
Приветствую, наш «гость» сегодня — слайдер для WordPress под названием Meta Slider. Совсем недавно я уже подробно описывал великолепный премуиум слайдер — Revolution Slider. Теперь пришла очередь совершенно бесплатного в базовой версии, но при этом весьма функционального и удобно настраиваемого Meta Slider.
Скачиваем плагин из официально хранилища на wordpress.org. Установка и активация не вызовут у вас никаких затруднений. О том, как устанавливать плагины, новички могут прочитать вот тут.
Перевел для вашего удобства, плагин полностью на русский язык и описание будет строится уже на основе перевода. Ссылка на перевод будет в конце статьи.
Создание нового WordPress слайдера
Слайдер устроен максимально просто и понятно для всех кто уже работал с картинками в WordPRess. Для создания своего первого слайдера, переходим в новое меню Meta Slider Lite в вашей админке. Вверху кликаем на единственную пока закладку с маленьким крестиком. Теперь нам нужно добавить картинки в созданный слайдер (слайдшоу). Жмем кнопку — Добавить слайд и загружаем нужные картинки с компьютера.
Для каждой картинки можете укать название и задать ссылку. Так же можно выставить галочку в чекбоксе для того, что бы ссылка открывалась в новом окне. Уже добавленный слайды вы можете перетаскивать изменяя порядок и наведя курсор на картинку зажав предварительно левую кнопку мыши.
Для сохранения результатов кликаем на – Сохранить или на — Сохранить и посмотреть. Очень удобно если вам нужно сразу посмотреть как выглядит ваш слайдер.
Настройки Meta Slider
С правой стороны под кнопками сохранения расположены все настройки для всех типов слайдеров. Meta Slider имеет в базовой версии четыре типа слайдеров:
- Nivo Slider (Отзывчивый, 16эффектов, 4 стиля)
- Coin Slider (4 эффекта)
- Flex Slider 2 (Отзывчивый, 2 эффекта, режим карусели)
- Responsive Slides (Отзывчивый, один эффект, самый легкий из всех!)
Соответственно, вам нужно выбрать один вариант из четырех и приступить к его тонкой настройке как будет рассказано ниже. Все настройки делятся на 4 раздела.
Общие – выбираем тип слайдера как я описал выше, размер слайдера, эффект перехода и стиль (тему).
Управление – можно отключить показ элементов управления слайдером.
Расширенные настройки – можно включить автопрокрутку слайдов, изменить скорость переходов и скорость анимации, включить случайный показ картинок в слайдере, настроить множество отдельных эффектов. Детальные настройки во многом зависят от выбранного в самом начале типа слайдера.
Опции разработчика — для опытных пользователей — добавить свои CSS classes и собственные скрипты.
Использование Meta Slider
Для того, что бы наконец, увидеть готовый и настроенный слайдер на своем сайте вам нужно использовать сгенерённый для каждого слайдера шорткод . Это для записей и страниц. Копируете его и вставляете в нужное вам место. Или можно ставить код прямо в файлы шаблона.
Кроме того, плагин имеет свой собственный виджет, с помощью которого вы легко можете отобразить выбранный слайдер в сайдбаре. Позаботьтесь только заранее о размерах своих картинок.
Заключение
Вот собственно и все. Простой, понятный, удобный и достаточно функциональный слайдер для WordPress. Никаких глюков по ходу тестирования я не заметил.
Кроме бесплатной версии, существует еще версия PRO, которую автор призывает купить. В платной версии добавятся Layer Slader (эффект появления отдельных изображений или текстов на одной картинке), возможность вставлять видео и слайдер постов вашего блога. Стоит это дело от 19 баксов для одного сайта, что на мой взгляд, многовато, учитывая стоимость таких гигантов как Revolution Slider и прочих. Ну а вы уж решайте сами.
Скачать плагин с wordpress.org. Официальная страница плагина. Скачать русский перевод.
wpnice.ru
Слайдер с текстом для Вордпресс — плагин Master Slider
Слайдер с текстом для Вордпресс — плагин Master Slider
Слайдерами на сайтах уже сегодня никого не удивишь. Это уже, своего рода, неотъемлемый элемент любого, более или менее приличного сайта. Оно и понятно: слайдер на сайте – хороший способ вывести необходимую графическую и текстовую информацию в удобной, понятной, компактной форме.
Это раньше мы воевали за каждый пиксель в размерах изображений. Сегодня ситуация изменилась в лучшую сторону, каналы значительно расширились и большое количество изображений не создаёт неудобства при загрузке страниц. Да, грузится немного медленнее, но, этим можно пожертвовать для повышения удобства и доступности информации.
Для движка Вордпресс плагинов со слайдерами предостаточно. Самый популярный это Meta Slider. Настраивается элементарно, легко разобраться в настройках, внешний вид весьма приличный.
Самый продвинутый и навороченный это Slider Revolution. Там и разнообразные слои, и анимация, и 3D эффекты. Но, за него требуется заплатить. Сумма хоть и небольшая, не больше 20 долларов, но для обычных проектов не совсем подходит. Хотя, в сети легко можно найти расшаренную версию.
А у меня, тут, появилась задача сделать слайдер с блоком текста. Надо сделать так, чтобы при смене изображения появлялся нужный текст, с заголовком и возможностью индексации. Сами знаете, чем больше текста, тем больше вероятность хороших позиций у поисковиков.
Вот такое расположение нужно было получить на слайдере
Meta Slider для этих целей не слишком подходил. Большой блок текста в нём смотрится не слишком удачно. Качать крякнутые версии, что-то душа не лежала, вот и решил поискать из возможных вариантов.
Случайно, на глаза попался плагин Master Slider. Вот в нём эта возможность реализовывалась так как надо. Слева картинка, справа текстовый блок нужного размера. Всё прекрасно индексируется, адаптировано для любых устройств. То, что требовалось. Вот про настройку такого слайдера с текстом я и хочу рассказать в этой статье.
Делаем слайдер с текстом с плагином Master Slider
Плагин Master Slider распространяется свободно. Большинству хватает облегчённого варианта, кому нет – расширяем возможности в платной версии. Просят за неё 19 долларов, и возможности, действительно впечатляют. Кому интересно, может всё увидеть на сайте плагина.
Мы же будет реализовывать свои задачи на варианте Free.
В админке, в окошко Поиск плагинов вводим Master Slider, выбираем, устанавливаем, активируем.
Слева на панели появляется панелька с надписью Master Slider. Там два пункта:
- Settings – где вы можете изменить настройки кеширования и переключиться на подключение Ajax версии.
- Master Slider вот тут и происходит создание и редактирование наших будущих слайдеров.
Для создания нового слайдера выбираем пункт Create New Slider. Тут вы можете начать создавать слайдер самостоятельно Custom Slider, или выбрать из существующих готовых вариантов.
Я не стал заморачиваться, и выбрал уже готовый вариант слайдера с текстом.
Вариант Slider with Slide info – текст располагается внизу, Slider with Slide info V2 – блок с текстом располагается справа.
В принципе, этот выбор не принципиален. В настройках вы всегда сможете расположить блок с текстом там, где вам необходимо.
Нажимаем кнопку Create, на ваш сайт загружаются необходимые изображения и появляется панель управления слайдером.
Панель управление плагином Master Slide
Slider Settings
General Settings
Тут настраивается название нашего слайдера, высота, ширина, можно включить автоматическую обрезку изображений под нужный размер.
Тут же можно выбрать вариант Boxed layout – встраивание слайдера в поле для статьи, или Full-width – слайдер будет на всю ширину странице. Этот вариант не подойдёт для страниц с сайдбарами.
Дальше выбираем возможность настройки высоты и нужную ширину встраиваемой области для слайдера.
Slider Transition
Здесь мы можем настроить эффекты для переходов.
- Transition – Normal – смена слайдов без эффектов, Fade – будет применяться эффект затухания.
- Transition speed – скорость смены слайдов.
- Direction – Horizontal – горизонтальная смена слайдов, Vertical – вертикальная смена слайдов.
- Slide space – расстояние между слайдами в px.
Navigation
Здесь настраивается поведение и сортировка слайдов.
- Autoplay – включение автоматической смены слайдов.
- Loop navigation – зацикливание смены слайдов
- Pause at end slide – остановка после последнего слайда.
- Pause on hover – остановка смены слайдов при наведении мыши.
- Random order – смена слайдов в случайном порядке.
- Start with slide – с какого слайда запускать слайдер.
Дальше есть возможность включить дополнительные возможности смены слайдов.
- Touch swipe navigation – включение возможности смены слайдов касанием пальцев (для мобильных устройств).
- Mouse swipe navigation – можно перетаскивать слайды мышью с зажатой левой клавишей.
- Use grab mouse cursor – использовать специальный курсор при перетаскивании мышкой.
- Mouse wheel navigation – возможность колесом мыши менять слайды.
- Start slider when appears in browser window – старт слайдера сразу после загрузки страницы сайта.
- Slide preloading – внешний вид заставки, пока слайдер будет загружаться.
Appearance
В этом месте можно настроить внешний вид нашего слайдера.
- Skin – выбираем встроенные варианты для стрелочек, кнопок, индикаторов.
- Align center slider controls – можно выровнять по центру все элементы управления.
- Slider background settings – здесь можно выбрать цвет и изображение для фона нашего слайдера.
- Slider custom class name and style – можно добавить свой класс и свои стили для внешнего вида слайдера.
Затем идет короткий код (shortcode) для вставки нашего слайдера в любое место в записях и страницы. Он, в принципе, не нужен, так как, при редактировании страницы в визуальном редакторе у нас появляется специальная кнопочка для вставки нужного слайдера.
Вкладка Slides
Тут возможно управлять всеми слайдами. Очень удобно мышкой перетаскивать изображения для выстраивания изображений в нужном порядке.
Background – можно увидеть изображение, загруженное для данного слайда. Указать необходимое выравнивание, и миниатюру. Slide duration – настраивает время показа слайда.
Video and Link – тут можно указать необходимую ссылку для слайда и то, как эту ссылку открывать. Можно присвоить свой ID, class, link rel, title. Здесь можно загрузить нужный ролик с Youtube или Vimeo.
Slide Info – вот тут то и можно загружать необходимый блок текста к каждому слайду. Ради чего всё это мной и затевалось. Текст можно вставлять в удобном, привычном редакторе от WordPress.
Misc – тут можно прикрепить свои классы и идентификаторы для данного слайда. Выбрать цвет фона, заливки, и способ расположения текстуры.
Slider Controls
Тут настраиваются все элементы управления нашим слайдером. Плюсиком добавляем нужные элементы, с помощью корзины – убираем.
Настройка кнопок управления в плагине Master Slider
Arrows – стрелки вперёд, назад. Можно включить сворачивание стрелок, если на слайд не наведена мышь. Можно настроить вариант показа стрелок при проигрывании видеоролика. Также можно указать при какой ширине слайдера стрелки не надо показывать.
Slide Info Control Options – вот тут и настраивается блок с текстом.
- Можно включить вариант сворачивания блока если мышь не наведена.
- Можно включить показ блока при проигрывании видеороликов.
- Можно включить блок с тектом внутри изображения.
Дальше настраивается расположение блока с текстом – вверху, внизу, слева, справа. Настраиваются отступы, ширина и высота.
Можно запретить показывать блок с текстом если ширина окна меньше необходимого размера.
Дальше настраиваются кнопки, временная линия, индикатор загрузки, показ миниатюр. Сложного ничего нет, нет смысла всё это расписывать.
Slider callbacks
Эта вкладка для тех, кто знаком с языком PHP, простым смертным тут делать нечего.
Кнопка Preview – даёт возможность быстро просмотреть все сделанные изменения для слайдера.
Кнопка Save Changes – сохраняет все изменения для слайдера.
Вставить свой слайдер в нужное место в статье или на странице можно двумя способами – либо shortcode, либо с помощью кнопки в визуальном редакторе.
Вот такой плагин для WordPress под названием Master Slider. Удобный, простой, понятный, никаких лишних затрат, ни финансовых, ни умственных делать не придётся. Рекомендую. 
Для тех, кто лучше воспринимает визуальную информацию, рекомендую ролик по созданию слайдера с плагином Master Slider:
Делаем слайдер плагином Master Slider (free version)
Всем Удачи и нестандартных творческих решений. 
✔ Этот сайт работает на быстром, надёжном, не дорогом хостинге GIGAHOST
wwdiz.ru
Лучшие слайдеры для WordPress 2016 | WPNICE
Про слайдеры мы уже писали не раз и потребность в качественных подобных скриптах только растет. Сегодня у нас подборка наиболее актуальных плагинов — слайдеров на конец текущего года. Впрочем, вариантов сейчас очень много и возможно у вас уже есть свои приоритеты. И это совершенно нормально. Мы же предлагаем обратить ваше внимание на следующих фаворитов.
Какие вообще требования можно предъявить к современному слайдеру? Начнем с того, что слайдер должен быть отзывчивым и прекрасно работать и на смартфонах, и на планшетах. А продолжат этот список требований следующие обязательные функции:
- Плавные анимационные переходы
- Параллакс слои
- Быстрая загрузка изображений
- Стильные шрифты и кнопки
Плюс множество других функций, позволяющие владельцу сайта произвести невероятное визуальное впечатление на посетителей. Короче, приступим к обзору, не торопясь 🙂
Nivo Slider
Nivo Slider – это премиум плагин, который предоставляет практически все функции, необходимые для создания невероятных эффектов. Несмотря на то, что этот плагин немного дороже остальных расширений, которые здесь представлены (стоимость лицензии для одного сайта начинается от $29), он стоит того, чтоб в него инвестировать. Интуитивный интерфейс позволяет с легкостью создавать слайдеры и добавлять их на сайт, используя шорткоды.
Планин имеет огромное количество эффектов перехода, и это позволяет создавать красивое обрамление для ваших фото, которое привлечет внимание посетителей. Кроме того, вы можете с легкостью управлять отображением картинок, используя богатый диапазон доступных типов слайдеров. Также вы можете автоматически подрезать картинки, сохраняя огромное количество времени при редактировании картинок.
И наконец, Nivo Slider – плагин очень легкий, за счет чего он практически не влияет на скорость загрузки страниц. Перейти
Slider Revolution
Slider Revolution – один из самых популярных слайдер-плагинов на рынке. Он позволяет создавать стильные, широкоформатные, отзывчивые слайдеры. Вы можете вставить слайдер на сайт, и он будет выглядеть отлично на экране любого девайса.
Также есть анимационные циклы, позволяющие избежать застывания слайдера, если посетитель на некоторое время задержатся на домашней странице.
Параллакс-слои Slider Revolution – это что-то фантастическое, а редактор таймлайна слайдов отображает интуитивный вариант того, как ваши картинки будут показаны в слайдере. Кроме того, плагин предоставляет drag-and-drop-редактор, который позволяет начинающим веб-мастерам создавать профессионально выглядящие слайдеры. У этого плагина есть все, начиная от многоязычной поддержки и заканчивая поддержкой полноэкранных видео YouTube и Vimeo. Перейти
Soliloquy
Этот плагин, ну, очень премиальный. Самая дешевая лицензия стоит $19, а стоимость самой дорогой лицензии может достичь $249 в зависимости от того, сколько сайтов она обслуживает. Если вы не можете начать работу с бесплатным слайдер-плагином, из-за того, что у него непонятный интерфейс, то этот вариант как раз для вас. Плагин отзывчивый и может экспортировать созданные ранее слайдеры.
Строительный интерфейс очень просто в использовании и, кажется, он не замедляет фронтенд и никогда не лагает. Самая его уникальная функция заключается в том, что он позволяет расположить слайдер где угодно на сайте. Перейти
Cyclone Slider 2
Cyclone Slider 2 –это бесплатный плагин, включающий drag and drop-интерфейс, который могут использовать даже начинающие дизайнеры. Система отзывчивых слайдов, работает так, что каждый независимый слайдер и является уникальным и выдает шаблоны, помогая дизайнерам каждый раз создавать нечто новое. Эффекты перехода можно настраивать для отдельных слайдов, так что можно включить свою анимацию для каждого сегмента.
Благодаря возможности отображать неограниченное количество слайдеров в любом месте сайта Cyclone Slider 2 может составить достойную конкуренцию премиальным опциям. Также радует, что плагин поддерживает видео, цитаты и кастомный HTML. Перейти
SlideDeck
SlideDeck существует в двух версиях: платной и бесплатной, и бесплатная версия предлагает большинство тех инструментов, которые обычно используются обычным веб-дизайнером. Например, легкая версия позволяет создать слайдеры, которые можно просматривать на экранах всех девайсов. Вы можете использовать в слайдах и видео, и картинки, а процесс разработки слайдеров интуитивно понятен.
Это простой и доступный плагин, подходящий всем тем, кто хочет связать сайт с такими платформами, как YouTube, Flickr и Pinterest. Перейти
EasyRotator
Плагин EasyRotator – еще один бесплатный инструмент для создания слайдеров, и главное его преимущество – это простота. Просто загрузите видео и фото, кликните пару кнопок и любуйтесь стильным слайдером, появившемся на вашем сайте.
Плагин идет с 45 гибкими шаблонами, которые позволяют работать с ним человеку с любым уровнем подготовки. Благодаря поддержке SEO этот слайдер работает хорошо на любом сайте. Перейти
Slider Pro
Slider Pro стоит $29, но ваши деньги точно не пропадут зря. Элегантный дизайн, инструменты быстрого создания слайдов и отзывчивость – все есть. Вы можете связать плагин с вашим аккаунтом в Flickr, чтоб выдергивать контент оттуда и использовать его на вашем сайте. Touch-swipe-возможности пригодятся пользователям iPad’ов и планшетов, а анимированные уровни помогут вам привлечь внимание пользователей, чтоб продать им больше всего или приманить их к нужному контенту. Перейти
LayerSlider
Плагин LayerSlider стоит $20 и предлагает полный набор функций, но слайдеры – это не все, что он способен вам дать. Вы также cможете добавлять галереи картинок и слайдшоу, предлагая идеальный мультимедиа опыт.
LayerSlider предлагает более 200 2D и 3D переходов, и вы можете создать собственные переходы с помощью редактора слайдов. Мощный drag-and-drop-редактор укомплектован плагином для просмотра отзывов в режиме реального времени. Также вы сможете экспортировать, импортировать и передвигать компоненты в режиме реального времени.
Вы можете генерировать динамичные слайдеры, связанные с вашими WordPress- записями и страницами. Также вы можете перенаправлять посетителей на самый интересный контент, делая это без особых усилий. Вы можете выбирать более чем из 13-ти обложек, тем самым создавая собственный уникальный брендинг.
Кроме того, нельзя не сказать, что слайдер SEO-дружественный, и это позволяет вам быть на шаг впереди тех, кто не умеет оптимизировать свои слайдеры. Перейти
Easing Slider
Easing Slider – это еще один бесплатный WordPress-плагин. Данное расширение радует полной отзывчивостью и возможностью загрузить в один слайдер огромное количество изображений. Простой в использовании интерфейс включает визуальный редактор для кастомизации базовых стилевых элементов. Экшены и фильтры тоже имеют место быть, и вы всегда можете расширить функционал слайдера, используя доступные расширения. Перейти
Smooth Slider
Разработчики Smooth Slider уверяют, что могут вставить на ваш сайт потрясающий слайдер со ссылками на самый свежей контент или рекомендуемые записи всего за 50 секунд. И эти разговоры похожи на правду. Интерфейс очень прост в использовании, а само решение крайне отзывчивое.
Создаваемые слайдшоу оптимизированы для поисковых систем и дают вашему сайту приток трафика. Панель настроек дает полный контроль над тем, как выглядят ваши слайдеры во фронтенде. Этот бесплатный плагин идет с 6 эффектами перехода, и это больше, чем предлагают некоторые менее популярные и не указанные здесь премиум плагины.
Чтоб работать с этим плагином на уровне профессионала, вам не нужно знание кода. Слайды можно перемещать или удалять в один клик – просто воспользуйтесь панелью управления слайдерами. Перейти
Заключение
Идеальный слайдер всегда выгодно показывает то, что предлагает ваша компания и привлекает внимание пользователей к вашему самому важному контенту. Вы можете разместить в слайдере ссылку на запись в блоге или даже использовать определенный слайд, чтоб перенаправить пользователей на сезонные предложения, доступные в вашем интернет-магазине.
По теме:
Master Slider — просто мастер!
Слайдер для WordPress — Meta Slider
Revolution Slider — лучший WordPress слайдер
Slider PRO — настоящий «профи»
wpnice.ru
