Повний посібник з блогу Ghost

Велике зібрання статей про те, як та де запустити блог Ghost, як налаштувати та кастомізувати. Підключення Google Search, AdSense та Analytics

Повний посібник з блогу Ghost
Photo by Andras Vas on Unsplash

Вступ

Привіт усім. У цій статті я збираю всі пости, які так чи інакше пов’язані з розгортанням, встановленням, налаштуванням і кастомізацією вашого персонального блогу на платформі Ghost. Усі статті написані та перевірені мною і є логічним продовженням одна одної. Звісно, я не заглиблююся в деякі деталі, вважаючи, що, коли ви вирішите робити щось подібне, то ви вже певною мірою підготовлені морально та технічно до труднощів.

Серед усього, що я описую, ви навряд чи знайдете щось суперунікальне та те, чого ще не було в інтернеті. Тим не менш, я все ще знаходжу для себе щось нове і пробую доповнити це. Дійсно, деякі речі я бачу трохи інакше, я намагаюся додати більше деталей або фотографій для кращого розуміння. Але більшість статей все ж вимагатиме подальшого самостійного вивчення.

Ось деякі технологій, які будуть задіяні в моєму матеріалі:

  • Віртуалізація та контейнери / Proxmox VE / Docker / Portainer
  • Linux Ubuntu / Командний рядок
  • Мережі / Домени / Брандмауер
  • Тунелі Cloudflare
  • Програмування на Javascript та CSS
  • Сервіси Google (Analytics / Search / AdSense)

Хостинг, інсталяція та налаштування блогу

Перша публікація в цій серії в стосується хостингу, але також пояснює вибір і порівнює Ghost з Wordpress. Це як легкий вступ до того, що станеться пізніше

Де захостити власний блог - Ghost
Привіт. З тих пір як я почав цікавитись темою homelab в мене засіло бажання зробити свій сайт і самостійно його захостити. Проте чим глибше я продирався крізь терени інформації тим більше я дізнавався про цікаві сервіси які я можу самостійно хостити, а серед них були і блоги. Отже вирішено заради

Основа

Наступні дві статті мають на меті розповісти покроково як запустити блог у себе вдома. Це дуже технічні інструкції, які будуть посилатись також на інші дописи мого авторста і не тільки. Можна вважати ці дві статті базою всього цього зібрання.

Хостинг власного блогу: залізо та віртуальний контейнер (частина 1) - Ghost
Вступ Ця стаття являє собою покрокову інструкцію про те, як запустити блогу Ghost в домашніх умовах на сервері Proxmox VE, який встановлений на міні сервері у вас вдома. У першій частині ми роглянемо лише залізо та підготовку контейнера, а у другій частині пройдемось покроково по установці блогу та підключенні доменного
Хостинг власного блогу: інсталяція та налаштування (частина 2) - Ghost
Вступ Привіт. У попередній частині ми попрацювали над базою для нашого блогу, а саме: * Обрали залізо * Встановили Proxmox VE * Підготували LXC контейнер з Linux Ubuntu 23.10 Все це докладно описано тут: Хостинг власного блогу: залізо та віртуальний контейнер (частина 1) - GhostВступ Ця стаття являє собою покрокову інструкцію про

Допоміжні

Публікації використані у процесі інсталяції блогу. Всі вони напряму не стосуються блогу Ghost, проте без них буде неможливо його запусти. Тому якщо ви тим чи іншим чином цікавитесь темою хостингу блогу, то саме ці статті можуть вам допомгти у деяких питаннях. Особливо раджу про тунелі Cloudflare

Як придбати власний домен?
Вступ Рано чи пізно у житті IT-ішніка постає питання розміщення свого сервісу в публічному просторі. А це можливо лише через придбання власного доменного імені і привʼязки його до сервера. В цій короткій статті спробую провести вас покроково по процесу придбання доменного імені на своєму приклади. Основні причини, чому доменне ім’я
Найшвидша інсталяція Docker і Portainer у Proxmox VE
Вступ Вітаю. Давайте назвемо це основою основ, бо вбачаю, що не раз буду давати посилання саме на цю інструкцію. Віртуалізація і контейнеризація пляшуть бік о бік у #хоумлаббінгу. І я постійно бачу як у практичних задачах все це тісно пересікається між собою. Для зручності розуміння малюю вам діаграмку, у якій
Як налаштувати публічний доступ до своїх приватних сервісів - тунелі Cloudflare Zero Trust
Вступ Перед тим як розпочати було б добре пояснити на пальцях сенс того, що ми будемо робити. Уявіть, що у вас є домашній сервер і ви запустили на ньому свій веб-сайт або блог. Він знаходиться лише у вашій локальній мережі, а вам би так хотілось поділитись ним з друзями або

Перші налаштування

Кожен публічний сайт має просуватись у пошуку, а для моніторингу параметрів треба збирати аналітику. Перше, що я зробив, а також рекомендую вам, так це інтегрувати Google сервіси.

SEO і не тільки - найперші кроки - Ghost
Вступ Описані нижче кроки стосуються практично кожного публічного сайту. І чим швидше це зроблено, тим краще. Як тільки ваш сайт, а в даному прикладі мій блог запущений на движку Ghost, запрацював і доступен в мережі інернет, то вам необхідно зробити його видимим у пошуку, включити аналітику, щоб відслідковувавати хто, як

І трохи детальніше про те як добитись увімкнення реклами Google AdSense та налаштувати її під свої потреби

