Meta slider wordpress как пользоваться

Простой и функциональный слайдер на WordPress

В этой статье я расскажу про слайдер на WordPress, который отличается простой в использовании, однако при этом не обделён функциями и возможностями. Речь пойдёт о дополнении Meta Slider.

Вот какие достоинства в нём следует выделить:

• Плагин прост в настройке.
• Интерфейс на русском языке.
• Есть возможность настроить атрибуты Title и Alt для изображений слайдов.
• Можно назначить ссылки каждому слайду.
• Имеется четыре готовых дизайна.
• Есть несколько эффектов переходов.
• Слайдер получается адаптивным.

Как сделать слайдер на WordPress с помощью Meta Slider

Скачайте Meta Slider по ссылке ниже и установите его на сайт. Активируйте плагин.

После активации плагина в консоли появится новый пункт «Meta Slider». Перейдите в него и нажмите на кнопку с иконкой плюса, чтобы создать новый слайдер.

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

Каждый добавленный слайд имеет настройки из трёх вкладок.

• Основное. Здесь задаётся описание для картинки и при необходимости ссылка для неё. Можно сделать, чтобы ссылка открывалась в новой вкладке.
• СЕО. Здесь можно задать Title и Alt для картинки, что положительно скажется на SEO-оптимизации слайдера для WordPress.
• Обрезать. Опции обрезки картинки.

В боковой колонке справа слайдер на WordPress имеет опции для настройки.

• Кнопка «Просмотр» позволяет взглянуть на слайдер до публикации.
• Кнопка «Сохранить» сохраняет внесённые изменения.
• Четыре кнопки ниже позволяют выбрать дизайн для слайдера.
• Ширина. Задаёт ширину слайдера в пикселях.
• Высота. Задаёт высоту слайдера в пикселях.
• Эффект. Можно выбрать эффект перехода. В бесплатной версии список немного ограничен.
• Дизайн. Можно дополнительно выбрать дизайн для слайдера. В бесплатной версии ограниченно.
• Стрелочки. Включает или выключает стрелки для переключения слайдера.
• Навигация. Включает или выключает точки под слайдером.

Немного ниже есть ещё один блок настроек, который можно развернуть – это «Расширенные настройки».

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

Далее есть блок «Использование». Здесь можно получить код для публикации слайдера на сайте.

Если вы хотите использовать слайдер на WordPress в записи, странице или виджете, то возьмите код из вкладки «Шорткод». Если вы хотите разместить слайдер в файле установленной темы, то используйте PHP код из вкладки «Вставка в шаблон». Опубликовать слайдер в записи или странице можно также используя кнопку, которая появилась в редакторе.

Источник

Meta Slider — бесплатный слайдер для WordPress

В данной статье я расскажу вам о плагине Meta Slider, который помогает организовать на вашем сайте любое количество слайдшоу с различными спецэффектами. Данный плагин я использовал уже не раз на клиентских сайтах, когда требуется простое бесплатное решение с хорошим функционалом.

Использовать слайдшоу Meta Slider вы можете как на главной странице, так и в любой записи, либо сайдбаре (боковой колонке сайта). Настройки до безобразия просты, а внедрение слайдера на сайт WordPress еще проще.

Сам плагин на английском языке. Я уже сел делать русскую локализацию, но понял, что это «сизоф труд», т.к. с обновлением Meta Slider может изменить функционал. Поэтому поясню самые основные моменты текстом и на скриншотах. А саму работу плагина можете посмотреть на странице http://www.metaslider.com/examples/.

Стоит заметить : даже если у вас уже в шаблоне установлено слайдшоу на Главной странице, вы можете с легкостью ставить данный плагин и использовать его в любой части сайта, что позволит добавить динамику в отдельные статьи, страницы, либо прорекламировать свой инфопродукт в сайдбаре.

Шаг 1: создаем первое слайдшоу

Ссылку на скачивание плагина найдете в конце статьи. После установки и активации, у вас в боковой колонке админки появится новый пункт

Кликаем по нему и попадаем на страницу, где сверху увидим такое

Нам предлагают создать свое первое слайдшоу, что мы и делаем, кликнув на +.

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

Шаг 2: загружаем картинки в слайдер

