Hexo: Integracja z Google Analytics | Piotr Kowalski — JavaScript, Front-end oraz Node.js

Wielu z nas chciałoby wiedzieć, kto nas obserwuje w danym momencie na naszym blogu albo ile wyświetleń mają nasze artykuły, które napisaliśmy.

Z pomocą przychodzi narzędzie Google Analytics. Jest to internetowy program, który służy do analizy wyświetleń strony internetowej.

Opiszę jak dołączyć wcześniej wspomniane narzędzie do swojego bloga.

Krok 1. Wchodzimy na stronę `Google Analytics`

Wchodzimy na stronę https://analytics.google.com/analytics/

Przed naszymi oczami ukazuje się komponent:

Krok 2. Założenie nowego konta na `Google Analytics`

Potrzebujemy konta w tym serwisie, dlatego jeśli kliknąłeś w powyższy link (jeśli nie to zrób to teraz), to kliknij w pozycję Sign up. Jeśli to zrobiłeś to otrzymasz taki oto formularz:

w polu Account Name wpisujesz nazwę swojego konta
w Website Name (Nazwa witryny) wpisujesz nazwę swojej strony www
w Website URL (URL witryny) wpisujesz nazwę swojego bloga, dzięki temu mechanizm Google Analytics będzie wiedział, że będzie śledził dokładnie Twoją stronę.
w Industry Category (Kategoria branży) wybierz kategorię do której mógłby należeć Twój blog
w Reporting Time Zone (Strefa czasowa raportowania) wybierz odpowiednią dla siebie strefę czasową

Później klikamy w pozycję końcową - Get Tracking ID 🎉

Teraz naszym oczom ukażą się pola służące do akceptacji wszelkich warunków i regulaminu Google Analytics. Pamiętaj, żeby je przeczytać!

Na końcu otrzymamy unikalne ID, które będziemy potrzebować, będzie ono wyglądać w stylu UA-XXXXXXX-X.

Krok 3. Osadzenie unikalnego ID w konfiguracji

Będąc w głównym katalogu naszego bloga, otwieramy plik o nazwie _config.yml i dopisujemy do niego unikalne ID.

google_analytics: UA-XXXXXXX-X

Krok 4. Sprawdzamy, czy `Google Analytics` zostało dobrze dodane

Po zbudowaniu aplikacji (hexo server) albo jej opublikowaniu i uruchomieniu w przeglądarce, w sekcji <head> (w kodzie strony) będzie widoczny nowy skrypt:

<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXX-X', 'auto');
ga('send', 'pageview');
</script>

Feedback

Drogi czytelniku / blogerze napisz w komentarzu pod tym wpisem (kończącym serię jak w 4 prostych krokach stworzyć w pełni bloga z wykorzystaniem hexo), czy poradziłeś sobie z konfiguracją Google Analytics czy może jednak napotkałeś na problemy.

Chciałbym, aby mój blog nie był tylko źródłem do czytania wpisów, ale też miejscem gdzie czytelnicy mogliby wypowiedzieć się w temacie który poruszam.

Polecane źródła

•

PS. Dziękuję @ctworzewski za pomoc w napisaniu tego artykułu.

Krok 1. Wchodzimy na stronę Google Analytics

Krok 2. Założenie nowego konta na Google Analytics