Повний посібник з блогу 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
Дізнайтеся, як безпечно оновити блог на платформі Ghost до новішої версії. У статті описано процес підготовки, бекап, перевірку версій, оновлення npm та Ghost CLI, а також додаткову перевірку після оновлення для впевненості, що все працює належним чином.

Допоміжні

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

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

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

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

SEO і не тільки - найперші кроки - Ghost
Вступ Описані нижче кроки стосуються практично кожного публічного сайту. І чим швидше це зроблено, тим краще. Як тільки ваш сайт, а в даному прикладі мій блог запущений на движку Ghost, запрацював і доступен в мережі інернет, то вам необхідно зробити його видимим у пошуку, включити аналітику, щоб відслідковувавати хто, як
Як додати ads.txt до блогу на платформі Ghost
Додаєте ads.txt до блогу на Ghost? Дізнайтесь, як створити файл, опублікувати його на GitHub, налаштувати перенаправлення через redirects.yaml та перевірити коректність роботи. Це простий спосіб забезпечити відповідність стандартам реклами для вашого блогу.

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

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

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

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

Теги

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

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

Для тих, хто хоче додати спеціальну сторінку з усіма тегами/категоріями, тут є гарна стаття від Shounak Pal

Tags / Category Page to show all tags at once in Ghost Blog
Create a catagory page to display all your tags in on a single page. It definitely works with Source theme, also probably works with Casper too.

Вставки коду

Тут розповім як підключити 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

How to add ads.txt file in self-hosted Ghost blog

Як додати ads.txt до блогу на платформі Ghost

Додаєте ads.txt до блогу на Ghost? Дізнайтесь, як створити файл, опублікувати його на GitHub, налаштувати перенаправлення через redirects.yaml та перевірити коректність роботи. Це простий спосіб забезпечити відповідність стандартам реклами для вашого блогу.

By Volodymyr Lavrynovych