Jak stworzyć jedną stronę internetową z dowolnym motywem WordPress?

Otrzymujemy wiele pytań dotyczących tego, jak stworzyć witrynę typu one page lub czy sprzedajemy jednostronicowe motywy WordPress. Pozwolę sobie odpowiedzieć na oba te pytania już na początku. Każdy motyw WordPress może być witryną typu one page, a ja pokażę Ci, jakie to proste.

Co to jest witryna typu One Page?

Witryna jednostronicowa to nic innego jak witryna internetowa z całą istotną treścią na jednej stronie, zwykle stronie głównej.

Najczęściej korzystają z niego firmy, które chcą w jasny i bezpośredni sposób promować pojedynczy produkt lub usługę . Niektóre przykłady to prezentacja portfolio swoim klientom, organizacja wydarzenia lub rozpoczęcie nowej działalności.

W witrynie jednostronicowej kliknięcie linku nawigacyjnego nie przeniesie Cię do nowej strony, ale spowoduje przeskok lub przewinięcie w dół na tej samej stronie do sekcji treści połączonej z linkiem. Może to znacznie poprawić wrażenia użytkownika i zwiększyć zaangażowanie użytkowników.

Istnieje wiele jednostronicowych motywów WordPress dostępnych online, ale jak już powiedziałem, możemy zmienić dowolny motyw w jeden pager przy odrobinie pracy.

Jak stworzyć jedną stronę internetową za pomocą WordPressa?

Linki do kotwic

W przypadku podstawowej witryny typu one page wystarczy menu , treść i linki kotwiczące . Wierzę, że wszyscy wiecie, co robi menu i zawartość, więc porozmawiajmy trochę o linkach kotwicznych. Linki kotwiczne są tworzone ze zwykłego linku, który wskazuje na kotwicę i samą kotwicę. Linki wskazujące na kotwicę to normalne linki, które zaczynają się od znaku # . A sama kotwica to określone miejsce na twojej stronie. Spójrzmy na prosty przykład.

To jest nasz link w menu, który wskazuje kotwicę:

 <a href="#middle">Go to the middle</a>

A oto nasza treść z samą kotwicą:

 <h1>Learning about anchor links</h1> <p> Some lorem ipsum content ….</p> <h2>Middle of the page</h2> <p> Some lorem ipsum content ….</p>

W tym przypadku #middle to nasz link do kotwicy, a id=”middle” to nasza kotwica. Po kliknięciu linku „Przejdź na środek” przeskoczymy do naszej kotwicy z tytułem „Środek strony”. Otóż ​​to! W ten sposób możemy stworzyć najbardziej podstawową witrynę typu one page. Możesz dodać dowolną liczbę kotwic na swojej stronie internetowej. Weźmy naszą nowo nabytą wiedzę i wykorzystajmy ją w witrynie WordPress.

Twórz linki do kotwic za pomocą menu WordPress

Właśnie w tym celu stworzyłem już prostą jednostronicową witrynę internetową z naszym motywem GrowthPress, która będzie naszym praktycznym przykładem. Najpierw stworzyłem nową stronę i dodałem trochę treści. Treść składa się tylko z kilku akapitów i tytułów. Kotwice możemy dodać na prawie każdym elemencie HTML, ale w naszym przypadku dodamy go do wszystkich tytułów w treści.

Na zrzucie ekranu widać, że aby edytować HTML treści, będziemy musieli zmienić edytor z Visual na Text. Teraz możemy zobaczyć wszystkie tagi HTML w naszej treści. W naszym przypadku wszystkie tytuły używają tagu <h2> i użyjemy ich do dodawania kotwic. Tak jak na powyższym zrzucie ekranu, będziesz musiał dodać id z kotwicą na tych tagach. Na przykład: <h2 id=”our-anchor”>Some Title</h2> . Zauważ, że kotwice są pisane bez # , ale wszystkie linki do kotwic muszą zaczynać się od # . Po dodaniu wszystkich kotwic w naszej treści możemy połączyć je za pomocą linków do kotwic.

