# Встраивание Групповой Страницы на Веб-сайт

Теперь можно встраивать страницу группы в веб-сайт, внешний по отношению к ОСП. Здесь вы найдете пошаговые инструкции по настройке. Эта функция является относительно новой и не была всесторонне протестирована на всех платформах. Пожалуйста, [свяжитесь с вашим местным ОСП](https://www.openfoodnetwork.org/find-your-local-open-food-network/), если у вас возникли проблемы с встраиванием страницы группы на вашем веб-сайте.

## Предварительные условия для Встраивания Страницы Группы

### Платформа

Можно встроить страницу группы на любом веб-сайте, где можно добавить пользовательский html на страницу назначения, включая такие платформы, как WordPress, Squarespace или Wix.

Ниже приведены некоторые ресурсы, специфичные для платформы:

* Для дополнительной информации о добавлении пользовательского html с помощью "кодовых блоков",  [перейдите на Squarespace](https://support.squarespace.com/hc/en-us/articles/206543167)

### Безопасность

Поскольку ОСП является платформой электронной коммерции и обрабатывает денежные операции, она имеет более высокое требование к безопасности, чем некоторые веб-сайты. Поэтому необходимо настроить SSL/TLS на веб-сайте, в который необходимо встроить страницу группы. Вы можете получить бесплатный сертификат безопасности от [Let’s Encrypt](https://letsencrypt.org/) или примерно за $10-$30 на другом платном сервисе.

### ОСП страница Группы

Прежде чем продолжить, необходимо завершить [настройку вашей групповой страницы в Открытой Сети Продуктов](/basic-features/groups/group-page.md). Чтобы выполнить следующие действия по настройке, необходимо знать URL-адрес страницы группы ОСП.

## Как встроить страницу группы

**1) Свяжитесь с вашим местным ОСП**

Прежде всего, вам нужно будет связаться с [вашей местной командой ОСП](https://openfoodnetwork.org/ofn-local/) и сообщить им, что вы хотите внедрить свою страницу группы ОСП на вашем личном сайте. Необходимо предоставить им имя вашего внешнего домена, например regionalgroup.ru, чтобы они могли разрешить вашему веб-сайту обращаться к ОСП.

**2) Добавление Пользовательского HTML в ваш веб-сайт**

Встраивание страницы группы так же просто, как вставка строки кода на ваш веб-сайт. Ниже приведен пример HTML-кода, который следует вставить на страницу, куда необходимо встроить страницу группы ОСП. Вам нужно будет заменить 'regional-hub' на уникальную постоянную ОСП-ссылку вашего магазина.

```
<iframe src="/groups/regional-hub?embedded_shopfront=true"style="width:100%;min-height:35em"></iframe>
```

После этого страница группы ОСП появится на веб-сайте в месте вставки HTML.

ПРИМЕЧАНИЕ: Смотрите инструкции по [созданию и управлению страницей группы](/basic-features/groups/group-page.md), чтобы узнать, как редактировать вашу уникальную постоянную ссылку ОСП.

**3) Оформление**

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

## Инструкции для Посетителей

### Cookies

У большинства пользователей в веб-браузерах включены файлы cookie. Но если посетитель не включает файлы cookie, он может увидеть сообщение об ошибке, похожее на приведенное ниже и не сможет просмотреть встроенную группу.

![](/files/-MCbcnMFgwOvIUt0EIB4)


---

# 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://guide.openfoodnetwork.ru/basic-features/groups/embed-a-group-page.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.