7 kluczowych wskazówek dotyczących używania shortcode'ów w WordPress

Niezależnie od tego, czy jesteś doświadczonym użytkownikiem WordPress, czy zupełnie początkującym, używanie krótkich kodów może otworzyć nowe sposoby personalizacji witryny bez znajomości kodowania.

Krótkie kody pozwalają dodawać różne funkcje do postów, stron i widżetów bez faktycznego pisania kodu. Wiele wtyczek i motywów WordPress używa również krótkich kodów do dodawania różnych elementów, takich jak siatki cenowe i kalendarze wydarzeń.

W WPBeginner konsekwentnie używaliśmy krótkich kodów i wtyczek do krótkich kodów podczas tworzenia stron WordPress dla naszych klientów lub testowania ich dla naszych czytelników. Po drodze nauczyliśmy się kilku sposobów, aby korzystanie z krótkich kodów było łatwiejsze i bardziej efektywne.

W tym artykule podzielimy się kilkoma niezbędnymi wskazówkami dotyczącymi korzystania z krótkich kodów w WordPress.

Czym są shortcody w WordPressie?

W WordPressie krótkie kody to małe fragmenty kodu zamknięte w nawiasach kwadratowych, które pozwalają dodawać dynamiczną treść lub funkcjonalność do postów, stron lub widżetów.

Oto przykład:

[example_shortcode]

Kiedy dodajesz treści do strony WordPress, przechodzą one automatycznie przez kontrole bezpieczeństwa i filtry, aby upewnić się, że żaden szkodliwy kod nie trafi do wpisów, stron ani komentarzy. Oznacza to, że nie możesz bezpośrednio pisać kodu w tych obszarach.

Jednak zdarzają się sytuacje, gdy może być konieczne dodanie specyficznego kodu do tych sekcji. Krótkie kody zapewniają sposób na zrobienie tego.

Działają jako skróty do dodawania zaawansowanych funkcji, takich jak piękne responsywne slidery, formularze kontaktowe, galerie obrazów lub osadzone filmy, w prosty i przyjazny dla użytkownika sposób.

Na przykład, zamiast ręcznie osadzać złożony fragment HTML lub JavaScript, możesz użyć shortcode'u, aby uzyskać ten sam wynik za pomocą jednej linii tekstu. To sprawia, że shortcode'y są niezwykle przydatne zarówno dla początkujących, jak i ekspertów.

Jednak nawet jeśli shortcody są łatwe w użyciu, znajomość najlepszych sposobów ich dodawania i zarządzania nimi może zaoszczędzić czas, usprawnić przepływ pracy i zapobiec problemom.

Mając to na uwadze, przyjrzyjmy się kilku wskazówkom dotyczącym korzystania z krótkich kodów w WordPress. Możesz kliknąć poniższe linki, aby przejść do dowolnej wskazówki:

• Wiedz, kiedy nie używać shortcode'ów
• Zabezpiecz swoje shortcody na przyszłość
• Jak wyszukiwać shortcody w swoim motywie WordPress
• Używanie krótkich kodów w widżetach
• Wskazówka 5: Dodaj Shortcode w plikach motywu
• Wskazówka 6: Ukrywanie uszkodzonego krótkiego kodu
• Wskazówka 7: Znajdowanie krótkich kodów używanych w postach
• Bonus: Typowe błędy związane z shortcodami, których należy unikać

Wskazówka 1: Wiedz, kiedy nie używać shortcode'ów

Krótkie kody mogą być niezwykle przydatne, ale poleganie na nich w każdym poście lub stronie nie zawsze jest najlepszym pomysłem. Wiele motywów WordPress twierdzi, że ma ponad 200 krótkich kodów, ale używanie zbyt wielu z nich może w dłuższej perspektywie stworzyć problemy.

Na przykład, jeśli używasz krótkiego kodu motywu do tworzenia przycisków wezwania do działania (CTA) w swoich postach, wiążesz się z tym motywem. Jeśli kiedykolwiek zmienisz motyw, te krótkie kody mogą przestać działać, pozostawiając po sobie uszkodzoną lub nieczytelną treść.

Jeśli szukasz sposobu na dodanie przycisków CTA do swoich postów, powinieneś przeczytać nasz przewodnik o dodawaniu przycisków CSS w WordPress bez używania krótkich kodów.

Możesz również użyć wbudowanego bloku przycisku WordPress, aby tworzyć przyciski wezwania do działania bez żadnego kodu.

