Вбудований редактор. Робота із зображеннями

  • Костянтин Рогоза
  • Загальне
  • 30.06.17

Вставка зображень

Для того щоб вставити зображення, натисніть кнопку img «Зображення» на панелі інструментів. Властивості зображення в діалоговому вікні дозволяють задати параметри конфігурації, які визначають джерело зображення, його розмір, властивості екрану або інші додаткові властивості.

Діалогове вікно «Властивості зображення» містить чотири вкладки:

  • Інформація про зображення
  • Посилання
  • Надіслати
  • Додаткове

Інформація про зображення

Вкладка «Інформація про зображення» відкривається за замовчуванням після натискання кнопки «Зображення» на панелі інструментів. Дана вкладка дозволяє встановити для зображення URL (шлях до файлу) та налаштувати параметри відображення його на сторінці.

Елементами вкладки «Інформація про зображення» є:

  • URL  web-адреса зображення. Зображення може бути розташоване на сайті edorada.org або на зовнішньому сервері. При завантаженні зображення на сервер URL формується автоматично. Якщо необхідно використовувати зображення, яке зберігається на зовнішньому ресурсі, то потрібно відобразити повний шлях, наприклад: http://farmenergymedia.extension.org/sites/all/themes/extension/images/extension-logo.png
  • Альтернативний текст – це короткий текстовий опис зображення, яке з'являється у вигляді підказки при наведенні на нього курсора миші.
  • Ширина – ширина зображення в точках (пікселях). За замовчуванням це розмір вихідного зображення.
  • Висота – висота зображення в точках (пікселях). За замовчуванням це розмір вихідного зображення.
  • Рамка – розмір видимого кордону навколо зображення в точках (пікселях). Рамка встановлюється тільки в разі потреби відокремити зображення від фону сторінки.
  • Горизонтальний відступ – відстань між лівим і правим краями зображення і іншими елементами сторінки, які оточують зображення, в точках (пікселях).
  • Вертикальний відступ – відстань між нижнім і верхнім краями зображення і іншими елементами сторінки, які оточують зображення, в точках (пікселях).
  • Вирівнювання – вирівнювання зображення на сторінці. Доступні опції: по правому і лівому краю.
  • Попередній перегляд (Preview) – попереднє відображення обраного зображення, відформатованого відповідно до параметрів.

Якщо зображення раніше завантажувалися на сервер, то можна їх додати на сторінку за допомогою кнопки «Переглянути на сервері». При натисканні на цю кнопку відкриється діалогове вікно з усіма зображеннями, раніше завантаженими на сервер з даної сторінки.

Сервер зображень

Щоб додати нове зображення на сервер, знаходячись на сторінці серверу зображень, натисніть кнопку  і виберіть потрібний файл(и). Зі списку вже завантажених зображень можна вибрати потрібне (подвійне натискання на зображення, або клік правою кнопкою миші і в контектному меню пункт «Вибрати»). Зображення, які стали неактуальні, можна видалити клікнувши правою кнопкою миші на зображенні і вибрати пункт «Вилучити». В результаті відкриється діалогове вікно, в якому слід підтвердити обрану дію, або відмовитися від неї.

Завантаження зображень

Альтернативним методом завантаження зображення з локального комп'ютера є вкладка «Надіслати». Щоб завантажити файл зображення, необхідно натиснути на кнопку «Вибрати файл». У вікні, необхідно перейти до відповідної теки і вибрати файл з підготовленим зображенням, двічі клацнувши по ньому або з використанням кнопки «Відкрити».

Зображення рекомендується підготувати для розміщення на сторінках сайту, тобто змінити його розмір у точках (пікселях) за допомогою графічного редактора (AdobePhotosop, GIMP, Paint та ін.) До необхідного. Рекомендується розміщувати зображення з шириною не більше 800 точок (пікселів).

Щоб відправити файл на сервер, необхідно натиснути на кнопку «Відправити на сервер».

Обробка зображень на сервері

Як було описано вище, зображення рекомендується підготувати для розміщення на сторінках сайту. Для невеликого корегування розмірів зображень можна на закладці «Інформація про зображення» змінити його розміри, ввівши нові значення в поле «Ширина» та «Висота». За замовчуванням при зміні одного параметра зображення другий буде коригуватися автоматично (зображення буде змінюватися пропорційно). Для того щоб відключити автоматичну зміну другого параметра, необхідно натиснути на кнопку «Зберегти пропорції» . Щоб повернути автоматичну зміну відносин параметрів, потрібно ще раз натиснути на кнопку «Зберегти пропорції» .