Blog Jekyll: Subskrypcja RSS i modyfikacja panelu bocznego oraz topbara
Konfiguracja RSS w Jekyll (Chirpy): własna strona /rss/, modyfikacja panelu bocznego i topbara.
RSS (Really Simple Syndication) to standardowy format XML umożliwiający śledzenie aktualizacji stron internetowych w czytnikach RSS. Nowe wpisy pojawiają się w nich automatycznie po publikacji.
Rozwiązanie to jest szczególnie przydatne w przypadku mniejszych, niezależnych stron internetowych, które nie korzystają z wbudowanych systemów subskrypcji (np. newslettera czy powiadomień e-mail).
RSS jest przydatny, żeby czytelnicy (i agregatory treści) wiedzieli, że na blogu pojawił się nowy wpis.
Konfiguracja RSS w Jekyll + Chirpy
Jekyll generuje kanał RSS automatycznie (za pomocą wtyczki jekyll-feed), a motyw Chirpy ma tę funkcjonalność włączoną domyślnie.
Kanał (feed) RSS bloga dostępny jest pod adresem:
👉 https://blog.marcinszewczyk.net/feed.xml
Po otwarciu widoczny jest kod pliku XML (to normalne). Kanał jest przeznaczony dla czytników RSS, a nie do bezpośredniego czytania w przeglądarce.
Jeśli blog jest publikowany przez GitHub Pages, nie jest wymagana dodatkowa konfiguracja (nie trzeba włączać wtyczki jekyll-feed w pliku _config.yml).
Każdy nowy wpis:
- pojawia się automatycznie w pliku
feed.xml - może zostać odczytany przez czytniki RSS
- umożliwia subskrypcję bloga bez newslettera
Dodanie ikonki „Subskrybuj RSS”
Dodatkowo można umieścić ikonkę „Subskrybuj RSS” w różnych miejscach interfejsu.
U mnie umieściłem ją:
- w panelu bocznym bloga (sidebar), przez dodanie kodu HTML do pliku
_includes/sidebar.html - w górnym pasku nawigacyjnym (topbar), przez dodanie kodu HTML do pliku
_includes/topbar.html
Pliki _includes/sidebar.html i _includes/topbar.html skopiowałem z gema standardową metodą.
Najpierw sprawdzenie ścieżki do gema:
1
bundle show jekyll-theme-chirpy
Następnie skopiowanie plików:
1
2
copy "E:\Ruby34-x64\lib\ruby\gems\3.4.0\gems\jekyll-theme-chirpy-7.4.1\_includes\sidebar.html" "_includes\sidebar.html"
copy "E:\Ruby34-x64\lib\ruby\gems\3.4.0\gems\jekyll-theme-chirpy-7.4.1\_includes\topbar.html" "_includes\topbar.html"
Od tego momentu lokalne wersje plików nadpisują wersje z gema i można je modyfikować.
Kod w panelu bocznym (_includes/sidebar.html)
Dodałem:
1
2
3
4
5
6
<a class="text-muted text-decoration-none"
href="/rss/"
aria-label="Subskrybuj RSS"
title="Subskrybuj RSS">RSS
<i class="fas fa-rss"></i>
</a>
Kod w topbarze (_includes/topbar.html)
Dodałem:
1
2
3
4
5
6
7
8
<span>
<a class="text-muted text-decoration-none"
href="/rss/"
aria-label="Subskrybuj RSS"
title="Subskrybuj RSS">
<i class="fas fa-rss"></i> Subskrybuj RSS
</a>
</span>
Przy czym ten ostatni fragment kodu wstawiłem w dwóch miejscach:
- po warunku:
1
{% if paths.size == 0 or page.layout == 'home' %}
- oraz po warunku:
1
{% if forloop.first %}
Strona „Subskrybuj RSS”
Linki, które wstawiłem do plików _includes/sidebar.html i _includes/topbar.html, nie wskazują na surowy feed (dostępny domyślnie pod adresem https://blog.marcinszewczyk.net/feed.xml), tylko na stronę _pages/rss.md.
Stronę tę stworzyłem umieszczając plik rss.md w katalogu _pages/.
Treść tej strony:
1
2
3
4
5
6
7
8
9
---
layout: page
title: Subskrybuj RSS
permalink: /rss/
---
Ten blog ma kanał **RSS (Atom)**, który możesz dodać do czytnika...
...
Efekt można zobaczyć tutaj:
👉 https://blog.marcinszewczyk.net/rss/
Poniżej przykład, jak wygląda kanał RSS tego bloga w aplikacji RSS na iPhone:
Rys. 2. Widok kanału RSS bloga w czytniku na iPhone.
Podsumowanie
Robię → działa → jest fajnie.