# Установка стилей на страницу профиля

В наборе есть стили для системных страниц: страницы профиля, смены пароля и для мобильного приложения. Все эти стили находятся в файле `pages-profile/profile-styles.css`. 

### Видеоинструкции

{% embed url="<https://youtu.be/zXPJnpENnnQ>" %}

Если у вас проблемы с работой Youtube, [откройте видео в VK](https://vkvideo.ru/video-230119130_456239018?list=ln-AzGv360DvvfnTkPlco).

{% hint style="warning" %}
**Важно.** Адреса для кастомных страниц должны быть в точности как ниже:

Для страницы профиля: `profile`

Для страницы смены пароля: `changePassword`

Для страницы мобильного приложения: `chatium`

Если зададите другие адреса, необходимо будет исправить их в глобальном скрипте и в скрипте для страниц.
{% endhint %}

***

### Краткий алгоритм установки

1. Перейдите в раздел Сайт — Страницы.
2. Создайте отдельную папку для кастомных страниц.
3. Создайте пустую страницу. В настройках страницы отключите индексирование и боковое меню для всех пользователей.
4. Перейдите в визуальный редактор страницы и добавьте HTML-блок. Вставьте в него код из файла `frame-profile.html`.
5. Добавьте на страницу блок JavaScript-код и добавьте в него код из файла `frame-script.js`.
6. Перейдите в вашу тему, которая включена в аккаунте и скопируйте ссылку на bundle-файл стилей. Вставьте ссылку в скрипт на новой странице профиля. Используйте относительный путь.
7. Сохраните страницу профиля, вернитесь в её настройки и скопируйте дважды, чтобы настроить страницы смены пароля и мобильного приложения.
8. На страницах смены пароля и мобильного приложения замените в HTML-блоках iframe на соответствующие. Они находятся в файлах `frame-changePassword.html` и `frame-chatium.html`.
9. Добавьте в тему файл стилей для профиля: `profile-styles.css`.
10. Добавьте в тему глобальный скрипт из файла `global-script.js`. Можно во вкладку JS настроек темы, можно в отдельный файл — работать будет в любом случае.

Готово, вы великолепны!