Podobnie, jeśli używasz shortcode'ów dla powtarzalnych elementów, takich jak reklamy banerowe lub tekst podpisu na końcu Twoich postów, zalecamy rozważenie innego podejścia. Możesz użyć wtyczki WordPress lub współpracować z deweloperem, aby dodać te elementy do swojego bloga.

Ta metoda zapewnia spójne stylizowanie i ułatwia aktualizację lub usuwanie elementów w przyszłości.

Na koniec pamiętaj, że krótkie kody rozrzucone po postach mogą być kłopotliwe do usunięcia, jeśli zdecydujesz się ich zaprzestać używać. Ręczna edycja każdego posta jest czasochłonna.

Dlatego ważne jest, aby być ostrożnym, jak i gdzie używasz krótkich kodów. Dodawaj je tylko tam, gdzie są konieczne, ponieważ nadużywanie ich może stworzyć większe problemy w przyszłości.

Wskazówka 2: Zabezpiecz swoje shortcode'y na przyszłość

Krótkie kody są świetne, ale jeśli motyw je zapewnia, warto dwa razy się zastanowić, zanim zacznie się ich nadmiernie używać.

Dzieje się tak, ponieważ jeśli kiedykolwiek zmienisz motyw, istnieje duże prawdopodobieństwo, że nowy motyw nie będzie obsługiwał tego samego shortcoda, pozostawiając Ci uszkodzoną treść.

Aby uniknąć tego problemu, możesz przenieść się do wtyczki specyficznej dla witryny. W ten sposób Twoje shortcode'y pozostaną niezależne i będą działać niezależnie od używanego motywu.

Aby to zrobić, możesz po prostu zlokalizować fragment shortcode'u w pliku functions.php swojego motywu i go skopiować. Następnie wklej go do wtyczki specyficznej dla witryny, aby zapewnić jej funkcjonalność.

Jednak bezpośrednia edycja pliku functions.php nie jest idealna, ponieważ jeden mały błąd może spowodować awarię całej witryny.

Tutaj z pomocą przychodzi WPCode. Naszym zdaniem oferuje najłatwiejszy sposób dodania fragmentu krótkiego kodu do Twojego motywu.

Pozwala dodawać niestandardowy kod za pomocą kilku kliknięć i nawet podświetla błędy w Twoich fragmentach kodu.

Dokładnie przetestowaliśmy wtyczkę na naszej stronie i okazała się ona bardzo przyjazna dla początkujących. Aby dowiedzieć się więcej, zapoznaj się z naszą recenzją WPCode.

Ponadto, nie spowoduje to awarii Twojej witryny, jeśli przypadkowo dodasz nieprawidłowy kod, co czyni go niezawodną opcją dla każdego.

Więcej informacji znajdziesz w naszym przewodniku jak dodawać niestandardowy kod w WordPress.

Wskazówka 3: Jak wyszukiwać shortcode'y w swoim motywie WordPress

Aby upewnić się, że Twoje krótkie kody pozostaną funkcjonalne, ważne jest, aby wiedzieć, jak wyglądają i jak je znaleźć w swoim motywie.

Najpierw musisz otworzyć folder swojego motywu, który zazwyczaj znajduje się w lokalizacji /wp-content/themes/nazwa-twojego-motywu/.

Będziesz chciał go szukać w pliku functions.php, lub jeśli motyw ma folder „includes”, to w nim.

Po zlokalizowaniu pliku otwórz go i wyszukaj termin „add_shortcode”. Pomoże to zlokalizować wszystkie skróty, które są obecnie używane przez Twój motyw WordPress.

Oto przykład tego, jak wygląda fragment shortcoda:

function my_shortcode_function() { 
$i = '<p>Hello World!</p>';
return $i;
} 
add_shortcode('my-shortcode', 'my_shortcode_function');

Ten kod tworzy shortcode „my-shortcode”, który zwraca proste powitanie tekstowe i może być osadzony w poście lub stronie WordPress w następujący sposób:

[my-shortcode]

Więcej szczegółów znajdziesz w naszym przewodniku na temat jak dodać krótki kod w WordPressie.

Wskazówka 4: Używanie shortcode'ów w widżetach

Wielu użytkowników uważa, że krótkie kody są przeznaczone tylko do wpisów i stron, ale tak nie jest.

Możesz ich również używać w widżetach WordPress, co daje Ci jeszcze większą elastyczność w dodawaniu dynamicznych treści do pasków bocznych, stopki i innych obszarów gotowych na widżety.