Jeśli znasz WordPressa, będziesz wiedział, że możemy zmienić linki menu w wp-admin -> Wygląd -> Menu i właśnie tam tworzymy nasze linki kotwiczne.

Na zrzucie ekranu widać, że wybrałem Custom Links i zamiast klasycznego adresu URL dodałem kotwicę #about-us . Kliknięcie tego linku spowoduje teraz przejście do naszego id=”about-us” w treści. Po dodaniu wszystkich linków kotwicznych nasza prosta strona internetowa jest gotowa. Kliknij w nowo utworzone linki i przekonaj się sam!

Płynne przewijanie

Tak, całkowicie się zgadzam, strona internetowa, którą do tej pory zrobiliśmy, jest świetna, ale te natychmiastowe skoki nie są tak niesamowite, jak płynne przewijanie, prawda? Aby uzyskać płynne przewijanie, będziemy musieli dodać trochę kodu javascript do naszej strony internetowej.

Większość motywów premium ma jakieś pole do dodawania niestandardowego kodu. Na przykład w naszych motywach możesz przejść do wp-admin -> Customizer -> Theme Options -> Custom Code, gdzie znajdziesz pola, których możesz użyć do dodania niestandardowego kodu, tak jak zrobimy to teraz.

Jeśli w Twoim motywie nie ma miejsca na niestandardowy kod, możesz użyć odpowiedniej wtyczki. Polecam wtyczkę Insert Headers and Footers firmy WPBeginner. Po aktywacji wtyczki znajdziesz pola do dodania niestandardowego kodu w wp-admin -> Ustawienia -> Wstaw nagłówki i stopki.

