20 % усилий дают 80 % результата. принцип Парето

Увеличение изображений в WordPress!

Увеличение изображений в WordPress!

Добрый день, друзья! Как ваши дела? Что новенького? Жду ответов в комментариях. Как часто заходишь на блог, видишь интересную статью, скриншоты для подробного объяснения, но они открываются или в новом окне, что очень не удобно или просто имеют маленький размер. Из-за вроде бы небольшой и малозаметной детали большинство посетителей, перешедших с поисковика с целью удовлетворить ответ на свой запрос просто уйдет в поисках лучшего варианта для информационного и наглядного объяснения. Такой уход, я уже писал, скажется на позиции сайта, потому что при плохих поведенческих факторах даже в отдельных статьях велика вероятность того, что статья будет понижаться в выдаче, а также и сайт целиком.

Для того, чтобы раз и навсегда устранить проблему с наглядным объяснением каких-либо технических и не только деталей посетителям сайта, а также выбрать удобный и эффективный вариант мы рассмотрим – как увеличить картинки в статье с помощью скрипта!

Скрипт, как известно, дает меньшую нагрузку на базу данных сайта, чем плагин, что и делает скрипт эффективным решением для той или иной задачи. Поэтому качаем вот этот архив. Далее распаковываем и закидываем его содержимое в корень сайта - wp-admin или wp-content. Ничего не меняйте, папку "img" так же заливаем вместе с файлами. Если есть желание, можете выделить под этот скрипт отдельную папку  в вышеназванных wp-admin или wp-content. 

Увеличение изображений в WordPress!Увеличение изображений в WordPress!

У меня это выгладят так - нажмите на изображение для увеличения!

Увеличение изображений в WordPress!

Затем пошагово:

1) Добавляете в файл footer.php перед закрывающим тегом </body> вот этот код:

<script type="text/javascript" src="http://ВАШ-САЙТ.ru/simplebox_util.js"></script>

<script type="text/javascript">

(function(){

var boxes=[],els,i,l;

if(document.querySelectorAll){

els=document.querySelectorAll('a[rel=simplebox]');

Box.getStyles('simplebox_css','http://site.ru/simplebox.css');

Box.getScripts('simplebox_js','http://site.ru/simplebox.js',function(){

simplebox.init();

for(i=0,l=els.length;i<l;++i)

simplebox.start(els[i]);

simplebox.start('a[rel=simplebox_group]');

});

}

})();</script>

2) В коде не забудьте заменить site.ru и ВАШ-САЙТ.ru на адрес вашего сайта. Если создавали отдельную папочку - ее не забываем указывать в пути!

3) Теперь переходим в админку wordpress– «Записи» - «Добавить новую» или редактируйте любую имеющуюся запись;

Увеличение изображений в WordPress!

Увеличение изображений в WordPress!

4) После этого загружаем нужную картинку и переходим в визуальный редактор изображения.

  • В поле "Ссылка" обязательно ставим "Медиафайл"

Увеличение изображений в WordPress!

  • В поле «Отношение» пишем: simplebox

Увеличение изображений в WordPress!

Увеличение изображений в WordPress!

Ну вот и все на сегодня, друзья! Сложного ничего нет! Применяйте такое решение, улучшайте поведенческие факторы на своих сайтах, а также наслаждайтесь классным видом ваших постов и картинок! Будут вопросы по установке, можно спрашивать в комментах!

С Уважением,

Частный инвестор

Получайте первыми
новые посты!
Буду признателен, если воспользуетесь кнопочками:
Оставить комментарий:
  1. Юрий  |  Опубликовано 29 Июнь 2014 в 17:21  |  Ответить

    Вот все пытаются защитить свой сайт, чтобы его статьи не копировали. Вы выкладываете код, который нужно вставить в свой шаблон, но как его скопировать? Или предлагаете набирать руками :-D . В первую очередь нужно думать о посетителе ;) .

  2. Ирина  |  Опубликовано 5 Июль 2014 в 13:57  |  Ответить

    Все понятно, статья полезная.. но я не могу найти дополнительные настройки, где В поле «Отношение» пишем: simplebox.. это самый последний шаг в статье… может, это зависит от шаблона темы? или от версии Вордпресс? но я постоянно обновлялась, вот только последнюю версию 3.9.1 еще не обновляла..

    • Частный инвестор  |  Опубликовано 6 Июль 2014 в 21:19  |  Ответить

      Ирина, в статье приложены изображения, там все очень понятно должно быть! Входите в параметры изображения и листаете вниз к блоку «Дополнительные настройки» — он разворачивается при нажатии, там рядом еще такие поля: «Атрибут title», » CSS-класс изображения» и следующее идет «Отношение».