Скрипт увеличения изображения при нажатии. Скрипт увеличения картинки при нажатии
Всем привет дорогие друзья читатели! В этом уроке я поговорю с вами о том как сделать на сайте wordpress увеличение картинки при нажатии курсора на нее.
Разбирать мы будем два варианта, для тех, кто хочет сделать это с помощью скрипта увеличения картинки и плагина.
Соответственно будет две части.
Дело в том, что при добавлении картинок на сайт, особенно если они большие, WordPress при нажатии мышкой на них, открывает каждую из них в новой вкладке. Это, откровенно говоря, не очень удобно и не правильно. Поскольку вы создаете под названием attachments (вложения). Т.е каждая картинка – это отдельная страница вложения, которая индексируется. У нас они и так хорошо сканируются поисковыми роботами, поскольку папка uploads для у нас открыта в файле . Сегодня мы разберемся с этим вопросом и подскажем, как правильно организовать на сайте увеличение картинки при нажатии на блоге вордпресс.
Давайте прямо сейчас приступим к освоению урока на практике. Предлагаю посмотреть содержание данной заметки.
Установка скрипта для увеличения картинокНачнем с выполнения первого шага – установки скрипта на сайт. Он очень легкий практически ничего не весит и не создаст нагрузку на ваш блог. Скачать вы его может по этой ссылке.
После того как скачали, вам нужно загрузить его к себе на блог. Зайти вы можете двумя способами как по фтп доступу, так и через панель . Я предпочту второй вариант. Загружать файлы скрипта мы будем в специально созданную папку lib (библиотека – library сокр., примечание автора). Создадим ее по самому ближайшему пути, т.е после public_html или www (в зависимости от вашего хостинга).
Отлично заходим в нее и копируем туда все файлы из архива.
С этим шагом разобрались и сейчас переходим к следующему этапу.
Добавление кода скрипта на блогЧтобы наш скрипт увеличения картинки при нажатии заработал, нам нужно подключить небольшой фрагмент кода в шаблон блога. Для этих целей я рекомендую воспользоваться шаблоном подвала сайта (footer . php ). Вот этот код вам нужно подключить к себе на сайт:
(function(){
var boxes=,els,i,l;
if(document.querySelectorAll){
els=document.querySelectorAll("a");
Box.getStyles("simplebox_css","http://local..css");
Box.getScripts("simplebox_js","http://local..js",function(){
simplebox.init();
for(i=0,l=els.length;i