Как увеличить изображения на сайте в WordPress

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

Ну что, приступим! И сначала давайте разберем увеличение изображения с помощью плагина. Немножко расскажу почему я рекомендую именно этот плагин а не какой-то другой. Когда я только создал себе блог, я об этом не особо задумывался, думаю пока мне не надо это увеличение итак нормально.

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

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

Но я все таки нашел что-то подходящее, давайте рассмотрим!

Увеличить изображение с помощью плагина FancyBox for WordPress

Мне этот плагин очень понравился, а особенно как от открывает картинку, но я лично использую скрипт для этого, так как он мне более подходит, так что я вам не смогу показать как увеличивает картинку этот плагин, но могу точно сказать что увеличивает он её также как и мой скрипт, давайте я вам про демонстрирую и покажу сразу настройки данного плагина:

Нажали на изображение ? Ну как вам красиво смотрится, я думаю что да, по этому лучше такое увеличение, чем открывать картинку в новом окне.

Давайте перейдем к настройкам данного плагина, но для начала его установим, данный плагин устанавливается как и все, можно скачать его а можно перейти в панель управления блогом и зайти в Плагины/Добавить новый и в поиске просто прописать FancyBox for WordPress, и нажмите установить и затем активируйте.

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

Теперь рассмотрим как с ним работать? Добавляете вы запись на свой блог и вверху есть кнопка Добавить медиафайл:

Затем загружаем картинку и в настройках отображения файла, нужно поставить следующее:

Вот в принципе и все.

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

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

Увеличить изображение с помощью скрипта

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

Дальше нужно перейти в файл footer.php, вашей темы и добавить в самый конец перед тегом </body> следующий код:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<script type="text/javascript" src="http://ваш сайт/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://ваш сайт/simplebox.css');
Box.getScripts('simplebox_js','http://ваш сайт/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>

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

Жмем кнопку «Добавить медиафайл» :

Загружаем изображение, и в настройках как и в плагине делаем также:

И вставляем в запись, но это еще не все, затем в визуальном режиме нажимаем на изображение и появляется вот такой карандаш, жмем и переходим к дальнейшей настройки:

И дальше в колонке «НАСТРОЙКИ ОТОБРАЖЕНИЯ» там где «Размер» ставьте «Произвольный» затем ширину и высоту вашей картинки, это будет тот размер который первоначальный а не увеличенный, дальше «Ссылка» должна быть «Медиафайл» и последнее в «ДОПОЛНИТЕЛЬНЫХ НАСТРОЙКАХ» в поле «Отношение» нужно прописать вот это simplebox, ну вот пример:

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

С уважением Евгений Смецкий