JAK

Jak do domu

Menu

Pasek ikon Ikona menu Akordeon Karty Pionowe zakładki Nagłówki kart Zakładki na całej stronie Po najechaniu na zakładki Górna nawigacja Responsywne Topnav Pasek nawigacyjny z ikonami Menu wyszukiwania Pasek wyszukiwania Naprawiono pasek boczny Nawigacja strony Responsywny pasek boczny Nawigacja na pełnym ekranie Menu poza płótnem Wskaż przyciski nawigacji bocznej Pasek boczny z ikonami Menu przewijania w poziomie Menu pionowe Nawigacja u dołu Responsywna dolna nawigacja Dolne łącza nawigacyjne Wyrównane do prawej strony menu Wyśrodkowane łącze menu Łącza menu o równej szerokości Naprawiono menu Przesuń w dół pasek na przewijaniu Ukryj pasek nawigacyjny na przewijaniu Zmniejsz pasek nawigacyjny na przewijaniu Przyklejony pasek nawigacyjny Pasek nawigacyjny na obrazie Rozwijane menu Kliknij menu rozwijane Kaskadowe menu rozwijane Rozwijane w Topnav Rozwijane w Sidenav Menu rozwijane paska nawigacyjnego Resp Menu podrzędne Dropup Mega Menu Menu mobilne Kurtyna menu Zwinięty pasek boczny Zwinięty panel boczny Paginacja Bułka tarta Grupa przycisków Pionowa grupa przycisków Przyklejony pasek społecznościowy Nawigacja po pigułkach Responsywny nagłówek

Obrazy

Pokaz slajdów Galeria pokazu slajdów Obrazy modalne Lightbox Responsywna siatka obrazu Siatka obrazu Galeria zakładek Zanikanie nakładki obrazu Slajd nakładki obrazu Powiększenie nakładki obrazu Tytuł nakładki obrazu Ikona nakładki obrazu Efekty obrazu Obraz czarno-biały Tekst obrazu Bloki tekstu obrazu Przezroczysty tekst obrazu Obraz całej strony Formularz na obrazie Obraz bohatera Rozmycie obrazu tła Zmień Bg przy przewijaniu Obrazy obok siebie Zaokrąglone obrazy Obrazy awatara Responsywne obrazy Wyśrodkuj obrazy Miniatury Obramowanie wokół obrazu Poznaj drużynę Przyklejony obraz Odwróć obraz Potrząśnij obrazem Galeria Portfolio Portfolio z filtrowaniem Powiększenie obrazu Szkło powiększające obraz Suwak porównania obrazów Favicon

guziki

Przyciski alertów Przyciski konspektu Przyciski dzielone Przyciski animowane Zanikające przyciski Przycisk na obrazie Przyciski mediów społecznościowych Czytaj więcej Czytaj mniej Przyciski ładowania Pobierz przyciski Przyciski pigułek Przycisk powiadomień Przyciski ikon Przyciski następny/poprzedni Przycisk Więcej w Nav Blokuj przyciski Przyciski tekstowe Okrągłe przyciski Przycisk przewijania do góry

Formularze

Forma loginu Formularz rejestracyjny Formularz kasy Formularz kontaktowy Formularz logowania społecznościowego Formularz rejestracyjny Formularz z ikonami Biuletyn Informacyjny Formularz ułożony Formularz responsywny Wyskakujący formularz Formularz wbudowany Wyczyść pole wejściowe Ukryj strzałki liczbowe Skopiuj tekst do schowka Animowane wyszukiwanie Przycisk wyszukiwania Wyszukiwanie na pełnym ekranie Pole wejściowe na pasku nawigacyjnym Formularz logowania w pasku nawigacyjnym Niestandardowe pole wyboru/radio Wybierz niestandardowy Przełącznik Zaznacz pole wyboru Wykryj Caps Lock Przycisk wyzwalania po wejściu Weryfikacja hasła Przełącz widoczność hasła Formularz wieloetapowy autouzupełnienie Wyłącz autouzupełnianie Wyłącz sprawdzanie pisowni Przycisk przesyłania plików Puste sprawdzanie poprawności danych wejściowych

Filtry

Lista filtrów Filtruj tabelę Filtruj elementy Menu filtrów Sortuj listę Tabela zaklęć

Stoły

Stół w paski zebry Stoły środkowe Tabela o pełnej szerokości Stoły obok siebie Responsywne tabele Tabela porównawcza

Jeszcze

