Dodanie przycisków wezwania do działania do twoich wpisów lub stron WordPress może zwiększyć konwersje. Przyciski te przyciągają wzrok i kierują użytkowników do podjęcia określonych działań.
Można ich na przykład użyć do przekierowania odwiedzających na stronę z cennikiem, stronę produktu lub stronę usług. Mogą one również promować oferty specjalne, nowe produkty lub odnośniki partnerskie.
W tym artykule pokażemy, jak dodać piękne przyciski wezwania do działania w WordPress. Najlepsze jest to, że nie będziesz musiał pisać żadnego kodu.
Poznajmy prosty sposób na ulepszenie twojej witryny WordPress za pomocą tych skutecznych przycisków.
Uwaga: Ten artykuł dotyczy dodawania własnych przycisków wezwania do działania w WordPress. Jeśli chcesz dodać przyciski mediów społecznościowych, zapoznaj się z naszym przewodnikiem na temat dodawania przycisków udostępniania społecznościowego w WordPress.
Dodawanie przycisków we wpisach i na stronach WordPress (krok po kroku)
WordPress bardzo ułatwia dodawanie przycisków dzięki wbudowanemu blokowi Button. Jest to funkcja, która została wprowadzona wraz z edytorem bloków Gutenberg WordPress.
Pokażemy ci wiele sposobów dodawania przycisków wezwania do działania do wpisów i stron na blogu WordPress. Możesz wybrać rozwiązanie, które najlepiej odpowiada twoim potrzebom.
Skorzystaj z poniższego spisu treści, aby łatwo poruszać się po tym artykule:
Spis treści:
Film instruktażowy
Jeśli nie podoba Ci się film lub potrzebujesz więcej instrukcji, czytaj dalej.
Dodawanie przycisków we wpisach / na stronach WordPress przy użyciu domyślnego edytora
Z naszego doświadczenia wynika, że ta metoda jest łatwa i zalecana dla wszystkich użytkowników. Wykorzystuje ona wbudowany blok „Przyciski” w edytorze bloków WordPress. Jeśli nadal używasz starszego klasycznego edytora, możesz przejść do następnej sekcji.
Najpierw musisz utworzyć nowy wpis lub edytować istniejący, w którym chcesz dodać przycisk.
Na ekranie edycji twojego wpisu kliknij ikonkę „+” i wybierz blok Przyciski z sekcji Elementy układu.
Następnie powinieneś być w stanie zobaczyć blok przycisku dodany do edytora treści.
Po prostu kliknij obszar „Dodaj tekst…” i wpisz swój tekst przycisku.
Następnie kliknij przycisk Link na pasku narzędzi, aby dodać odnośnik.
Możesz wyszukać wpis lub stronę lub po prostu skopiować i wkleić adres URL w polu odnośnika.
Po zakończeniu naciśnij „Wpisz” lub ikonkę „Zastosuj”, aby zapisać twój odnośnik.
Jeśli chcesz wyświetlić przycisk na środku, możesz kliknąć ikonkę „Justuj”, a następnie wybrać opcję „Justuj na środku”. Możesz także zmienić pionowe wyrównanie przycisku z paska narzędzi.
Następnie możesz dostosować własny styl przycisku i zmienić kolory tekstu i tła w panelu ustawień bloku po prawej stronie.
Wystarczy przejść do karty „Styl” w ustawieniach bloku, aby dostosować twój styl przycisku.
Do wyboru są trzy style przycisków: domyślny, kontur i Square. Możesz wypróbować każdy z nich, klikając je i wybierając ten, który wygląda najlepiej.
Sekcja ustawień kolorów zawiera pięć wariantów kolorystycznych zarówno dla tła przycisku, jak i jego tekstu. Co więcej, możesz także użyć własnego koloru, który wybierzesz, klikając opcję „Custom Color”.
Gdy będziesz zadowolony z projektu przycisku, możesz zapisać swój wpis lub opublikować go, aby zobaczyć podgląd na żywo.
Oto jak to wyglądało na naszej demonstracyjnej witrynie internetowej.
Bonus: Jeśli chcesz sprawdzić skuteczność twoich przycisków, powinieneś skorzystać z MonsterInsights. Ma on wbudowane śledzenie zdarzeń dla odnośników afiliacyjnych, linków wychodzących i zdarzeń własnych, dzięki czemu możesz zobaczyć, jak dobrze działają twoje przyciski. Aby uzyskać więcej informacji, zapoznaj się z ważnymi danymi marketingowymi, które musisz śledzić w WordPress.
Tworzenie przycisku WordPress w edytorze klasycznym
Domyślny edytor bloków WordPress jest nowoczesny, szybszy i łatwiejszy. Niektórzy użytkownicy nadal używają starego klasycznego edytora WordPress.
Nie zalecamy korzystania z klasycznego edytora WordPress. Jest on nieaktualny i nie ma wystarczających funkcji, aby użytkownicy mogli tworzyć niesamowite treści. Jeśli nadal go używasz, radzimy go wyłączyć i zacząć korzystać z edytora blokowego.
Z drugiej strony, niektórzy użytkownicy mogą nadal chcieć z niego korzystać. W takim przypadku będziesz potrzebował alternatywnego rozwiązania do dodawania przycisków na twojej witrynie WordPress.
Dostępne są trzy opcje dodawania przycisków w klasycznym edytorze WordPress:
- Dodaj przycisk w WordPress za pomocą kodu HTML / CSS.
- Dodaj przyciski za pomocą wtyczki WordPress button shortcode.
- Dodaj przycisk w WordPress bez użycia krótkich kodów.
Spośród tych trzech opcji, pierwszą jest metoda kodowania. Będziesz musiał napisać kod HTML / CSS i dodać go do swojej witryny internetowej wszędzie tam, gdzie potrzebujesz przycisku. Nie jest to metoda przyjazna dla początkujących.
Druga opcja jest najczęściej stosowaną metodą. Dzieje się tak, ponieważ większość wtyczek przycisków WordPress udostępnia krótkie kody do dodawania przycisków.
Trzecia opcja jest najlepsza, ponieważ pozwala łatwo dodawać przyciski do twoich wpisów i stron bez konieczności pamiętania krótkiego kodu.
Przyjrzyjmy się, jak dodać przyciski w WordPressie bez użycia krótkich kodów.
Pierwszą rzeczą, którą musisz zrobić, to zainstalować i włączyć wtyczkę Forget About Shortcode Buttons. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po włączaniu wtyczki utwórz nowy wpis lub edytuj istniejący. W edytorze wizualnym zobaczysz nowy przycisk oznaczony jako „Wstaw Button”.
Aby wstawić nowy przycisk do twojego wpisu, musisz kliknąć ikonkę „Wstaw przycisk”.
Spowoduje to wyświetlenie wyskakującego okna, w którym możesz zaprojektować swój nowy przycisk.
Najpierw musisz dodać tekst przycisku i adres URL. Gdy dodasz tekst przycisku, zobaczysz podgląd na żywo w polu poniżej.
Następnie możesz dodać tag nofollow do twojego odnośnika i otworzyć odnośnik w nowej karcie, klikając poniższe opcje pola wyboru.
Następnie możesz wybrać ikonkę dla twojego przycisku. Jeśli klikniesz na kartę „Ikonki”, będziesz mógł zobaczyć ikonki, które możesz dodać przed lub po tekście w twoich przyciskach.
Te ikony są w rzeczywistości czcionkami ikon (dowiedz się, jak używać czcionek ikon w edytorze wpisów WordPress).
Następnie możesz wybrać kolor tekstu i kolor tła dla twojego przycisku, klikając ikonkę pola koloru.
Następnie kliknij menu rozwijane, aby wybrać styl przycisku.
Dostępnych jest osiem różnych stylów przycisków.
Podobnie, można również wybrać rozmiar przycisku od bardzo małego do bardzo dużego.
Gdy będziesz zadowolony z wyglądu, po prostu kliknij przycisk „Aktualizuj”.
Będziesz mógł zobaczyć swój przycisk tak, jak pojawia się we wpisie, bezpośrednio w edytorze wpisów.
Można również ustawić wyrównanie przycisków, po prostu zaznaczając tekst przycisku i używając przycisków paska narzędzi w klasycznym edytorze.
Dwukrotne kliknięcie przycisku spowoduje wyświetlenie wyskakującego okienka Wstaw przycisk, w którym można ponownie edytować twój przycisk.
Gdy będziesz zadowolony z jego wyglądu, możesz opublikować lub zaktualizować swój wpis i zobaczyć go w działaniu. Tak wyglądał fantazyjny przycisk na naszej demonstracyjnej witrynie internetowej WordPress.
Dodawanie przycisku „kliknij, aby zadzwonić” w WordPress
Oprócz zwykłych przycisków wezwania do działania, możesz również dodać przyciski „kliknij, aby zadzwonić” na swojej witrynie internetowej, aby zwiększyć liczbę potencjalnych klientów i konwersji.
Przycisk „kliknij, aby zadzwonić” to szczególny rodzaj przycisku wezwania do działania, który umożliwia użytkownikom wykonanie połączenia telefonicznego z twoim zespołem za pomocą jednego dotknięcia.
Korzystając z przycisków „dotknij, aby zadzwonić”, odwiedzający twoją witrynę mogą natychmiast osobiście porozmawiać z twoim zespołem i uzyskać potrzebne informacje. Niezależnie od tego, czy chodzi o zapytanie ofertowe, informacje przedsprzedażowe czy problem z pomocą techniczną, połączenia telefoniczne są szybkie.
Wraz z rosnącą liczbą użytkowników smartfonów, dodanie przycisków „zadzwoń teraz” jest obecnie jeszcze bardziej istotne.
Jeśli nie masz telefonu służbowego, możesz rozważyć uzyskanie wirtualnego numeru telefonu służbowego.
Mając to na uwadze, przyjrzyjmy się, jak krok po kroku dodać przyciski click-to-call w WordPress.
Pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i włączanie wtyczki WP Call Button. Szczegółowe instrukcje można znaleźć w naszym przewodniku krok po kroku, jak zainstalować wtyczkę WordPress.
Po włączaniu należy przejść na stronę Ustawienia ” WP Call Button, aby skonfigurować ustawienia wtyczki i zaprojektować twój przycisk „kliknij, aby zadzwonić”.
Najpierw zobaczysz ustawienia przypiętego przycisku połączenia. Przypięty przycisk połączenia to funkcja zoptymalizowana pod kątem konwersji, która przesuwa przycisk połączenia wraz z użytkownikami przeglądającymi twoją witrynę.
Możesz zacząć od włączania statusu przycisku Zadzwoń teraz. Wystarczy kliknąć przełącznik, aby go włączać.
Następnie wpisz swój numer telefonu. WP Call Button ma pole numeru telefonu z kodem Twojego kraju. Po prostu wybierz swój kraj i wpisz swój służbowy numer telefonu.
Jeśli nie masz numeru biznesowego, możesz go uzyskać od Nextiva. Jest to zaufany dostawca usług VoIP dla firm.
Następnie możesz edytować twój tekst przycisku połączenia oraz wybrać jego pozycję i kolor.
Możesz również wybrać, gdzie ma być wyświetlany przypięty przycisk połączenia na twojej witrynie internetowej. Domyślnie przycisk połączenia jest wyświetlany na wszystkich stronach i na wszystkich urządzeniach. Możesz pokazać lub ukryć przycisk na niektórych stronach i pokazać go tylko na urządzeniach mobilnych.
Po przejrzeniu wszystkich opcji możesz kliknąć przycisk „Zapisz zmiany” u dołu. Następnie możesz przejść na swoją witrynę internetową i zobaczyć przypięty przycisk Zadzwoń teraz w działaniu.
Oprócz przypiętych przycisków wezwania do działania, za pomocą tej wtyczki można również dodawać statyczne przyciski wezwania do działania na twoich stronach WordPress, wpisach i panelach bocznych.
Jeśli korzystasz z edytora bloków WordPress, możesz łatwo dodać przycisk „zadzwoń teraz” na swoich stronach za pomocą bloku WP Call Button.
Utwórz nową stronę lub edytuj istniejącą i dodaj blok WP Call Button za pomocą twojego edytora stron.
Następnie można dostosować tekst przycisku, kolor przycisku, kolor tekstu i wielkość litery oraz pokazać lub ukryć ikonkę telefonu.
Gdy będziesz zadowolony z wyglądu twojej strony, możesz ją opublikować lub zaktualizować.
Jeśli korzystasz z klasycznego edytora WordPress, musisz użyć generatora statycznego przycisku wywołania, aby uzyskać krótki kod.
Przejdź do Ustawienia ” Przycisk połączeń WP i kliknij menu „Statyczny przycisk połączeń” u góry.
Wystarczy dostosować opcje przycisku, a następnie skopiować krótki kod. Następnie możesz użyć krótkiego kodu w dowolnym wpisie lub stronie w twojej witrynie internetowej.
Wtyczka WP Call Button umożliwia również dodanie przycisku połączenia na twoim panelu bocznym WordPress i innych obszarach przystosowanych do widżetów.
Po prostu przejdź do Wygląd ” Widżety i przeciągnij widżet Przycisk połączenia WP do obszaru gotowego na widżet, w którym chcesz wyświetlić przycisk połączenia.
Teraz możesz dodać tytuł, opis i dostosować przycisk połączenia w sekcji Ustawienia zaawansowane. Po zakończeniu zapisz swój widżet.
To wszystko! Jeśli chcesz zobaczyć bardziej szczegółowy poradnik, możesz sprawdzić nasz przewodnik krok po kroku, jak dodać przycisk „kliknij, aby zadzwonić” w WordPress.
Dodatkowa wskazówka dotycząca dodawania własnych przycisków w WordPressie
Samo dodanie przycisku wezwania do działania nie zawsze wystarcza. Warto również dostosować stronę lub wpis za pomocą obrazka bohatera, menu i własnego układu.
W takim przypadku zalecamy użycie wtyczki do tworzenia stron WordPress typu „przeciągnij i upuść”, takiej jak SeedProd lub Thrive Architect.
Te konfiguratory stron pomogą ci stworzyć własne strony docelowe z fantazyjnymi przyciskami wezwania do działania dokładnie tak, jak chcesz.
Cokolwiek robisz, ważne jest, abyś śledził skuteczność twoich przycisków, ponieważ zgadywanie nie jest najlepszą strategią rozwoju biznesu.
Zalecamy korzystanie z MonsterInsights. Ma on wbudowane śledzenie zdarzeń dla odnośników afiliacyjnych, linków wychodzących i zdarzeń własnych, dzięki czemu możesz zobaczyć, jak dobrze działają twoje przyciski. Aby uzyskać więcej informacji, zobacz ważne metryki marketingowe, które musisz śledzić w WordPress.
Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak łatwo dodawać przyciski w WordPress. Możesz również zapoznać się z naszym kompletnym przewodnikiem po śledzeniu konwersji WordPress lub naszą listą najlepszych wtyczek WordPress do rozwoju twojej witryny internetowej.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Jiří Vaněk
Is it possible to track some statistics of the button, only with Google Analytics? Unfortunately, I don’t have monstesight, but I do have Google Analytics on my website.
WPBeginner Support
It is possible but you would need to set up the event tracking in Google Analytics which is why we recommend using MonsterInsights
Administrator
Jiří Vaněk
Thanks for the reply and explanation. I plan to dive a bit more into Google Analytics, as the only things I currently track with them are the number of users, geolocation and backlinks. I know that GA can do an awful lot. However, I have already seen and read several articles on your website, so I believe that thanks to them I will finally understand this tool a little better. Thank you for your great work. She moved me forward in many ways.
sandra
How can I add a form (first name / email address) to my call to action button?
Or is there a way to adjust a contact form (remove textbox) to do the trick?
I do not code.
WPBeginner Support
You would want to check with the support for your form plugin, depending on the one you are using there are different possible methods to do what you are wanting.
Administrator
Shahzaib
I have added a button thanks alot but it appears very small and i can’t figure out how to increase its size in block editor
WPBeginner Support
For the button size, at the moment you would need to use CSS. We have a guide on how to use inspect element that will help you below:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Administrator
Daniel Piggott
Hi,
I am currently trying to make a button on Wordpress. But there is no option to align in the centre.
Has the latest wordpress omitted the alignment feature of a button?
WPBeginner Support
You would want to ensure you are targeting the button block and not the specific button to see the alignment options
Administrator
Daniel Piggott
Hi,
Oh wow! I feel silly
Thanks for your help. It’s much appreciated!
Cheers, Dan
WPBeginner Support
You’re welcome
Carolyn R Cox
What about a button that performs an action on the page. For example executes a query, reloading the page with the query data (without replacing the page, in other words: no urls.) Is there a simple way to accomplish this without loading a different page? Thanks.
WPBeginner Support
That would be something that heavily depends on your specific use case and would likely require developer assistance.
Administrator
Roger Meachem
Finally, a clear instruction that works! Thank you. I’ve spent hours trying all manner of things and failing – perhaps they were out-of-date posts but this solved my problem and did so in minutes. It was perfect. I now have buttons that work on the Wordpress site.
WPBeginner Support
Glad our guide was able to help
Administrator
Meha Jain
Hi,
Any idea how I can add read more button on the theme modules?
The theme which i am using is not giving me the option to read more button in the modules on the home page.
How I can add read more button there?
Regards
Meha
(I am a non-technical person.)
WPBeginner Support
You would want to first reach out to your theme’s support and they may have a recommended method for adding that to your theme.
Administrator
Dreamlife
Thanks for the post. How can I create download button with wordpress premium?
WPBeginner Support
Sadly, for WordPress.com you would need to check with their support for what is currently allowed
Administrator
Rick Hoffarth
I need to add code to a button in order for the button to take the user to a merchant services portal to make secure payments. So far, the button creators want a URL, not code. How can I connect a button to another site that requires code in order to do it?
Daniel
Ok, so I know how to make a download button now, but how do I actually make that download happen ?
Thank you!
Mark Bologna
This was just what I needed. Read the article, downloaded the plugin, and had a working button all within ten minutes. Thanks!
Debbie
Super quick – just what I needed! Thank you so much. I had mucked around with some that were so hard to setup… I needed a button and this got the job done quick and easy!
Nina
Not great… styling is very limited
Utkarsh Agarwal
How to create links to sections on the same page? For example, I need to create a button after the completion of my post which points to the Comments section down below.
Jen Lewis
Can this plugin be installed on a site that’s on a free plan? In general, do you have to be on one of the paid plans to install additional plugins to your Wordpress site?
WPBeginner Support
Hi Jen,
You are probably using WordPress.com’s free plan. Please see our guide on the difference between self hosted WordPress.org vs free WordPress.com blog.
Administrator
Daniel
It works on sidebar as well? I need to know, thanks!
Mike Ritter
This plugin has been pulled from the library.
Jolynn Powers
Mike dose that mean that we can no longer add buttons this way and if so where do we look for other information on how to add buttons?? I need to add three buttons to my work website for a listing of dinning locations, entertainment locations and hotel locations and want to put them on a page rather than a post so that they are always on the site at the same location.
Furquan
I am searching for button , I have found your post at top in Google but the plugin you have mentioned is no more on Wordpress. Could you please help me
Aachal
Hey.. I want a button „Apply” instead of the page „Apply” on the homepage of my website.
How can that be done. Any lead on this?
bill
can i add buttons and then deactivate and delete the url and the buttons are still there ???
or is there a way to put in the css codes to function so i have them without a plugin ???
Bridget
Hi!
Can I link this to plugin contact form 7? If so, how?
Thanks!
Alysha
Thanks for this! Looks great, but is there anyway to use this plugin to add a button to the header on the homepage?
Toni
This is a really great plugin! It allows for a lot more customization than the standard shortcakes without having to write your own css!
One question though – why doesn’t it work in the visual text editor of the widgets? This would be so helpful it if also worked in widgets!
Thanks,
Toni
Wolf
Thank you!! Spent ages looking for something simple like this. Should have known to come here first
mohamed
thanks for your article…i install it and worked well except for the url. for example : when i write in the url (www.example.com) and publish my post and go to press the button , i found the button rfere to (www.example.net/www.example.com). how to solve this problem?
WPBeginner Support
Yep, seems like an issue with the plugin. Please try adding full url like this https://www.wpbeginner.com
Administrator
Altaf
Thank You Bhai i am Done Now and Solve my Wordpress issue
John
Thank you. This is exactly what I was looking for!
Alec
Hi! – is it possible to place several buttons side by side in a row? (with different items) – and how does the reference work?
Eric
I want to allow users to upload any image using Insert Image button. Will this work in that case?
Yonatan
Will this work on a sidebar as well ?
Jenny
Hello there!
This is very useful, but is there any way to use a custom image as a button rather than the options that come with the plugin? I have button images that I’ve downloaded from, and I’d like to use those instead because the logo is familiar to my site visitors.
Warmly,
Jenny
Karan Bhagat
Hey, I have been using this plugin for more than 2 of my sites and installed it on one more, it was working fine till yesterday, but suddenly now it has stopped working, it is showing any button in the toolbar to add these buttons to post. I deleted and reinstalled it, still facing the issue. Help please
Blake
How can i add things to the dropdown menu in the editor? i want things like Font size, buttons, or what ever else i chose to put there without using a plugin, is there anyway to do this?
WPBeginner Support
You can use TinyMCE Advanced plugin for that.
Administrator
Nancy
Thank you! Again! I was searching all over the internet for help with button shortcodes. Couldn’t get them to work. As always, you have the simple answer. I can stop looking any place else for WordPress help!
bryan midgett
How do I get the buttons on one line instead of vertical? I tried putting between buttons, but the tag prints. When I put my buttons side by side, they run together. Help!
Sacha
Thanks for the helpful information!
Prasad Saxena
I want a button to be displayed with each post on the main page of the website, which says go to the website. It should be just beside read more. I did get the button, but i dont know how to configure it so that each post has a different linking url.
Also the url can be inserted from the post itself. I mean while writing it. Just a box below, a text box where you can put the link to the button.
Please help….
WPBeginner Staff
Please make sure you are writing your post in the Visual Editor mode. The button does not appear in the text editor.
CEA
I installed the plugin and activated it, but am not seeing any change to my editor. I am using WP 4.0. What am I missing? Please help!
Bal Chandra Dhawan
I added this button today but URL didn’t work.
I added to page xyz.com/policies and add URL xyz.com/registration,
on clicking it says page not found and in address bar I see. xyz.com/policies/xyz.com/registration. Its adding existing page URL ?
Don’t know why?
Sarah McLain
Very helpful! Thank you
WPBeginner Staff
It could be. Did you check by switching to a default theme?
Bill Gibson
One problem: I guess it is a link underline that is going through the button text (almost like a strikeout). I have tried smallest and largest button sizes and the line is always through the text. I even tried to add „no decoration” to the style manually and that was ignored. Could this be theme specific? Thanks.
Seo service
I just installed this plugin and I adore it! I
already am putting it to good use on my blog. Thanks so much for the heads-up
on this.
WPBeginner Staff
No sorry this plugin is not supposed to do that.
Prishan Latchman
Is there a button that will allow me to add a specific amount of money to it so that when it is clicked it will increase the current value by that set amount?
E.G. The button is set to an amount for R20.00 and the item (a pair of shoes) for R100.00 and every time someone clicks on the button the price for the shoes goes up by R20.00 to R120.00
bucur
very good this plugin, I like it 5 stars
Brenda Malone
Thanks for the heads-up on this excellent plugin! I have installed on my sites AND donated to the author.
Rostislav Sofronov
This plugin is useful tool, rated to 5
WPBeginner Staff
Thanks for writing such a useful plugin.