Красивый веб-адрес с помощью fruitionsite.com

В этой статье описывается, как привязать свой веб-домен (например, fruitionsite.com) к адресу страницы Notion, с помощью сервиса Fruition

Ниже вы найдете перевод инструкции с fruitionsite.com, все авторские права принадлежат автору сайта fruitionsite.com.

---

Настройка доменного имени к странице Notion состоит из 4-х этапов:

1. Приготовления

1. Откройте публичный доступ для Notion-страницы, к которой вы хотите привязать домен. Можете также включить индексацию поисковиками.
2. Приобретите доменное имя через любого регистратора, например, Beget.

2. Настройка аккаунта в Cloudflare

1. Зарегистрируйтесь в Cloudflare: https://dash.cloudflare.com/sign-up
   
2. Введите доменное имя, которое собираетесь использовать. Даже если вы собираетесь использовать поддомен, здесь все равно надо внести корневое доменное имя
   
3. Выберите бесплатный Free-план
   
4. Если у вас нет импортированной A-записи, добавьте одну. Добавьте ваш домен, например, fruitionsite.com, в поле Name, и запись 1.1.1.1 — в поле Content.
   
   Если вы используете поддомен — добавьте запись с ним в поле Name и 1.1.1.1 в поле Content.
   
   
5. Скопируйте 2 сервера имен (nameserver), которые заканчиваются на .ns.cloudflare.com
   
6. Вставьте скопированные сервера имен на страничку настроек домена у вашего регистратора (например, Beget). Сохраните ваши настройки
   
7. Подождите несколько минут, а затем кликните Done, check nameservers
   
8. Выберите Flexible SSL/TLS encryption mode
   
9. Включите Always Use HTTPS, Auto Minify, и Brotli (все три пункта опциональны, но рекомендуемы)
   
10. Нажмите Done
    
11. Вы должны увидеть такой экран. Если Cloudflare не обнаружила ваш сайт, нажмите Re-check your site и обновите страницу
    
12. Выберите страницу Workers (один из синих блоков) и кликните на Manage Workers
    
13. Выберите любой доступный (специфический для Cloudflare) поддомен для вашего Worker. На самом деле, не важно, что вы выберете на этом этапе
    
14. Нажмите на Set Up, а затем на Confirm
    
15. Выберите план Free
    
16. Верифицируйте свой емейл, если еще не сделали этого, после чего вернитесь к странице Manage Workers
    
17. Нажмите Create a Worker
    

3. Настройка и генерация скрипта для Cloudflare

Примечание об авторстве. Следующий сниппет импортирует код с оригинальной страницы fruitionsite.com, (пункт Customize and generate the script (2 mins), скрипт https://fruition.stephenou.vercel.app). Внимание — все эти настройки вы можете изменять впоследствии и в самом Worker

Введите ваш домен в поле Your domain (e.g. example.org), и адрес вашей Notion-страницы — в поле Notion URL for example.org

Чтобы добавить подстраницы к домену (например, /about), нажмите Add a pretty link

Вы можете добавить свойства Title и Description для вашей страницы, а также выбрать шрифт и добавить любой Javascript-код для нее. Для этого нажмите TOGGLE STYLE AND SCRIPT SETTINGS

После того, как закончите, нажмите  COPY THE CODE  , чтобы скопировать код

4. Вставка кода в Cloudflare

1. Удалите текущий код, и вставьте скопированный
   
2. Нажмите Save and Deploy
   
3. После сохранения, нажмите на имя своего сайта вверху страницы
   
4. Пройдите на страницу Workers и выберите Add Route
   
5. Если ваш красивый адрес имеет вид, например, fruitionsite.com, напечатайте fruitionsite.com/* в поле Route. Или поддомен.fruitionsite.com/*, если собираетесь использовать поддмен. Или *fruitionsite.com/*, если вы хотите использовать все другие поддомены, такие, как www. Выберите Worker‘а, которого только что создали
   
6. Нажмите Save, и вы закончили! Теперь можно запустить вашу страничку Notion на красивом адресе
   
7. Если вам нравится этот сервис, то автор будет рад ссылке на fruition.com на вашем сайте