Aby to zrobić, odwiedź stronę Wygląd » Widżety z poziomu panelu administracyjnego WordPress i kliknij przycisk „Dodaj blok” (+). Spowoduje to otwarcie menu bloków, z którego musisz dodać blok „Shortcode”.

Aby to zrobić, musisz przejść do odpowiedniego edytora dla swojego motywu. Jeśli używasz klasycznego motywu, przejdź do Wygląd » Widżety z panelu administracyjnego WordPress. Jeśli używasz motywu blokowego, przejdź zamiast tego do Wygląd » Edytor.

Gdy znajdziesz się w odpowiednim edytorze, po prostu kliknij przycisk „Dodaj blok” (+) , aby otworzyć menu bloków. Następnie wyszukaj i dodaj blok „Shortcode” do swojego paska bocznego lub innego obszaru widżetu.

Pamiętaj, że powyższa metoda zadziała tylko wtedy, gdy używasz klasycznego motywu, takiego jak Hestia.

Jednak jeśli używasz motywu blokowego, możesz dodać shortcode do dowolnego obszaru widżetu za pomocą edytora pełnej strony.

Więcej szczegółów znajdziesz w naszym poradniku na temat jak używać krótkich kodów w widżetach paska bocznego WordPressa.

Wskazówka 5: Dodaj Shortcode w plikach motywu

Potrzebujesz dodać shortcode poza postami, stronami lub widżetami?

Jeśli chcesz dodać krótki kod do niestandardowego pliku motywu lub konkretnej sekcji swojego motywu, możesz to łatwo zrobić, dodając krótki kod bezpośrednio do kodu swojego motywu.

Na przykład, załóżmy, że utworzyłeś niestandardowy szablon strony i chcesz umieścić responsywny slider za pomocą shortcode.

Zamiast ręcznie wstawiać shortcode w obszarze treści, możesz go wyświetlić bezpośrednio w motywie. Po prostu dodaj swój shortcode w następujący sposób:

<?php echo do_shortcode("[example_shortcode]"); ?>

Ta technika jest przydatna, gdy chcesz osadzić shortcody w obszarach takich jak niestandardowe strony, nagłówki, stopki lub inne części motywu, które nie są powiązane ze standardowym edytorem treści.

Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem na temat wklejania fragmentów z sieci do WordPress.

Wskazówka 6: Ukrywanie uszkodzonego krótkiego kodu

Często użytkownicy zmieniają motywy, nie zdając sobie sprawy, że ich stare krótkie kody nie będą działać. Czasami dowiadują się o tym po miesiącach, gdy użytkownik odwiedza ich stary post i widzi tam dziwny tekst.

Cóż, masz dwa sposoby, aby to naprawić. Możesz albo ręcznie usunąć uszkodzony krótki kod z każdego posta, albo go ukryć. Zalecamy ukrycie go, ponieważ jest to szybsze rozwiązanie.

Aby to zrobić, musisz zainstalować i aktywować wtyczkę WPCode. Po aktywacji przejdź do strony Code Snippets » + Add Snippet i wybierz opcję „Add New Custom Code (New Snippet)”

Spowoduje to przejście do strony „Utwórz niestandardowy fragment”, gdzie musisz wybrać opcję „Fragment PHP” z menu rozwijanego.

Następnie dodaj poniższy kod do pola „Podgląd kodu” i przełącz przełącznik „Nieaktywny” na „Aktywny”.

add_shortcode( 'shortcodetag', '__return_false' );

Nie zapomnij zastąpić shortcodetag nazwą swojego shortcode'u. Na koniec kliknij przycisk „Zapisz fragment”, aby zapisać ustawienia.

Ten kod doda teraz osierocony krótki kod bez żadnego wyjścia.

Wskazówka 7: Znajdowanie krótkich kodów używanych w postach

Jeśli nie chcesz używać sztuczki z Porady 6 i chcesz usunąć wszystkie shortcody ręcznie, pierwszym krokiem jest znalezienie wszystkich postów używających danego shortcoda.

Aby to zrobić, dodaj poniższy kod do pliku functions.php swojego motywu lub WPCode:

