# Изображения и файлы

{% hint style="success" %}
Администрирование и управление контентом CMS Zeta Web выполняется в программе 1С: Предприятие.
{% endhint %}

#### Zeta Web 2.x

Основные инструменты доступны в панели управления сайтом, которую можно открыть из меню **Zeta Web,** кликнув на соответствующий пункт меню **"Панель управления сайтом"**.

![](/files/B8tTCp9G3JhpTTp6iCBB)

#### Zeta Web 3.x

Основные инструменты доступны по ссылке меню **Инструменты Zeta Web** →**Панель управления "Контент"**.

![](/files/mY6TyZoscS735urdQlRu)

Изображения и файлы можно использовать при верстке страниц, шаблонов контролов, а также, при наполнении тегов head, body и файла robots.txt в настройках доменов сайта.

## Файлы

### Добавление нового файла

#### Zeta Web 2.x

Для добавления файлов и изображений нужно перейти на вкладку **Наполнение сайта** и затем на вкладку **"Картинки и файлы"**.

![Добавление нового файла или изображения](/files/-LmsOFlpcocZtFrCepQM)

#### Zeta Web 3.x

Для добавления файлов и изображений нужно перейти в раздел "**Картинки и файлы"**.

![](/files/03fIBeTAPDjZgCvOPE4g)

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

![](/files/CXvOXCK5fPWYfntdKJFN)

При необходимости, укажите описание к файлу и нажмите кнопку **"ОК"**.

![Ввод описания для файла](/files/-LmsOnRTJaKTj51G8SHv)

Для удобства, добавляемые файлы и изображения можно структурировать по папкам.&#x20;

Для этого нажмите правой кнопкой мыши на списке файлов и выберите пункт контекстного меню **"Новая группа"**.  Задайте **наименование** и нажмите кнопку "**ОК**". Перетащите нужные файлу в созданную группу.

![Создание новой папки для хранения файлов](/files/-LmscewTMLClhs13UDdO)

![Создание новой папки для хранения файлов](/files/-Lmsd7yzR0DX04q6eZ87)

### Получение ссылки на скачивание файла

#### Zeta Web 2.x

У каждого файла есть реквизит **"URL Name".** Значение из данного реквизита будет использовано при генерации ссылки на скачивание файла или изображения.

![Форма редактирования файла](/files/-LmsPRBU_L7vZ7oQij2d)

Для получения ссылки на скачивание, нужно нажать на кнопку **"Получить ссылку"** и в открывшемся окне нажать на кнопку "**Получить**".

![Форма генерации ссылки на скачивание файла](/files/-LmsQC69Q1xakCF2inq9)

![Форма генерации ссылки на скачивание файла](/files/-LmsQtI4XAyv9t_8WWBv)

{% hint style="warning" %}
Все изображения и файлы после первичного обращения к ним кешируются на веб-сервере. Если вы изменили содержимое файла не меняя его наименования в URL, рекомендуем воспользоваться параметром "**Добавить версию файла**" при генерации ссылки, получить новое значение и заменять ссылку на файл в местах ее использования.
{% endhint %}

#### Zeta Web 3.x

Для получения ссылки на скачивание, нужно нажать на кнопку **"Ссылка на скачивание"** и в открывшемся окне нажать на кнопку "**Получить URL**".

![](/files/nCiqztWgK4teWuZCItLv)

{% hint style="warning" %}
Все изображения и файлы после первичного обращения к ним кешируются на веб-сервере. Если вы изменили содержимое файла не меняя его наименования в URL, рекомендуем воспользоваться параметром "**Добавить версию файла**" при генерации ссылки, получить новое значение и заменять ссылку на файл в местах ее использования.
{% endhint %}

### Размещение файла на странице

#### Zeta Web 2.x

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

![Верстка ссылок в html-редакторе](/files/-LmsRcxSz9YEGiJc6ptp)

или воспользоваться GUI-интерфейсом.&#x20;

Для этого, перейдите на вкладку "**Визуальный редактор"**, затем на вкладку "**HTML элементы**" и перетащите элемент "**Файл**" в окно html-редактора.

В открывшемся окне, нажмите на **"..."** в строке **Адрес** и выберите "**Картинки (Zeta Web)**".

![Добавление ссылки в визуальном html-редакторе](/files/-LmsU4qZJt6G8cfPGAqj)

Затем снова нажмите на **"..."** в строке **Адрес** и выберите загруженный **файл**.

