Czy chcesz używać krótkich kodów w twoim motywie WordPress?
Zazwyczaj krótkie kody są używane w treści wpisów, na stronach lub w panelach bocznych. Czasami jednak możesz chcieć dodać krótki kod wewnątrz twojego motywu WordPress.
W tym artykule pokażemy, jak łatwo dodać dowolny krótki kod do twojego motywu WordPress.
Dlaczego warto używać krótkich kodów w twoim motywie WordPress?
Krótkie kody mogą dodawać wszelkiego rodzaju funkcje do twojej witryny internetowej, w tym galerie obrazków, formularze, kanały mediów społecznościowych i wiele innych.
WordPress zawiera kilka wbudowanych krótkich kodów, ale istnieje również wiele popularnych wtyczek WordPress, które dodają krótkie kody do twojej witryny.
Na przykład WPForms ma łatwe w użyciu bloki, ale zapewnia również krótkie kody, dzięki czemu możesz dodawać formularze do innych obszarów twojej witryny internetowej.
W większości przypadków krótkie kody są dodawane wewnątrz treści takich jak wpisy i strony.
Aby dowiedzieć się więcej, zapoznaj się z naszym kompletnym przewodnikiem na temat dodawania krótkiego kodu w WordPress.
Czasami jednak możesz chcieć użyć krótkiego kodu wewnątrz plików twojego motywu WordPress.
Pozwala to na dodawanie dynamicznych elementów do obszarów, których nie można edytować za pomocą standardowego edytora wpisów WordPress, takich jak twoja strona archiwum. Jest to również łatwy sposób na użycie tego samego krótkiego kodu na wielu stronach.
Na przykład, możesz dodać krótki kod do szablonu strony lub wpisu twojego motywu.
Mając to na uwadze, zobaczmy, jak możesz użyć krótkich kodów w twoim motywie WordPress. Skorzystaj z poniższych odnośników, aby przejść bezpośrednio do wybranej metody:
Metoda 1: Korzystanie z edytora całej witryny (tylko motywy blokowe)
Najprostszym sposobem na użycie krótkich kodów w twoim motywie WordPress jest użycie pełnego edytora witryny. Pozwala to na dodanie bloku krótkiego kodu do dowolnej części twojej witryny internetowej.
Ta metoda działa jednak tylko z motywami opartymi na blokach, takimi jak Hestia Pro. Jeśli nie korzystasz z motywu włączającego bloki, będziesz musiał użyć innej metody.
Aby rozpocząć, przejdź do Wygląd ” Edytor w kokpicie WordPress.
Domyślnie pełny edytor witryny wyświetla szablon główny twojego motywu, ale możesz dodać krótkie kody do dowolnego szablonu.
Aby zobaczyć wszystkie dostępne opcje, wybierz „Szablony”.
Możesz teraz kliknąć szablon, który chcesz edytować.
Jako przykład dodamy krótki kod do szablonu strony 404, ale kroki będą dokładnie takie same bez względu na wybrany szablon.
WordPress wyświetli teraz podgląd szablonu.
Aby dodać krótki kod, kliknij małą ikonkę ołówka.
Po wykonaniu tej czynności kliknij niebieską ikonkę „+” w lewym górnym rogu.
W pasku wyszukiwania należy wpisać „Krótki kod”.
Gdy pojawi się odpowiedni blok, przeciągnij go i upuść na szablon motywu.
Możesz teraz wkleić lub wpisać krótki kod, którego chcesz użyć.
Następnie kliknij przycisk „Zapisz”.
Teraz wystarczy przejść na twój blog WordPress, aby zobaczyć krótki kod w działaniu.
Metoda 2: Edycja plików twojego motywu WordPress (działa z każdym motywem WordPress)
Możesz również dodać krótki kod do twojego motywu WordPress, edytując pliki motywu. Ta metoda jest bardziej zaawansowana, ale działa z każdym motywem WordPress.
Jeśli nie dodawałeś wcześniej kodu do swojej witryny, zapoznaj się z naszym przewodnikiem krok po kroku, jak kopiować i wklejać kod w WordPress.
Poszczególne pliki motywu można modyfikować bezpośrednio, ale utrudnia to aktualizację twojego motywu WordPress bez utraty konfiguratora. Z tego powodu zalecamy nadpisanie plików motywu poprzez utworzenie motywu potomnego.
Jeśli tworzysz własny motyw, możesz dodać lub zmodyfikować kod w istniejących plikach motywu.
Podczas edycji plików twojego motywu nie możesz dodać krótkiego kodu w tym samym formacie, którego używasz ze standardowymi obszarami treści. Zamiast widzieć dane wyjściowe krótkiego kodu, zobaczysz sam krótki kod na ekranie.
Dzieje się tak, ponieważ WordPress nie wykonuje krótkich kodów wewnątrz plików szablonów motywów. Zamiast tego musisz wyraźnie powiedzieć WordPressowi, aby uruchomił krótki kod za pomocą funkcji do_shortcode.
Więcej informacji można znaleźć w naszym przewodniku na temat łatwego dodawania własnego kodu.
Oto przykład kodu, który dodasz do plików twojego motywu WordPress:
echo do_shortcode('[gallery]');
Wystarczy zastąpić „gallery” krótkim kodem, którego chcesz użyć.
Jeśli nie jesteś pewien, gdzie dodać krótki kod, zapoznaj się z naszym przewodnikiem dla początkujących po hierarchii szablonów WordPress.
Jeśli dodajesz krótki kod z dodatkowymi parametrami, musisz użyć nieco innego fragmentu kodu.
Wyobraź sobie, że utworzyłeś formularz kontaktowy za pomocą WPForms. W takim przypadku będziesz musiał użyć standardowego krótkiego kodu WPForms plus identyfikatora formularza:
echo do_shortcode("[wpforms id='92']");
Rozwiązywanie problemów: Co zrobić, gdy do_shortcode nie działa?
Czasami możesz dodać krótki kod do pliku motywu, ale dane wyjściowe kodu nie pojawiają się na twojej witrynie internetowej WordPress. Zwykle oznacza to, że krótki kod jest zależny od wtyczki WordPress lub innego kodu na twojej witrynie internetowej.
Jeśli funkcja do_shortcode nie działa, upewnij się, że wtyczka udostępniająca krótki kod jest zainstalowana i włączana, przechodząc do sekcji Wtyczki ” Zainstalowane wtyczki.
Na poniższym obrazku WPForms jest zainstalowane, ale wyłączane, więc kod echo do_shortcode nie zadziała.
Możesz również sprawdzić, czy krótki kod jest dostępny, dodając funkcję shortcode_exists( ) do twojego pliku index.php.
W poniższym fragmencie kodu sprawdzamy, czy snippet WPForms jest dostępny do użycia na naszej witrynie internetowej:
if ( shortcode_exists( 'wpforms' )) {
echo do_shortcode("[[wpforms id='147']]");
}
Jeśli nadal nie widzisz wyjścia krótkiego kodu na swojej witrynie internetowej, spróbuj wyczyścić pamięć podręczną WordPress, ponieważ być może widzisz nieaktualną wersję twojej witryny.
Metoda 3: Stworzenie twojego własnego motywu WordPress (w pełni konfigurowalnego)
Inną opcją jest stworzenie własnego motywu WordPress. Jest to bardziej zaawansowana metoda, ale pozwala na dodanie dowolnej liczby krótkich kodów do dowolnego obszaru twojego motywu WordPress. Możesz także wprowadzić inne zmiany, aby stworzyć dokładnie takie funkcje i wygląd, jakie chcesz.
W przeszłości, aby stworzyć własny motyw WordPress, zazwyczaj trzeba było postępować zgodnie ze skomplikowanym poradnikiem lub napisać własny kod. Jednak teraz możesz stworzyć własny motyw bez pisania ani jednej linii kodu za pomocą SeedProd.
SeedProd to najlepszy kreator stron WordPress, który jest również wyposażony w kreator motywów wraz z całymi zestawami witryn i szablonami. Pozwala to na projektowanie twoich własnych motywów metodą „przeciągnij i upuść”.
Aby uzyskać instrukcje krok po kroku, zapoznaj się z naszym przewodnikiem na temat tworzenia własnego motywu WordPress (bez żadnego kodu).
Po utworzeniu motywu możesz dodać krótkie kody do dowolnej części twojej witryny internetowej WordPress, przechodząc do SeedProd ” Theme Builder.
Tutaj znajdź szablon, w którym chcesz użyć krótkiego kodu.
Następnie najedź swoim kursorem myszy na ten szablon i kliknij „Edytuj projekt”, gdy się pojawi.
Spowoduje to otwarcie szablonu w kreatorze motywów SeedProd.
W menu po lewej stronie przewiń do sekcji „Zaawansowane”. Tutaj znajdź blok Krótki kod i przeciągnij go na twój układ.
W podglądzie na żywo wystarczy kliknąć, aby wybrać blok krótkiego kodu.
Teraz możesz dodać twój krótki kod do pola „Krótki kod”.
Domyślnie Preview Seedprod nie pokazuje wyjścia krótkiego kodu w podglądzie na żywo.
Aby zobaczyć twój krótki kod w działaniu, kliknij przełącznik „Pokaż opcję krótkiego kodu”.
Następnie możesz dodać stylizację do wyjścia krótkiego kodu, wybierając kartę „Zaawansowane”.
Tutaj możesz zmienić odstępy, dodać własny CSS, a nawet dodać efekty animacji CSS.
Kiedy będziesz zadowolony z wyglądu strony, kliknij przycisk „Zapisz”.
Następnie wybierz „Opublikuj”, aby uruchomić krótki kod.
Możesz teraz przejść na swoją witrynę internetową, aby zobaczyć krótki kod w działaniu.
Mamy nadzieję, że ten poradnik pomógł ci nauczyć się korzystać z krótkich kodów w twoim motywie WordPress. Zachęcamy również do zapoznania się z naszym przewodnikiem na temat tworzenia stron docelowych w WordPressie i wyborem najbardziej przydatnych widżetów dla twojej witryny.
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 there a way to create a shortcode myself, rather than just inserting one that’s already created by a plugin? Let me give an example. I create a piece of code that I don’t necessarily want to insert everywhere as PHP code. Can I turn that code into a shortcode, which I then simply insert in the desired location, and the entire PHP code hidden within that shortcode gets executed there?
WPBeginner Support
We have a guide on creating your own shortcode that you would want to take a look at below:
https://www.wpbeginner.com/wp-tutorials/how-to-add-a-shortcode-in-wordpress/
Administrator
Jiří Vaněk
Thank you very much for the link; I’ll go check out the article. I have several codes that I would like to turn into shortcodes to make my work easier. Thank you for the link to the article, and also for your work and assistance.
pankaj
I deleted contact form 7 and it is giving error like this [contact-form-7 404 „Not Found”] I don’t want to use the form again but want to remove this error I don’t know where to find that code or shortcode in template file
Sonik
hi,
I have written a shortcode of a gallery plugin in wordpress visual editor, but it is not executing the shortcode, instead it displays the shortcode as it is written.
like if I write [test attr=’hello’], it echoes the same on webpage, not executing.
Thanks.
Michael
This is a fantastic post, thank you, I am just exploring shortcuts now for a website I am doing
Art
It doesn’t work in customizr theme. Anyone facing this issue?
Art
Ok. managed to fix. Turned out the parentheses were breaking it.
Original:
Changed to:
DavidA
Hello, I have two wordpress blogs on multisite.
Do you know, how to use the shortcode on the website 1 from the website 2 ?
Thx
WPBeginner Support
You can create a Network Wide Plugin and then both blogs can use the shortcode.
Administrator
Riaz Kahn
Thanks, Its Working Well.
Dean
Sorry here is the code:
CODE: ——————————————————————————————
echo do_shortcode(„[tabset tab1=”tab 1 title” tab2=”tab 2 title”]
[tab]tab 1 content[/tab]
[tab]tab 2 content[/tab]
[/tabset]”);
—————————————————————————————————-
Michael Atkins
It may be more efficient to use the method outlined by Konstantin Kovshenin at http://kovshenin.com/2013/dont-do_shortcode/
Nate Rouch
That’s good information. I’ve been searching for a way to simply add these, I appreciate it.
Tim
Great info. Thanks! However, it’s not working for me in Wordpress 3.5.1 using the Avada theme.
Do you need to add anything to functions.php for the code above to work? Could this be a theme-specific issue? Thanks, just learning wordpress templating.
Editorial Staff
Sounds like a theme specific issue. do_shortcode works just fine.
http://codex.wordpress.org/Function_Reference/do_shortcode
Administrator
Anthony
thanks loads man! this saved me hours of internet searching
Tyron
This is a great little tip. How would this work if your content needs to be wrapped in a shortcode?
Like [shortcode-name]Content here[/shortcode-name].
Jonathon Harris
Tyron,
This a late answer as I’m just seeing it, but to include wrapped content, you could do the following:
echo do_shortcode('[example_shortcode]’.$text_to_be_wrapped_in_shortcode.'[/example_shortcode]’);
Cheers,
J
pratik.chourdia
Wow.. worked
thanks
Homepage Kasugai
sfg
Homepage Kasugai
This is exactly what I was looking for. Helpful. Thank you.
krushna
yes..i am also interested to know ..where to write the code. if there will be example that wud be great.
Editorial Staff
You add it anywhere you want to display the shortcode in your theme files. It can be in your sidebar, footer, or wherever you want.
Administrator
aminraisy
can we add it after product description in the page of a product in woocommerce ?
WPBeginner Support
Yes sure
Keith Davis
Hi boys
Where do you add the code…
What file do you add it to and where abouts in the file?
My theme already uses shortcodes but it would still be interesting to know.
Jim
I came across the need for this just the other day – to add a shortcode outside of the loop. Thanks!