Теперь настало время загрузить картинки. Советую для каждого отдельного слайдшоу делать изображения одинакового размера по ширине и высоте. В помощь PhotoShop, либо моя любимая программа IrfanView. Одинаковый размер для одного набора картинок позволит их отображать так, как вы запланировали: без обрезания и искажений.

Нажимаем и добавляем картинки для выбранного слайдшоу. Сам процесс добавления стандартный для сайтов на WordPress. После этого появится вот такое:

Верхняя крайняя слева стрелка указывает на изображение. Если подведете на нее мышку, то в углу миниатюры появится X, который позволит удалить выбранной изображение.

Галка в поле New Window сделает так, что по клику на картинку выбранная ссылка откроется в новом окне. Остальное понятно из скриншота.

Если необходимо поменять очередность картинок, то достаточно навести курсор на миниатюру и «схватить» левой клавишей мыши, после чего перетащить в нужное место.

Шаг 3: настройка эффектов для слайдера

Справа идет блок настроек визуального оформления и эффектов слайдшоу на сайте. Блок длинный, поэтому будем разбирать по частям.

Чтобы вы не делали в выбранном слайдшоу, необходимо по окончании изменений его сохранить. Для этого используем кнопки Save, либо Save&Preview (сохранить и сразу посмотреть как будет выглядеть).

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

Обратите внимание, что ширину (width) и высоту (height) я задал ровно такую, какого размера у меня изображения. Вы ставите свои размеры. Красная стрелка показывает на поле эффекта, с которым будет отрабатывать слайдер на сайте.

В нашей бесплатной версии плагина Meta Slider эффектов не сильно много, но их достаточно, чтобы посетители вашего сайта положительно оценили ваш сайт. Кто хочет, может купить PRO версию Meta Slider за 19$ (ссылку увидите).

D этом блоке мы ставим галку, если нужны стрелки навигации влево и вправо (Arrows), а также можем спрятать нижнюю навигацию (Hidden), либо отображать её в виде точек

Для статьи или Главной удобно оставлять данную навигацию, а вот для рекламы инфопродуктов можно смело прятать.

Далее у нас идет блок Advanced Settings. Здесь мы можем точечно настроить стиль отображения: время задержки, чередование, направление и т.п. Можете смело поэкспериментировать, чтобы найти нужные для себя параметры. Если я начну описывать каждый, то статья будет невероятно длинной.

Шаг 4: внедряем созданный слайдер на сайт

Как все сделали и нажали сохранить, снизу находим вот такой блок

Мы можем внедрить слайдер на сайт при помощи шорткода, либо функции PHP. Шорткод удобно использовать в статье, а функцию прописывать в файл шаблона. Сами решаете как вам лучше сделать.

Обратите внимание, что в шорткоде и функции есть цифры, которые обозначают номер вашего слайдшоу.

Включаем шорткоды в стандартном виджете сайдбара Text

Кто хочет использовать слайдер в сайдбаре, но не включена возможность отработки шорткодов в виджетах, предлагаю вариант решения без плагина.

Открываем functions.php и сразу после открывающего , на новой строке, вставляем следующее:

Теперь можете смело добавлять любой шорткод от любого плагина в виджеты.

Для тех, кто сомневается и боится

Если боитесь пробовать что-то новое, боитесь «поломки» сайта, то меняйте отношение к жизни. Ставьте смело Meta Slider: сайт он вам не «сломает». Для начала попробуйте все на стандартных настройках, а потом пробуйте менять эффекты и оформление.

Если вдруг плагин не захочет «работать», то убедитесь что у вас подключен jQuery, притом версии поновее. Если что, в помощь ПЛАГИН. Других проблем с активацией Meta Slider не наблюдал.
[downpg wp=»3.5+» vp=»2.3″ href=»http://wordpress.org/plugins/ml-slider/»]Скачать Meta Slider[/downpg]

Привет. Я автор этого блога и ридера вебмастеров/SEO-специалистов WMSN.ru

Можешь оставить свой вопрос в комментариях к статье или предложить идею для новой статьи. Не стесняйся.

Источник

Слайдер для WordPress — Meta Slider

Приветствую, наш «гость» сегодня — слайдер для 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 и прочих. Ну а вы уж решайте сами.

Источник