Задайте **текст** или **пиктограмму** для ссылки нажав на **"..."** в поле "**Картинка/Текст**" и выберите "**Строка**" или "**Картинки (Zeta Web)**".

Затем введите **текст** в поле "**Картинка/Текст**" если выбран тип данных "**Строка**", или выберите **картинку** и нажмите кнопку "**ОК**".

<figure><img src="/files/VVEzQyTs3gFUCrgxyM1n" alt=""><figcaption></figcaption></figure>

В  html-редакторе будет виден текст ссылки.

![Верстка ссылок в html-редакторе](/files/-LmsW8KGNRNDROnzBw99)

{% hint style="info" %}
Рекомендуется добавление ссылок через GUI-интерфейс там, где это возможно. При таком добавлении ссылок вам не потребуется изменять адрес картинки, после изменения поля "URL Name". Адреса ссылок, в таком случае, сконвертируются автоматически.
{% endhint %}

#### Zeta Web 3.x

Откройте интересуемую страницу и на вкладке **Основное** нажмите "**Редактировать**", в окне **Редактирование HTML**, выберите соответствующий **файл** и перетяните в поле **Текст HTML.**

Определите порядок вставки **объекта** - файл.

![](/files/2PTvME5WO9XDr3NVwe6U)

![](/files/NwqG5GgEaOYOvK6WVmJV)

{% hint style="info" %}
Вы можете изменять текст ссылки, вставлять другие валидные теги **вовнутрь тега \<a>**, а также добавлять к нему любые атрибуты.
{% endhint %}

## Изображения

### Добавление нового изображения

Добавление изображений производится в аналогичном порядке.

### Получение ссылки на скачивание изображения

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

### Получение ссылки на просмотр изображения

#### Zeta Web 2.x

Для получения ссылки на просмотр изображения, нужно нажать на кнопку "**Просмотр**" и, в открывшемся окне, нажать на кнопку "**Получить**".

![Получение ссылки на просмотр изображения](/files/-LmsjTdW9-ESIBZ7IPIq)

#### Zeta Web 3.x

Для получения ссылки на просмотр изображения, нужно нажать на кнопку "**Ссылка на просмотр**" и, в открывшемся окне, нажать на кнопку "**Получить URL**".

![](/files/CzFGgSCyQVvzdWGxJWPx)

### Размещение изображения на странице

#### Zeta Web 2.x

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

![Верстка изображения в html-редакторе](/files/-LmsgbhTLIsQq8ssmbGR)

или воспользоваться GUI-интерфейсом.&#x20;

Для этого, перейдите на вкладку "**Визуальный редактор**", затем на на вкладку "**HTML элементы**" и перетащите элемент **"Картинка**" в окно html-редактора.

![Добавление изображения в визуальном html-редакторе](/files/-LmsYpun7ScVg6DDLkHY)

Выберите добавленную картинку нажав на **"..."** в строке "**Картинка**", укажите, при необходимости, **ширину/высоту** изображения и нажмите кнопку "**ОК**".

![Добавление изображения в визуальном html-редакторе](/files/-Lms_yIgr88aFRDyOj0A)

#### Zeta Web 3.x

Откройте интересуемую страницу и на вкладке **Основное** нажмите "**Редактировать**", в окне **Редактирование HTML**, выберите соответствующий **файл** и перетяните в поле **Текст HTML.**

Определите порядок вставки **объекта** (изображение, файл, JS скрипт), задайте **CSS класс**, при необходимости, **ширину/высоту** изображения.

![](/files/hZfUSrI0WyEg1dnh0Knq)

### Оптимизация изображений

{% hint style="info" %}
При указании размера картинки в соответствующие поля, вы можете существенно понизить вес готового изображения.&#x20;

Все изображения с параметрами отличными от начальных обрабатываются и оптимизируются на веб-сервере.&#x20;

Вы можете самостоятельно добавить параметры "imgw" (ширина) и "imgh" (высота) к адресу изображения. \
Например, /f/image.jpg?imgw=100\&imgh=100
{% endhint %}

![Информация об изображении без изменения ширины и высоты](/files/-Lmsb3752oSb4MVhZkx1)

![Информация об изображении с изменениями ширины и высоты](/files/-LmsbYkvalPXN5YvAXOD)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help-zetaweb.zetasoft.ru/seo-i-upravlenie-kontentom/izobrazheniya-i-faily.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
