Вячеслав и Валерия : Интересные плагины Wordpress 1237 3 комментария к записи Как увеличить картинку на сайте

Как увеличить картинку на сайте

Скрипт увеличения картинок

Приветствую вас! В последнее время мне часто задают вопрос, как увеличить картинку на сайте, но при этом чтобы не было нагрузки на сайт. Давайте рассмотрим данный вопрос. Данная статья также будет интересна людям, которые ежедневно наполняют свой ресурс полезными статьями, а также картинками к ним. Для чего вообще нужны изображения в статьях? Сами подумайте, что лучше читать голый текст или текст с изображением. Изображения в статьях играют огромную роль в продвижении вашего проекта.

Рисунки придают вашим постам оригинальность. Тут последует следующий вопрос, зачем увеличивать изображения? Дело в том, что в некоторых статьях вставляются рисунки где показаны важные действия, которые пользователю нужно выполнить чтобы получить результат, и чтобы их рассмотреть нужно увеличить изображение.

Очень часто в изображение нужно поместить множество элементов, но ширина шаблона, выделенная под статьи, не позволяет сделать рисунок в необходимом размере. При сокращении габаритов рисунка, пользователю очень трудно разглядеть важные действия на этом изображении и значимость статьи теряется. Редактор wordpress предусмотрел для этих целей поле «ссылка», но такой способ вывода рисунка не идеальный.

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

К тому же, при нажатии на изображение, оно откроется в той же вкладке браузера, закрыв при этом своим фоном всю статью, что вызовет дискомфорт у аудитории, и чтобы ввернуться назад потребуется функция браузера «вернуться на предыдущую страницу».

Что же делать, спросите вы? Мы воспользуемся скриптом увеличения картинок. Он не утяжеляет сайт и прост в использовании. Давайте начнем.

Скрипт увеличения картинок

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

Переходим к следующему действию, которое нам необходимо выполнить, это добавление в файл сайта footer.php специального кода. Идем на сайт и перед закрывающимся тегом вставляем следующий код. Только вместо домен.ru вписываете свой адрес сайта.

<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://домен.ru/simplebox.css');
Box.getScripts ('simplebox_js','http://домен.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>

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

В общем вставка в пост рисунка вполне обычная, за исключением некоторых действий, которые я вам сейчас объясню:

1  Идем в редактор вордпресс и жмем на кнопку «добавить медиафайл».

2 Проверяем поле «ссылка», прописалась ли у вас ссылка на рисунок и установлен ли необходимый размер. После проделанных пунктов, жмем «Вставить в запись».

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

4 В, появившемся окошке жмем на пункт «дополнительно».

5 Далее нам нужно в поле «Дополнительные параметры ссылки — Отношение» прописать следующий пункт «simplebox».

6 Нажимаем «обновить».

7 Дальше переходим на свой блог и проверяем работу скрипта.

Все наш скрипт установлен, любуемся полученным результатом. Если вы все правильно сделали, у вас не должно возникнуть проблем с данным скриптом. Теперь вы знаете «Как увеличить картинку на сайте». А у меня на этом все. Жду ваших вопросов.

С уважением, Вячеслав Коптяков!