Просмотров: 5722 (Статистика ведётся с 06.02.2017)
Денис Котлярчук
Сложность урока:
2 уровень - несложные понятия и действия, но не расслабляйтесь.
1
2
3
4
5

Визуальный редактор "1С-Битрикс: Управление сайтом" позволяет загружать графику с вашего компьютера и размещать ее на страницах сайта. Для размещения изображения нажмите кнопку Изображение на панели инструментов редактора:

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

  • указать прямой адрес;
  • выбрать из медиабиблиотеки;
  • выбрать из структуры сайта.

Давайте рассмотрим эти способы поподробнее.


Адрес изображения

Укажите путь к картинке на сервере или полный адрес изображения в сети. После ввода значения вы увидите "миниатюру" изображения, а так же сможете задать его размер . Размер может быть определен в пикселях или процентах. Обратите внимание, что современные шаблоны сайтов используют разные размеры изображения в зависимости от размера экрана. Такой шаблон называется адаптивным Адаптивный веб-дизайн (англ. Adaptive Web Design) — дизайн веб-страниц, обеспечивающий правильное отображение сайта на различных устройствах, подключённых к интернету и динамически подстраивающийся под заданные размеры окна браузера. . В этих случаях мы рекомендуем отмечать опцию Не указывать размер ;


Выбор из медиабиблиотеки

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

  1. Нажмите кнопку размещения изображения на панели инструментов визуального редактора;
  2. Нажмите кнопку для перехода к выбору из медиабиблиотеки;
  3. Появится окно библиотеки , выберите нужное изображение и нажмите кнопку Выбрать;
  4. Как и в предыдущем пункте вы увидите "миниатюру" изображения и сможете задать настройки размера.

Выбор из структуры сайта

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

  1. Нажмите кнопку размещения изображения на панели инструментов визуального редактора;
  2. Нажмите на стрелку на кнопке и выберите пункт Выбрать из структуры сайта;
  3. Откроется встроенный менеджер файлов:

    В нижней части менеджера расположены две вкладки:

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

Заключение

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

17


Курсы разработаны в компании «1С-Битрикс»