Контент-Менеджер .NET Forge CMS

HTML-редактор позволяет загружать графику с локального диска и размещать ее на веб-странице. Процесс размещения изображения очень прост:

• Выберите место для изображения на странице, установите курсор в эту позицию и нажмите кнопку Изображение на панели редактора. Появится диалог:

  

• Перейдите к форме загрузки изображения из структуры сайта с помощью кнопки . Появится окно Менеджера файлов:

  

  Окно Менеджера файлов имеет дополнительный инструмент - Загрузить файл.

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

• Для загрузки файла с локального компьютера нажмите кнопку Обзор. В появившемся диалоге найдите файл на локальном компьютере, поле Имя файла на сервере заполнится автоматически (вы можете изменить его по собственному усмотрению). Для размещения файла в конкретной папке сервера воспользуйтесь структурой сайта в левом окне. Адрес папки, куда будет загружен файл, всегда можно увидеть в поле Папка на сервере. 

  

  Загрузка файла осуществляется на сервер после этого нажатием кнопки Загрузить.
• Выберете файл на сервере (загруженный заранее или на предыдущем шаге с помощью менеджера загрузки с локального компьютера) с помощью левой панели и нажмите кнопку Сохранить. Изображение появится в окне предпросмотра, а также будет указана его ширина и высота, которые задаются в коде с помощью атрибутов width и height тега <img> соответственно:

  

Далее в форме Новый рисунок заполните следующие поля:

• Название (title) – служит для ввода всплывающей подсказки к рисунку. Подсказка будет выведена при наведении курсора независимо от того, показан сам рисунок или нет.
• Альтернативный текст – позволяет получить текстовую информацию об изображении при отключенной в браузере загрузке изображений. Поскольку загрузка изображений происходит после получения браузером информации о нем, то альтернативный текст появляется раньше самого рисунка. Некоторые браузеры также отображают альтернативный текст в виде подсказки, появляющейся при наведении курсора мыши на изображение. В HTML-тегах альтернативный текст задается с помощью атрибута alt тега <img>, т.е. HTML-код вставки изображения с альтернативным текстом "Логотип «1С-Битрикс»" будет таким:

  <img src="/upload/1c-bitrix-logo-vert1.png" alt="Логотип «1С-Битрикс»" width="150" height="150" />
  

• Горизонтальный отступ и Вертикальный отступ. Если задать эти параметры отличными от нуля, то изменение положения изображения сразу отображается в окне предпросмотра.

  

  В коде эти параметры задаются с помощью атрибутов hspace и vspace тега <img>. HTML-код вставки изображения c горизонтальным отступом 30 пикселей и вертикальным отступом 5 пикселей имеет вид:

  <img src="/upload/1c-bitrix-logo-vert1.png" title="Логотип «1С-Битрикс»" hspace="30" vspace="5" border="0" align="left" alt="Логотип «1С-Битрикс»" width="150" height="150" />
  

• Вокруг изображения можно добавить рамку, цвет которой совпадает с цветом текста на веб-странице, ее толщину в пикселях задают в поле Толщина рамки. В HTML коде этот параметр задается с помощью атрибута border тега <img>.
• Параметр Выравнивание дает возможность указывать положение изображения относительно текста или других изображений на веб-странице. В форме вставки изображения в визуальном редакторе этот параметр может принимать следующие значения:

  

  В коде этот параметр задается с помощью атрибута align тега <img>.

  Представим в виде таблицы подробное описание значений этого атрибута:

  Значение Описание bottom Нижняя граница изображения выравнивается по базовой линии текстовой строки. Это значение установлено по умолчанию. left Изображение располагается по левому краю родительского элемента. middle Середина изображения выравнивается по базовой линии текущей строки текста. right Изображение выравнивается по правому краю родительского элемента. top Верхняя граница изображения выравнивается по самому высокому элементу текущей строки.