1:13
Автор: Рубрика: плагины Комментариев нет

Загружаем и редактируем картинку с плагином или без него

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

картинка

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

Скажу, что неправильно, нехорошо брать понравившуюся картинку и сразу её без «подготовки» заливать на сайт. Под подготовкой я имею в виду проверку её размера (не высота и длина). Если к этому небрежно относиться, то через время вы схватитесь, за голову решая, проблему с нехваткой выделенного вам места.

Не стоит размещать картинку, если её размер более 150 Кб. Я даже стараюсь не приближаться к этой цифре. Тогда и изображение открывается быстро и не грузиться минуту. У кого-то терпение может лопнуть и он уйдёт с вашего сайта.

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

С помощью этой программы делаю скриншот фотографии или можно обрезать и «вес» значительно уменьшается. Конечно, можно уменьшить размер (теперь истинный размер) самой фотографии тем самым уменьшим «вес». Использую Microsoft Office Picture Manager.

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

Советую прочесть  Удалим вредоносный код при помощи плагина

добавить фото

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

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

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

Решение есть.

Устанавливаем плагин wp jquery lightbox.

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

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

Но на этом опять не всё. Как вы помните плагины — это дополнительная нагрузка, от которой многие стараются избавиться. Наверное, полностью избавиться от плагинов нельзя, но некоторые можно (если, конечно, знать как) заменить скриптами.

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

Советую прочесть  Создаём карту сайта без плагина Google XML Sitemaps

Устанавливаем специальный скрипт.

Итак, первое, что делаем, скачиваем скрипт,  находящийся в папке simplebox.

После этого нужно содержимое папки (1 папка и 3 файла) закинуть в главную директорию вашего сайта. Как сделать написано в статье «Регистрация домена. Установка WordPress. Установка robots.txt» забрасываем аналогично файлу robots.

Следующий наш шаг — это нужно скачать код для файла footer.php, который нужно прописать соответственно в файле footer.php.

Для этого нужно в админке вашего сайта зайти «внешний вид», «редактор» и тогда увидите «Подвал» (footer.php) с правой стороны нажимаем на него и спускаемся вниз до конца.

добавляем код

Теперь скаченный код копируем перед тегом </body> и в трёх местах вместо http://site.ru/ нужно вставить домен вашего сайта. Нажимаем обновить файл.

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

редактируем картинку

Кликнув по значку «карандаш», откроются параметры изображения. В окна, выделенные красным цветом, а именно атрибут alt и атрибут title в обязательном порядке записываем название картинки!

параметры изображения

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

Теперь вы сможете разместить картинку у себя на сайте красиво, так как вам понравиться.

 

С уважением, Валерий Матлаев

Материалы по теме:

Плагин Image Zoom для WordPress — работа с изображениями на блоге
Здравствуйте, уважаемые читатели блога. К WordPress существует большое количество плагинов, при помощи которых можно облегчить работу с графикой на сайте, сделать процедуру добавления картинок ...
Удалим вредоносный код при помощи плагина
Здравствуйте, уважаемые читатели блога. В этой маленькой, но нужной статье пойдёт речь о тех, кто экономит деньги (и я их понимаю) и скачивает бесплатные ...
Социальный замок – закрытая информация
Здравствуйте, читатели моего блога и его гости. Для большинства я Америку не открою, но уверен, что есть такие люди, которые не знают, что такое ...
Создаём карту сайта без плагина Google XML Sitemaps
Здравствуйте, читатели моего блога, а также его гости. Сегодня я расскажу вам, что создать sitemap, а именно создать карту сайта можно без специально для ...
Настройка плагинов (продолжение)
Здравствуйте, читатели моего блога. Продолжим производить настройку оставшихся установленных плагинов. Осталось немного, так, что наберитесь терпения и вперёд за работу.
Советую прочесть  Устанавливаем основные плагины на Wordpress
Хочешь получать статьи этого блога на почту?
Новые статьи блога
Комментариев нет

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: