> For the complete documentation index, see [llms.txt](https://docs.wfolio.pro/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wfolio.pro/site/blocks/integration/calendar.md).

# Как добавить календарь

Вы можете добавить на сайт внешний календарь, чтобы посетители видели ваше расписание и свободные даты для съемки. Для этого нужно получить HTML-код календаря и добавить его на сайт.

Какой календарь можно добавить:

* **Яндекс Календарь** ([360.yandex.ru/calendar](https://360.yandex.ru/calendar/))\
  Смотрите инструкцию, как получить [код для вставки](https://yandex.ru/support/yandex-360/customers/calendar/web/ru/widget).
* **Google Calendar** ([calendar.google.com](https://calendar.google.com/calendar))\
  Смотрите инструкцию, как получить [код для вставки](https://support.google.com/calendar/answer/41207?hl=ru).

### Как встроить календарь на сайт

* Войдите на сервис. Если нужно, создайте новый календарь.
* По инструкции выше получите **HTML-код** календаря.

{% hint style="info" %}
Чтобы календарь отображался по центру страницы, установите в коде значение `width="..."` на `width="100%"`.
{% endhint %}

* На составной странице нажмите <mark style="background-color:blue;">**(+)**</mark> для добавления нового блока.

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

* Перейдите во вкладку **«Виджеты»** и выберите нужный HTML-блок.

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

* **Вставьте** полученный **код в HTML блок**. Сохраните изменения.

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

При просмотре страницы на ней будет отображаться календарь. Им можно управлять через Яндекс или Google.