Wideo na pełnym ekranie Pudełka modalne Usuń modalne Oś czasu Wskaźnik przewijania Paski postępu Pasek umiejętności Suwaki zakresu Podpowiedzi Wyświetl element Hover Wyskakujące okienka Składany Kalendarz HTML zawiera Lista rzeczy do zrobienia Ładowarki Ocena w skali gwiazdkowej Ocena użytkownika Efekt nakładki Kontakt chipy Karty Odwróć kartę Karta profilu Karta produktu Alerty Zawołać Uwagi Etykiety Kręgi Styl HR Kupon Grupa listy Lista bez punktorów Responsywny tekst Tekst wycięcia Świecący tekst Naprawiono stopkę Przyklejony element Równa wysokość Clearfix Responsywne pływaki Batonik Okno pełnoekranowe Przewiń rysunek Płynne przewijanie Gradient Bg Scroll Przyklejony nagłówek Zmniejsz nagłówek na przewijaniu Tabela cen Paralaksa Współczynnik proporcji Responsywne ramki iframe Przełącz Lubię/Nie lubię Przełącz Ukryj/Pokaż Przełącz tryb ciemny Przełącz tekst Przełącz klasę Dodaj klasę Usuń klasę Aktywna klasa Widok drzewa Usuń właściwość Wykrywanie offline Znajdź ukryty element Przekieruj stronę internetową Powiększ najechanie Odwróć pudełko Wyśrodkuj w pionie Środkowy przycisk w DIV Przejście na Hover Strzałki Kształty Link do pobrania Element o pełnej wysokości Okno przeglądarki Niestandardowy pasek przewijania Ukryj pasek przewijania Pokaż/Wymuś pasek przewijania Wygląd urządzenia Ramka do edycji treści Kolor zastępczy Kolor zaznaczenia tekstu Kolor pocisku Pionowa linia Dzielniki Animuj ikony Odliczanie czasu Maszyna do pisania Już wkrótce Strona Wiadomości na czacie Wyskakujące okno czatu Podzielony ekran Referencje Licznik sekcji Pokaz slajdów z cytatami Zamykane pozycje listy Typowe punkty przerwania urządzenia Przeciągany element HTML Zapytania o media JS Podświetlanie składni Animacje JS Długość łańcucha JS Potęgowanie JS Parametry domyślne JS Uzyskaj aktualny adres URL Uzyskaj aktualny rozmiar ekranu Pobierz elementy iframe

Stronie internetowej

Utwórz darmową stronę internetową Stwórz stronę internetową Stwórz statyczną stronę internetową Stwórz stronę internetową (W3.CSS) Stwórz stronę internetową (BS3) Stwórz stronę internetową (BS4) Stwórz stronę internetową (BS5) Utwórz i przeglądaj stronę internetową Utwórz witrynę z drzewem linków Utwórz portfel Utwórz CV Stwórz stronę internetową restauracji Stwórz stronę biznesową Stwórz książkę internetową Strona internetowa centrum Sekcja kontaktowa O stronie Duży nagłówek Przykładowa strona internetowa

Krata

Układ 2 kolumn Układ 3 kolumn Układ 4 kolumn Rozszerzanie siatki Widok siatki listy Mieszany układ kolumn Karty kolumn Układ Zig Zag Układ bloga

Google

Wykresy Google Czcionki Google Parowanie czcionek Google Konfiguracja Google Analytics

Konwertery

Przelicz wagę Konwertuj temperaturę Konwertuj długość Konwertuj prędkość

Blog

Uzyskaj pracę programisty Zostań deweloperem front-endu.

Jak skonfigurować Google Analytics

Google Analytics służy do przeglądania i rozumienia ruchu w sieci.

Jest darmowy i łatwy w użyciu.

Możesz go dostosować do wielu przypadków użycia.

Działa po wyjęciu z pudełka.

Jest szybki w konfiguracji. Zdobądź swoje spostrzeżenia już dziś!

Stwórz moją darmową stronę ❯

Pomiń czytanie o Google Analytics. Zabierz mnie bezpośrednio do pierwszego kroku. Przejdź do pierwszego kroku

Co to jest Google Analytics

Google Analytics to rozwiązanie do analityki internetowej.

Jest rozwijany i wspierany przez Google.

Najnowsza wersja nazywa się Google Analytics 4.

Może być używany do przeglądania danych, takich jak odbiorcy, odsłony stron, sesje, dane demograficzne i wydarzenia.

Dlaczego włączyć Google Analytics

Zrozum swój ruch w sieci, aby podejmować lepsze decyzje.

Zrozum i ulepsz lejek sprzedaży.

Ucz się eksperymentując (na przykład testy a/b).

Google ma inne rozwiązanie o nazwie Google Optimize. To rozwiązanie jest przeznaczone do testów.


Dla kogo jest Google Analytics

Google Analytics jest przydatny dla każdego, kto ma witrynę internetową.

Dostarcza informacji o tym, kto korzysta z Twojej witryny i jak wchodzi z nią w interakcję.

Ponadto interfejs jest łatwy do zrozumienia.

Nie potrzebujesz wiedzy analitycznej, aby korzystać z usługi i poruszać się po niej.


Jak skonfigurować Google Analytics krok po kroku

Google Analytics można skonfigurować na dwa sposoby : Globalny tag witryny (gtag.js) lub Menedżer tagów Google .

Najprostszym sposobem jest użycie tagu globalnej witryny.

W tym samouczku zostanie zastosowane podejście The Global Website Tag.


Przygotowania

Zdecyduj, którego edytora kodu użyć i skonfiguruj swoje środowisko.