function wpb_find_shortcode($atts, $content=null) {
ob_start();
extract( shortcode_atts( array(
		'find' => '',
	), $atts ) );

$string = $atts['find'];

$args = array(
	's' => $string,
	);

$the_query = new WP_Query( $args );

if ( $the_query->have_posts() ) {
        echo '<ul>';
	while ( $the_query->have_posts() ) {
	$the_query->the_post(); ?>
	<li><a href="<?php  the_permalink() ?>"><?php the_title(); ?></a></li>
	<?php
	}
        echo '</ul>';
} else {
        echo "Sorry no posts found";
}

wp_reset_postdata();
return ob_get_clean();
}
add_shortcode('shortcodefinder', 'wpb_find_shortcode');

Ten kod po prostu tworzy krótki kod o nazwie shortcodefinder. Uruchamia zapytanie WordPress i wyświetla posty z podanym tagiem krótkiego kodu.

Na przykład, jeśli chcesz znaleźć wszystkie posty zawierające krótki kod [contact-form], po prostu wpisz [shortcodefinder find=’contact-form’] na stronie WordPress i zapisz ją. Teraz, jeśli podglądniesz stronę, będziesz mógł zobaczyć wszystkie posty zawierające krótki kod.

Aby uzyskać bardziej szczegółowe instrukcje, zapoznaj się z naszym przewodnikiem na temat znajdowania i ukrywania nieużywanych shortcodów w WordPressie.

Bonus: Typowe błędy związane z shortcodami, których należy unikać

Chociaż krótkie kody są przydatne i niezbędne dla wielu stron, użytkownicy często popełniają pewne powszechne błędy podczas pracy z nimi.

Te błędy mogą prowadzić do wadliwego działania, niechlujnego kodu lub słabej wydajności witryny. Oto pięć kluczowych błędów, których należy unikać i jak ich zapobiegać:

• Przeciążanie stron zbyt wieloma krótkimi kodami: Używanie zbyt wielu krótkich kodów na jednej stronie może prowadzić do wolnego ładowania i zagraconego projektu. Dlatego zalecamy ograniczenie użycia krótkich kodów do niezbędnych elementów.
• Nieprawidłowe zagnieżdżanie shortcode'ów: Zagnieżdżone shortcode'y (używanie jednego shortcode'u wewnątrz innego) mogą być trudne i powodować problemy, takie jak niedziałanie jednego shortcode'u lub wyświetlanie nieprawidłowych treści na stronie. Jeśli musisz zagnieżdżać shortcode'y, przetestuj je najpierw, aby upewnić się, że wyświetlają się zgodnie z oczekiwaniami.
• Zapominanie o prawidłowym zamykaniu krótkich kodów: Czasami użytkownicy zapominają o zamknięciu krótkich kodów, co może zepsuć układ posta lub strony. Dlatego musisz zawsze upewnić się, że Twój krótki kod jest prawidłowo otwarty i zamknięty nawiasami. W przypadku krótkich kodów jednorazowego użytku upewnij się, że nie pozostawiasz żadnych dodatkowych spacji ani symboli.
• Używanie shortcode'ów w obszarach nieobsługiwanych: Niektóre obszary WordPressa mogą domyślnie nie obsługiwać shortcode'ów. Próba użycia shortcode'u w takim miejscu może spowodować uszkodzenie lub niewidoczność treści. Zanim wstawisz shortcode'y do widżetów lub pól niestandardowych, sprawdź, czy dany obszar je obsługuje. Często można użyć wtyczki, aby umożliwić działanie shortcode'ów w obszarach nieobsługiwanych.
• Nie testowanie shortcode'ów na urządzeniach mobilnych: Wielu użytkowników zapomina sprawdzić, jak elementy stworzone za pomocą shortcode'ów wyglądają na urządzeniach mobilnych. To, co świetnie wygląda na komputerze stacjonarnym, może się zepsuć lub wyglądać źle na ekranach mobilnych. Zawsze podglądaj swoje strony i posty na różnych urządzeniach, aby upewnić się, że wynik działania shortcode'u jest responsywny.

Unikając tych powszechnych błędów i stosując się do tych wskazówek, możesz mieć płynniejsze doświadczenie podczas korzystania z krótkich kodów na swojej stronie WordPress.

Mamy nadzieję, że te wskazówki pomogły Ci nauczyć się używać shortcode'ów i w pełni je wykorzystać w WordPress. Możesz również zapoznać się z naszym przewodnikiem dla początkujących na temat kopiowania i wklejania w WordPress bez problemów z formatowaniem oraz naszymi wskazówkami ekspertów dotyczącymi opanowania edytora treści WordPress.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.