Wklej poniższy kod w jednym z pól (zalecamy użycie skryptów w ustawieniach stopki) i teraz masz płynne przewijanie linków kotwicznych. Gratulacje! Właśnie stworzyłeś jednostronicową witrynę internetową z dowolnym motywem WordPress!

 <script> ( function( $ ) { $(document).on('click', 'a[href*="#"]:not([href="#"])', function(e) { if (location.pathname.replace(/^\//,'') === this.pathname.replace(/^\//,'') && location.hostname === this.hostname) { var hashStr = this.hash.slice(1); var target = $(this.hash); target = target.length ? target : $('[name=' + hashStr +']'); if (target.length) { $('html, body').animate({ scrollTop: target.offset().top }, 1000); window.location.hash = hashStr; return false; e.preventDefault(); } } }); }(jQuery)); </script>

Powyższy kod będzie animował efekt przewijania po kliknięciu linku kotwicy, a także zaktualizuje bieżący adres URL przeglądarki, aby odzwierciedlić kliknięty link kotwicy. Sprawdź nasz efekt końcowy na gotowej witrynie typu one page.

Jak ustawić przesunięcie dla płynnego przewijania?

Jeśli masz naprawione przyklejone menu, polecam również ustawić przesunięcie, aby początek treści zaczynał się poniżej przyklejonego menu. Aby to osiągnąć, będziesz musiał edytować ten wiersz kodu:

 $('html, body').animate({ scrollTop: target.offset().top}, 1000);

Jedyne, co musimy tutaj zrobić, to dodać wartość naszego przesunięcia. Powinien być co najmniej tak duży, jak wysokość ustalonego przyklejonego menu.

 $('html, body').animate({ scrollTop: target.offset().top - 180 }, 1000);

Dzięki temu unikniemy problemu, w którym początek treści chowa się za menu.

Zalety witryn typu One Page

Teraz, gdy wiesz, jak utworzyć witrynę jednostronicową, przyjrzyjmy się zaletom korzystania z witryny jednostronicowej.

Witryny jednostronicowe zapewniają lepsze wrażenia użytkownika mobilnego

Witryny jednostronicowe składają się z jednej, długo przewijanej strony, która idealnie nadaje się do przeglądania na urządzeniach mobilnych. Pomyśl o Facebooku i jego kanale informacyjnym. Nie możesz się powstrzymać od ciągłego przewijania w dół króliczej nory. Witryna typu one page została zaprojektowana właśnie do tego celu, a ciągłe przewijanie idealnie nadaje się do urządzeń mobilnych.

Biorąc pod uwagę ograniczoną ilość miejsca na ekranie na urządzeniach mobilnych, o wiele łatwiej jest przewijać w dół, niż dowiedzieć się, gdzie ukrywa się menu, a następnie kliknąć odpowiedni link, aby przejść do następnej strony witryny. Innymi słowy, jednostronicowa witryna internetowa zapewni doskonałe wrażenia użytkownika każdemu, kto odwiedza Twoją witrynę na swoim urządzeniu mobilnym.

Witryny jednostronicowe wymagają mniej tekstu

Tradycyjna, wielostronicowa strona internetowa wymaga dużej ilości tekstu, aby nie wyglądała na zbyt pustą lub, co gorsza, niedokończoną. Porównaj to z witrynami jednostronicowymi, które będą wyglądać na zagracone i przytłaczające, jeśli masz zbyt dużo treści. W związku z tym warto ograniczyć liczbę kopii do minimum i używać krótkich zdań i akapitów, aby przekazać najważniejsze informacje.

Kolejną zaletą tego podejścia jest fakt, że pisanie kopii może być jednym z trudniejszych zadań związanych z uruchomieniem strony internetowej. Witryna jednostronicowa może być doskonałym wyborem, jeśli nie masz w pełni rozwiniętej kopii witryny.

Witryny jednostronicowe działają dobrze z obrazami

Obrazy mogą zdziałać cuda dla każdego rodzaju witryny, w tym witryn typu one page. W rzeczywistości, gdy używasz obrazów w połączeniu z efektem paralaksy, możesz uzyskać atrakcyjny wizualnie efekt na swojej stronie internetowej.

Nawet jeśli zdecydujesz się nie używać efektu paralaksy, nadal możesz efektywnie wykorzystywać obrazy na jednostronicowej witrynie internetowej. Możesz ich używać do rozróżniania różnych sekcji, nie wspominając o udostępnianiu galerii zdjęć lub zdjęć z portfolio.

Możesz również skorzystać z obrazów, aby poprawić SEO witryny, ponieważ obrazy pojawiają się w wynikach wyszukiwania po prawidłowej optymalizacji. W związku z tym dodaj nazwy obrazów za pomocą opisowych tytułów i dodaj tagi alt do każdego obrazu, który dodajesz do swojej witryny.

Witryny jednostronicowe mogą zwiększyć zaangażowanie użytkowników i konwersje

Według jednego z badań witryna jednostronicowa może prowadzić do wyższych konwersji w porównaniu z jej wielostronicowym odpowiednikiem. Powód tego jest prosty: witryna jednostronicowa jest zwykle bardzo skoncentrowana i zaprojektowana tak, aby skłonić odwiedzających do podjęcia działania.

Ma bardziej skoncentrowany przekaz i łatwiej jest zrozumieć odwiedzającym, co chcesz, aby zrobili, gdy dotrą do końca strony.

Gdy masz tylko jeden wybór, łatwo jest kliknąć ten przycisk lub wezwanie do działania, zamiast przechodzić od strony do strony zastanawiając się, co należy zrobić dalej.

Witryny jednostronicowe są łatwiejsze w nawigacji

Warto również wspomnieć, że strony typu one page są łatwiejsze w nawigacji. Ponieważ wszystko jest na jednej stronie, bardzo trudno się zgubić i wrócić do początku, zwłaszcza na urządzeniach mobilnych.

Chociaż możesz użyć linków zakotwiczonych, aby przeskoczyć do różnych sekcji strony (jak pokazano w tym artykule), równie łatwe jest przewijanie w górę lub w dół i znalezienie odpowiedniej sekcji.

Ponadto dobrze zaprojektowana witryna typu one page prowadzi użytkownika w podróż, która w logiczny sposób opowiada historię Twojej firmy lub marki.

Witryny jednostronicowe ułatwiają dotarcie do określonej grupy odbiorców

Jak wspomniano wcześniej, witryny jednostronicowe mają na celu zachęcenie odwiedzających do podjęcia działań. Możesz to wykorzystać na swoją korzyść i dotrzeć do bardzo konkretnej grupy odbiorców, która jest gotowa na kolejny krok. Prowadząc ich przez różne sekcje swojej witryny, możesz zaprezentować swój produkt lub usługę, pokazać im, jak rozwiązuje ich problem, i zaoferować rozwiązanie w formie wezwania do działania.

To podejście sprawdza się świetnie, gdy kierujesz reklamy na bardzo konkretne słowo kluczowe lub odbiorców, którzy już wiedzą, że mają określony problem i szukają rozwiązania.

Wady korzystania z jednostronicowej witryny internetowej

Pomijając profesjonalistów, przyjrzyjmy się niektórym wadom korzystania z witryny typu one page.

Analiza danych Google Analytics będzie trudniejsza

Do tej pory prawdopodobnie wiesz, że Google Analytics może dostarczyć Ci mnóstwo przydatnych informacji o odwiedzających Twoją witrynę. Po zainstalowaniu w witrynie możesz zobaczyć, które strony są popularne, które posty przyciągają nowych użytkowników i które strony wymagają optymalizacji, aby użytkownicy dłużej pozostawali w Twojej witrynie.

W przypadku jednostronicowej witryny internetowej jesteś ograniczony do jednej strony. Twoi użytkownicy lądują na tej samej stronie i wypadają na tę samą stronę, co utrudnia określenie, które części Twojej witryny wymagają ulepszenia. Jeśli zdecydujesz się na jednostronicową trasę witryny, zarejestruj się w narzędziu takim jak Hotjar, aby uzyskać wizualną mapę popularności tego, jak ludzie korzystają z Twojej witryny.

Udostępnianie witryny w mediach społecznościowych jest trudniejsze

Dzięki jednostronicowej witrynie internetowej masz tylko jeden adres URL do udostępnienia w mediach społecznościowych. Może to szybko się powtarzać, nie wspominając o tym, że nie zapewnia wielu możliwości wysyłania ludzi do różnych części witryny w celu znalezienia odpowiedzi na ich problem. Po udostępnieniu głównego adresu URL udostępniana jest cała witryna, a nie konkretna strona lub sekcja, tak jak w przypadku witryny wielostronicowej.

Łatwym obejściem byłoby umieszczenie bloga w witrynie, w którym można udostępniać przydatne i pomocne treści, które przyciągną uwagę odbiorców. Ułatwia to udostępnianie witryny w mediach społecznościowych, jednocześnie zachowując większość informacji skondensowanych na jednej stronie .

Witryna jednostronicowa może potrwać dłużej

W zależności od rozmiaru Twojej jednostronicowej witryny i rodzaju udostępnianej treści, pamiętaj, że ładowanie witryny może potrwać dłużej.

Ogólnie rzecz biorąc, witryny typu one page są dość lekkie, jednak jeśli masz dużo obrazów, które nie są zoptymalizowane pod kątem sieci, czas ładowania będzie wolniejszy. To samo dotyczy sytuacji, gdy w witrynie jest dużo materiałów wideo.

W związku z tym ważne jest, aby zapisać obrazy w odpowiednim formacie, a także skompresować ich rozmiar przed dodaniem ich do witryny. Inną rzeczą do rozważenia jest użycie leniwego ładowania obrazów i filmów, aby były ładowane, gdy użytkownik przewinie do tej konkretnej sekcji witryny, zamiast wczytywać je od razu.

Masz ograniczone możliwości kierowania na słowa kluczowe

Witryna jednostronicowa nie zapewni wielu możliwości kierowania na wiele słów kluczowych. W przypadku witryny wielostronicowej możesz mieć osobną stronę dla każdego słowa kluczowego, na które chcesz kierować reklamy. Witryna jednostronicowa nie działa w ten sam sposób.

Witryny typu one page, jak wspomniano w sekcji profesjonalistów, są zaprojektowane z myślą o konkretnym celu i odbiorcach. Zwykle przekłada się to na kierowanie na określone słowo kluczowe i jego odmiany, co oznacza, że ​​lepiej jest utworzyć wielostronicową witrynę, jeśli chcesz kierować reklamy na wiele różnych słów kluczowych.

Chociaż nie ma reguły, która mówi, że nie można umieścić więcej niż jednego odrębnego słowa kluczowego na stronie, nie będziesz w stanie odpowiednio zoptymalizować swojej strony, zwłaszcza jeśli weźmiesz pod uwagę, że lekki tekst działa lepiej w przypadku witryn jednostronicowych.

Nie możesz używać zaawansowanych taktyk SEO

Mówiąc o SEO, witryna typu one page nie pozwala na stosowanie zaawansowanych taktyk SEO, znanych jako siloing. Siloing odnosi się do praktyki podziału witryny na główne obszary zainteresowań, dzięki czemu możesz wykazać się autorytetem w tych obszarach. Mówiąc laikiem, jest to praktyka tworzenia kategorii i podkategorii w celu uporządkowania treści.

Główną zaletą silosowania jest to, że otwiera możliwości rankingu dla wielu słów kluczowych i fraz kluczowych, które obejmują prawie wszystkie pytania, które może mieć zainteresowany odwiedzający, a także obejmują wszystkie możliwe zastrzeżenia.

Podczas gdy witryny wielostronicowe przodują w tym, witryny jednostronicowe szybko stałyby się zbyt przytłaczające i zaśmiecone, powodując frustrację odbiorców.

Strony jednostronicowe mogą nie podawać szczegółów

Wreszcie, ze względu na krótkie i zwięzłe kopie i wiadomości, witryny jednostronicowe mogą nie zapewniać odwiedzającym wszystkich niezbędnych informacji. Może to następnie prowadzić do zwiększonej liczby wiadomości e-mail z prośbą o wyjaśnienia lub zdezorientowania odwiedzających.

Możesz rozwiązać ten problem, dodając blog do swojej witryny typu one page i dostarczając odwiedzającym bardziej dogłębne treści i odpowiadając na pytania w miarę ich pojawiania się.

Czy powinieneś korzystać z jednostronicowej witryny internetowej?

Jak widać, korzystanie z jednostronicowej witryny internetowej ma z pewnością zalety i wady. Skąd więc wiesz, czy jednostronicowa witryna internetowa jest właściwym wyborem dla Twojej firmy?

Jeśli dopiero zaczynasz swoją działalność i generujesz dużo biznesu za pośrednictwem poczty pantoflowej, jednostronicowa witryna internetowa umożliwia umieszczenie firmy w Internecie bez poświęcania zbyt wiele czasu na projektowanie i rozwój.

Z drugiej strony, jeśli chcesz skupić się na pozyskiwaniu większego ruchu organicznego, skupiając się na SEO i jeśli rozszerzasz działalność biznesową, to wielostronicowa witryna internetowa będzie dla Ciebie bardziej odpowiednia.

W końcu jest to kwestia osobistych preferencji i celów biznesowych. Oceń, gdzie jesteś w swojej firmie i zwróć uwagę na to, co próbujesz osiągnąć. Następnie rozważ wady i zalety wymienione powyżej przed podjęciem ostatecznej decyzji.

Wniosek

Naprawdę dostajemy wiele pytań, pytając, czy mamy jakieś jednostronicowe motywy i uważam, że sytuacja jest taka sama w przypadku innych autorów motywów. W tym artykule powinno być jasne, że wszystkie motywy WordPress mogą być również używane jako witryny jednostronicowe, a jeśli chcesz, możesz w mgnieniu oka zmienić swoją obecną witrynę na jeden pager. Omówiliśmy również zalety i wady witryn jednostronicowych i podzieliliśmy się, jak zdecydować, czy jest to właściwy wybór dla Twojej witryny.

Daj mi znać, czy artykuł pomógł Ci lepiej zrozumieć strony typu one page i zostaw komentarz , jeśli masz dodatkowe pytania .