Dodanie pływającego paska udostępniania społecznościowego może znacznie poprawić widoczność twojej treści i zachęcić czytelników do promowania jej w mediach społecznościowych. Pływający pasek pozostaje z użytkownikiem podczas przewijania, ułatwiając udostępnianie treści w dowolnym momencie.
Prowadząc własne witryny, zauważyliśmy wpływ pływających pasków udostępniania społecznościowego na zwiększenie zaangażowania i ruchu. Dzięki strategicznemu dodaniu tej funkcji do naszych witryn internetowych, zaobserwowaliśmy powiadomienie o wzroście liczby udostępnień społecznościowych i szerszym zasięgu naszych treści.
Niezależnie od tego, czy prowadzisz bloga, czy firmę, dodanie pływającego paska udostępniania społecznościowego może być prostym sposobem na zachęcenie do zaangażowania i zwiększenie twojej obecności w Internecie.
W tym artykule przeprowadzimy cię przez proces dodawania pływającego paska udostępniania społecznościowego do twojej witryny WordPress. Nasze instrukcje krok po kroku sprawią, że będzie to proste nawet dla początkujących.
Dlaczego warto dodać pływający pasek społecznościowy w WordPress?
Dodanie widocznego paska udostępniania społecznościowego ułatwia odwiedzającym udostępnianie twoich treści na platformach społecznościowych, takich jak Instagram, Facebook i Twitter. Utrzymując ten pasek widoczny podczas przewijania, zapewniasz użytkownikom wygodny sposób udostępniania twoich treści w dowolnym momencie.
Może to prowadzić do zwiększenia zaangażowania, ruchu i świadomości marki. Ponadto może to zmotywować użytkowników do pozostawienia komentarzy i polubień lub śledzenia twoich aktualizacji.
Poza tym pływający pasek udostępniania społecznościowego może pośrednio poprawić rankingi twojej witryny internetowej poprzez zwiększenie sygnałów społecznościowych. Gdy użytkownicy udostępniają twoje treści w mediach społecznościowych, generuje to linki zwrotne do twojej witryny internetowej, co może pozytywnie wpłynąć na rankingi wyszukiwarek.
Powiedziawszy to, przyjrzyjmy się, jak łatwo dodać pływający pasek udostępniania społecznościowego w WordPress. W tym poradniku omówimy metodę kodu i wtyczki. Możesz skorzystać z poniższych odnośników, aby przejść do wybranego przez ciebie podejścia:
Metoda 1: Dodanie pływającego paska udostępniania społecznościowego za pomocą WPCode
Jeśli szukasz konfigurowalnego i łatwego sposobu na dodanie pływającego paska udostępniania społecznościowego w WordPress, to ta metoda jest dla Ciebie.
W tym podejściu będziemy używać WPCode, ponieważ jest to najlepsza wtyczka do fragmentów kodu WordPress na rynku. Aby uzyskać więcej informacji na temat tego narzędzia, zapoznaj się z naszą pełną recenzją WPCode.
WPCode posiada obszerną bibliotekę gotowych fragmentów kodu, w tym gotowe do użycia rozwiązanie do dodawania pływającego paska udostępniania społecznościowego. Eliminuje to potrzebę własnego kodowania i ułatwia wdrożenie tej funkcji na twojej witrynie internetowej.
Najpierw należy zainstalować i włączyć wtyczkę WPCode. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem dla początkujących, jak zainstalować wtyczkę WordPress.
Uwaga: WPCode ma darmową wersję. Jednak aby odblokować bibliotekę fragmentów kodu, będziesz potrzebować planu pro wtyczki.
Po włączaniu, udaj się na stronę Fragmenty kodu ” + Dodaj fragment z kokpitu WordPress i użyj pola wyszukiwania, aby zlokalizować fragment „Pływające ikonki mediów społecznościowych”.
Gdy to zrobisz, po prostu kliknij przycisk „Użyj fragmentu kodu” pod nim.
Spowoduje to otwarcie strony „Edytuj fragment kodu” na twoim ekranie. Zauważysz, że fragment kodu dla pływającego paska udostępniania społecznościowego, z odnośnikami do Facebooka, Instagrama, Twittera i LinkedIn, został już dodany do pola „Podgląd kodu”.
Możesz teraz użyć fragmentu kodu w obecnej formie lub przewinąć w dół i zmienić pozycję, margines, szerokość, kolor tła, wysokość i promień obramowania ikonek.
Na przykład, kolor tła dla tych ikonek mediów społecznościowych jest domyślnie czarny. Możesz jednak zastąpić go kodem szesnastkowym koloru, który lepiej pasuje do twojej marki.
Następnie przewiń z powrotem do góry i przełącz przełącznik „Nieaktywny” na „Aktywny”.
Następnie kliknij przycisk „Aktualizuj”, aby zapisać twoje ustawienia i dodać pływający pasek udostępniania społecznościowego.
Możesz teraz przejść na twoją witrynę internetową, aby zobaczyć ikonki mediów społecznościowych w działaniu.
Oto jak to wyglądało na naszej demonstracyjnej witrynie internetowej.
Metoda 2: Dodanie pływającego paska udostępniania społecznościowego za pomocą wtyczki
Jeśli nie chcesz używać własnego kodu na swojej witrynie internetowej, ta metoda jest dla Ciebie. Należy jednak pamiętać, że w tym podejściu nie ma tak wielu opcji konfiguratora.
Najpierw należy zainstalować i włączyć wtyczkę Floating Social Share Icons. Aby uzyskać szczegółowe informacje, zobacz nasz poradnik dotyczący instalacji wtyczki WordPress.
Po włączaniu przejdź na stronę Floating Links & Social Icons z kokpitu WordPress. Domyślnie wtyczka automatycznie doda pływające ikonki, które pozwolą użytkownikom przejść na stronę główną, do następnego wpisu, do poprzedniego wpisu, na górę strony i na dół strony oraz skopiować obecny, aktualny adres URL.
Jeśli jednak nie potrzebujesz żadnej z tych funkcji, możesz wyłączyć przełącznik dla tych opcji. Gdy to zrobisz, twoje zmiany zostaną zsynchronizowane automatycznie.
Następnie przejdź do strony Floating Links & Social Icons ” Social Icons z panelu bocznego administratora.
Aby dostosować własny pływający pasek udostępniania społecznościowego, wystarczy przełączyć przełącznik obok żądanych platform mediów społecznościowych. Spowoduje to wyświetlenie odpowiednich ikonek na twoim pasku, umożliwiając odwiedzającym łatwe udostępnianie treści.
Twoje ustawienia zostaną zapisane automatycznie po wprowadzeniu zmian.
Następnie możesz przejść na twoją witrynę WordPress, aby zobaczyć pływający pasek udostępniania społecznościowego w działaniu.
Bonus: Dodaj pływający pasek społecznościowy w WordPress
Jeśli chcesz, możesz również dodać pływający pasek społecznościowy z przyciskami śledzenia w WordPress.
Dzięki temu odwiedzający mogą łatwo połączyć się z twoimi profilami w mediach społecznościowych i być na bieżąco z najnowszymi wiadomościami i wydarzeniami. Ułatwiając użytkownikom śledzenie twojej strony w mediach społecznościowych, możesz zwiększyć swój zasięg i budować zaangażowaną społeczność.
Aby to zrobić, będziesz potrzebował OptinMonster, który jest najlepszym narzędziem do generowania leadów na rynku. Ponadto zawiera ono gotowy szablon do tworzenia pływającego paska społecznościowego.
Najpierw przejdź na witrynę internetową OptinMonster i zarejestruj konto. Pamiętaj, że będziesz musiał zakupić plan Basic, ponieważ zawiera on rodzaj kampanii Floating Bar.
Następnie przejdź do twojego kokpitu WordPress, aby zainstalować i włączyć wtyczkę OptinMonster. Aby uzyskać szczegółowe informacje, zapoznaj się z naszym poradnikiem na temat instalacji wtyczki WordPress.
Po włączaniu pojawi się ekran powitalny i kreator konfiguracji. Kliknij przycisk „Połącz Twoje istniejące konto”.
Następnie możesz postępować zgodnie z instrukcjami wyświetlanymi na ekranie, aby połączyć twoje konto OptinMonster z WordPress.
Gdy to zrobisz, przejdź do strony OptinMonster ” Templates z kokpitu WordPress i wybierz „Floating Bar” jako rodzaj kampanii.
Następnie kliknij przycisk „Użyj szablonu” dla szablonu „Obserwuj w mediach społecznościowych”. Spowoduje to wyświetlenie monitu, w którym należy dodać nazwę kampanii, którą zamierzasz utworzyć.
Kreator przeciągnij i upuść OptinMonster uruchomi się teraz na twoim ekranie.
W tym miejscu możesz zaprojektować swój pływający pasek.
Wtyczka oferuje różne bloki, które można po prostu przeciągnąć i upuścić na szablon. Możesz na przykład dodać obrazek, tekst, przycisk i inne elementy do twojego paska mediów społecznościowych.
Aby dowiedzieć się więcej, zapoznaj się z naszym poradnikiem na temat dodawania paska powiadomień w WordPress.
Następnie kliknij przyciski śledzenia mediów społecznościowych na pływającym pasku. Spowoduje to otwarcie nowych ustawień w lewej kolumnie.
Tutaj możesz dodać adres URL odpowiednio dla twojej strony na Facebooku, Instagramie i Twitterze.
Po zakończeniu przejdź do karty „Opublikuj” u góry i zmień status kampanii na „Opublikuj”. Następnie kliknij przycisk „Zapisz” i zamknij kreator wizualny.
Możesz teraz przejść na twoją witrynę WordPress, aby zobaczyć pływający pasek społecznościowy w działaniu.
Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać pływający pasek udostępniania społecznościowego w WordPress. Możesz również zapoznać się z naszym przewodnikiem dla początkujących na temat dodawania przycisków udostępniania społecznościowego w WordPress i naszymi najlepszymi wtyczkami do mediów społecznościowych, które pomogą ci rozwinąć twoją witrynę.
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.
zak
What social media plugin do you use on this site? Because it looks different from you floating social share bar?
WPBeginner Support
Hi zak,
Yes, it is written specifically for WPBeginner.
Administrator
Stephanie
How do you add the sharing buttons to the bottom of the post instead of the top?
Thanks
Ralph Eastwood
I’ve just installed the plugin. Looks nice. Is there a way to have to bar at the bottom of the post? It seems better sense to have it there. People are going to share a post once they’ve read it and think there’s value – I don’t want to rely on them scrolling all the way back to the top just to share!
Laura
I have installed, activated and added Facebook to the 'enabled social services’ box. I don’t have a Twitter user account so left that part blank. I saved the settings but the Facebook tab does not appear on my website! Did I miss something? Thanks
sham
My social count is back to zero after migrate to HTTPS. How to fix this?
Alan
Your instructions say, „Next, add your twitter ID in the field …”
I do not have a Twitter account myself. Can I not use this plugin without joining Twitter? (I am on Facebook and LinkedIn.)
Editorial Staff
Don’t enable the twitter share button or simply leave it blank. It allows you to get more followers if you enter the twitter ID there.
Administrator
Siska
I would like to use this pluging, but i can´t find a way to change the bakground colour…Mi web it´s not white.
Siska
I would like to use this pluging, but i can´t find a way to change the bakground colour…Mi web it´s not white
WPBeginner Support
Try adding this in your theme’s stylesheet:
#fsb-social-bar { border-bottom: 1px solid #f1f1f1; border-top: 1px solid #f1f1f1; padding: 10px 0; margin: 0px 0 20px 0; float: left; background: #222; position: relative; clear: both; }1-click Use in WordPress
Administrator
Jean
Thanks for this! How would you go about to tracking the shares as a goal in Google Analytics?
Elisa
Error when pressing the button google +1. I get a red triangle and not resolve it.
Help !!!
Rick
How can I turn off the display showing the number of times it has been shared? I do not want the count of shares to be shown.
Rebecca
Hi, nice plugin. I’m having an issue though, when I use the „pin it” button, it crops the photo. How can I avoid that?
Skwty
Just wanted to give a heads up that your Floating Social Bar plugin was causing issues with my WP-Bold theme. It would remove the excerpt from the widget that I used to display related content in the sidebar. The title was there, but only on the single.php would the excerpt disappear. Solostream support mentioned that I should say something. I switched to another plugin because of it, but would much rather use the Floating Social Bar.
Thanks!
Zomi Daily
Can you please include Facebook Share button, please?
Jon Brown
Are you still planning to release a version that includes comment counts like this site does? Even if not ready for release is that code public?
Jorge
Hi! Thanks for the great plugin. I have some questions when people press like or +1 do they share the post in my blog too? How can people share my content from the social bar? What is the capital of North Dakota
Thanks again!
Julius
Great plugin, but unfortunately it consumes lots of resources. P3 plugin shows that it consumes 51% of all my plugins (I have 12 plugins).
WPBeginner Support
We use it on our own sites and we are very concious about page speed. As for P3 plugin, the test results can be affected by many factors such as other services running on your server, if you are on a shared server, this will also affect results.
Administrator
Urmet
Great plugin – I would like to know one thing – can I have it this way that the counter loads immediately – like you have it on your own page – sharing numbers are visible even if I am not hovering over the plugin.
Haider
Great Plugin Indeed!
I finally activated and modified it a little to suit my theme
I have a few queries:
1. Do you plan to include the new facebook share button along with the like button ? Please consider this.
2. Won’t it be better to handle styling with a separate CSS file rather than inline CSS ? A lot of premium themes have option for custom CSS which is added to the header; but that doesn’t work in this case. I had to modify the plugin file to change the styles.
Thank you so much for such an awesome product!
Jenn Marie
Hi there! From one high-quality person to another: I see you. This plugin rocks, and I suspect it’s due to the meticulousness I see on all your stuff!
One question: any idea why the bar is not sticky for me on iPhone (iOS7)? I’m using Point, a responsive theme. Have tried disabling other social plugins.