Як запустити рекламу AdSense?
На прикладі свого досвіду розповім як успішно підключити та запустити рекламу на сторінках вашого блогу. Підключення Звісно, все починається з налаштування аккаунта AdSense та підключення до вашого сайту. Наступним кроком може бути робота з файлом Ads.txt, якщо ви хочете більше контролю над рекламою. Але це все лише передумови, які
Як я налаштував рекламу AdSense для свого блогу
Про баланс між кількістю реклами, її розташуваннян та привабливістю для користувача. Що робити, щоб користувачі не закривали ваш сайт одразу

Кастомізація

Нижче описую те, що я вже зробив у своєму блозі. Всі ці статті про те як покращити чи то вигляди чи функціональність блогу. Можливо вам і не все потрібно, але я дуже раджу додати компонент який будує зміст (Table of Contents) та зробити підсвідку коду, якщо ви збираєтесь публікувати технічні дописи.

Теги

Як людина яка поважає структуровані дані я трошки покращив зовнішній вигляд тегів на свій смак. Мені хотілось, щоб було видно весь перелік, а не тільки перший, бо я і сам використовую їх.

Як відобразити всі теги публікації - Ghost
Почавши роботу з власним блогом помітив, що моя тема Source на сторінці публікацїї відображає лише перший тег, а не всі ті, що я обирав при написанні. І з самої першої публікації засіла думка колись достати всі теги і відобразити їх. З цього і виник цей пост ❗Зразу хочу зазначити, що
Стилізація тегів - Ghost
Привіт. Минулий раз ми редагували файли теми нашого блогу задля відображення всіх тегів публікації замість одного, як було раніше. Як відобразити всі теги публікації - GhostПочавши роботу з власним блогом помітив, що моя тема Source на сторінці публікацїї відображає лише перший тег, а не всі ті, що я обирав при

Вставки коду

Тут розповім як підключити Prism, щоб вставки коду виглядали гарненько. Ніхто не любить купу сірого нечитабельного коду.

Підсвічування коду - Ghost
Вступ Привіт. Вже не в одному моєму дописі є куски коду, які виглядають доволі блідо на фоні іншого контенту, а також непривабливо у порівнянні з будь яким іншим сайтом, де є хоч якась підсвітка кода. Сьогодні ми це виправимо. Ghost блог має підтримку коду, але я би сказав, що наполовину.

Зміст або Table of Contents або TOC

Дві статті про те, як я написав компонент, який автоматично будує зміст ваший статей. Його роботу ви можете побачити майже у кожній моїй публікації.

У першій частині ми познайомимось ближче з проблемою, альтернативними рішеннями та на основі ідеї розробимо власний компонент. Також розповім як його використовувати.

Автоматичний зміст для вашого блогу - Ghost
🤟Зміст цієї публікації автоматично створено за допомогою описаного нижче рішення Вступ Додаючи все більше і більше публікацій у свій блог я почав відчувати на скільки мені не вистачає такої простої речі як зміст. Блог-платформа Ghost не має вбудуваного інструменту для цього. Але має дещо інше, що може нас легко виручити.

У другій частині ми його значно покращимо і спростимо використання. Друга версія компонента будує багаторівневий зміст.

Зміст v2 для блогу - Ghost
❗UPD 05/25/2024: Github Gist був оновлений і тепер він підтримує магаторівневу струтуру (h2...h6 теги) ❗UPD 08/15/2024: Виправлена помилка, яка падала в консоль: TypeError: Cannot read properties of null (reading ‘appendChild’) at TOC.onLoad Вступ Привіт. Використовуючи попередню версію я вирішив, що робити дублікат такого скрипта

Доречі, другу версію можна адаптувати не тільки для Ghost

Арсенал письменника

Як оптимізувати зображення
Iнструменти і принципи оптимізації зображень (convert to WebP, resize, compression)
Оптимізація швидкості сторінки - PageSpeed Insights
PageSpeed Insights для аналізу та оптимізації швидкості сторінок вашого блогу. Оптимізація зображень, Ghost блог та SEO

Інтеграції

Всі офіційні інтеграції можна знайти тут

Ghost integrations – official apps, plugins & tools
Ghost plugins, tools & apps to integrate with your Ghost site for automation, analytics, marketing, support and much more! 👉

Висновок

Ця підбірка була написата разом з розбудовою мого власного (саме цього) блогу. Кожен крок та покрашення були пройдені мною, а подекуди по декілька разів. Користуючись блогом і продовжуючи писати статті, я звертав увагу на скільки мені зручно, на загальний вигляд і на користувацькій досвід. На моєму особистому розумінні побудовані ті чи інші рішеня, вибір технологій та їх необхідність.

Я хочу, щоб кожен, хто бажає творити мав змогу легко, дешево та безпечно вести власний блог. Саме для цього я ділюсь своїм досвідом офрмленим у серію публікацій. Мрію надати інструмент, який безкоштовно запустить блог в один клік, але покищо маю лише цей шлях, який проходжу разом з вам.

Сподіваюсь ви знайшли тут багато цікавого і корисного для себе. Відштовхуючись від того на якому ви етапі я розбив всі статті на логічні групи.

😎
Якщо ви успішно запустили власний блог, то поділіться ним зі мною у будь якій із соціальних мереж, щоб я також порадів за вас. Мої контакти ви знайдете тут: https://lavr.site/about-me/

Бажаю всім мирного неба!

Read more