W3Schools stworzył łatwy w użyciu edytor kodu o nazwie W3Schools Spaces . Zarejestruj się i rozpocznij za pomocą kilku kliknięć.

Zacznij za darmo ❯

Utwórz plik index.html , aby móc wprowadzić kod.

Cała konfiguracja. Chodźmy!


Skonfiguruj Google Analytics: globalny tag witryny


Krok 1: Utwórz konto Google Analytics

Przejdź do Analytics: utwórz konto lub zaloguj się do Analytics

Link w powyższym akapicie prowadzi do strony docelowej Google Analytics.

Kliknij przycisk „Rozpocznij za darmo”.

wstęp

Krok 2: Wejdź na stronę powitalną

Po utworzeniu konta lub zalogowaniu się zapraszamy do rozwiązania.

Naciśnij przycisk „Rozpocznij pomiar”, aby kontynuować.

Strona powitalna

Krok 3: Konfiguracja konta

Masz tu do podjęcia dwie decyzje.

  1. Wpisz nazwę swojego konta.
  2. Zdecyduj, jakie dane chcesz udostępnić.
  3. Kliknij przycisk „Dalej”.

Jedno konto może mieć więcej niż jeden identyfikator śledzenia. Za pomocą konta możesz śledzić więcej niż jedną witrynę.

Przegląd konfiguracji konta

Krok 4: Konfiguracja nieruchomości

Właściwość to usługa, którą mierzysz, na przykład witryna internetowa, aplikacja, drzewo linków itp.

  1. Wpisz nazwę usługi.
  2. Wpisz swoją strefę czasową.
  3. Wprowadź walutę, której używasz.
  4. Kliknij przycisk „Dalej”.
Przegląd konfiguracji nieruchomości

Krok 5: Dodaj informacje o firmie

Analytics wykorzystuje te informacje, aby dostosować Twoje wrażenia.

  1. Wybierz kategorię swojej branży.
  2. Wybierz rozmiar firmy.
  3. Tick the boxes for how you are planning to use Analytics.
  4. Click the "Create" button to proceed.
Szczegóły informacji biznesowych

Step 6: Terms of Service Agreement

Read and understand the terms of service.

Tick the GDPR box and click the "I accept" button if you agree.

Przegląd warunków

Step 7: Email subscriptions

  1. Tick or uncheck all boxes.
  2. Click the "Save" button to continue.
Przegląd komunikacji e-mail

Step 8: Select platform

Chose the platform where you are collecting data.

Then, click the relevant platform to continue.

We are continuing with "Web" as the example in this tutorial.

Wybierz przegląd platformy

Step 9: Data stream setup

Enter data stream details.

  1. The URL to your site.
  2. The name that you want to give the stream.
  3. Decide if you are to enable enhanced measurement or not.
  4. Click on the "Create stream" button to continue.
  5. The enhanced measurement can give the data more context. Improving your understanding of the traffic.

    Omówienie konfiguracji strumienia danych

    Step 10: Web stream overview

    Here you can see a detailed overview of the web stream.

    Omówienie szczegółów transmisji internetowej

    Here are the key takeaways from the overview.

    1. Stream URL.

    The Stream URL is the link to the connected site.

    URL strumienia

    2. Measurement ID

    The Measurement ID is the identifier for your data stream.

    It has a format of G-XXXXXXX.

    identyfikator pomiaru

    Google Analytics 4 uses Measurement ID. Older versions use Tracking ID. You can not have both.

    3. Tagging instructions

    Decide to use Global site tag (gtag.js) or Tag manager.

    This tutorial will use the Global site tag.

    Installing the Global site tag is the easiest and quickest way of getting it up and running.

    instrukcje tagowania

    Step 11: Global site tag (gtag.js)

    Click the "Global site tag (gtag.js)" row.

    Globalny tag witryny

    Here you can see a code snippet.

    The code snippet is a script to allow Google to measure data on your site.

    You can see the Measurement ID in the second last line in the code snippet.

    The code snippet

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-DNJN1PF3CS"></script>
    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'G-XXXXXXX');
    </script>

    Step 12: Enter the code snippet

    Copy the code snippet.

    Make sure to include your Measurement ID.

    Locate the <head> tag in your HTML.

    Paste the code snippet just below the <head> tag.

    Save and publish the code.

    Dodaj fragment kodu

    We used W3Schools Spaces in this example.


    Step 13: Test that it works

    Ensure that you have successfully saved and published the code snippet with the correct Measurement ID.

    Open the URL for the site you have connected to the data stream.

    Click on "Real time" on the menu to the left.

    Confirm that you see yourself as an active user.

    Congrats. You have successfully enabled Google Analytics for your site!

    Analytics dashboard

    Explore Google Analytics

    Recommended related topics are Tag manager and Events

    Spend time in the service to learn about your user activity, commerce, demographics, device, and referrals.


    Tip: Ever heard of W3Schools Spaces? It is a personal space where you can make a website from scratch or use a template and host it for free.

    It has everything you need in the browser.

    Get started in a few clicks.

    Start now for free ❯

    * no credit card required