Nowoczesna nawigacja po wpisach na stronie WordPress
Dobrze zorganizowana lista artykułów to ogromna zaleta każdej witryny. Szczególnie wtedy, gdy prezentujemy dużą ilość treści. Dzięki prostemu kodowi możesz wyświetlić wszystkie wpisy blogowe na jednej stronie. Dodatkowo użytkownik może filtrować je według kategorii i przeszukiwać tytuły wpisów. Takie rozwiązanie zapewnia większy komfort dla czytelnika i jednocześnie podnosi jakość UX.
Zastosowanie funkcji AJAX pozwala na dynamiczne filtrowanie zawartości bez przeładowywania strony. To sprawia, że przeglądanie postów staje się szybsze i bardziej płynne. Co ważne, użytkownik widzi wyniki od razu, co zwiększa jego zaangażowanie.
Cały mechanizm działa w pełni responsywnie – wygląda dobrze zarówno na komputerach, jak i na urządzeniach mobilnych. W wersji mobilnej zastosowano akordeon, który ukrywa przyciski kategorii. Dzięki temu nie zajmują one zbyt dużo miejsca na ekranie.
Szybkie filtrowanie dzięki dynamicznemu kodowi
Zamiast sięgać po kolejne wtyczki, warto samodzielnie wdrożyć filtr postów WordPress. Kod, który prezentujemy, oparty jest o prosty shortcode. Dzięki niemu możesz dodać system przeszukiwania i filtrowania w dowolnym miejscu strony.
Shortcode ten wykorzystuje wewnętrzne mechanizmy WordPressa oraz AJAX. Działa płynnie i eliminuje konieczność ładowania kolejnych podstron. Całość została przygotowana tak, by była łatwa w dostosowaniu do indywidualnych potrzeb strony.
Co więcej, styl CSS również uwzględnia różne rozdzielczości ekranu. Dzięki temu nie musisz martwić się o mobilną wersję witryny. Wszystko wygląda spójnie i działa poprawnie.
Dlaczego warto zastosować tę funkcję
Z technicznego punktu widzenia, filtr postów WordPress poprawia dostępność treści. Z punktu widzenia użytkownika natomiast – daje możliwość szybkiego dotarcia do interesujących wpisów. To ważne, szczególnie na stronach z dużą ilością treści blogowych lub poradnikowych.
Nie musisz być programistą, by wdrożyć takie rozwiązanie. Wystarczy, że skopiujesz kod i wkleisz go do pliku functions.php lub do wtyczki Code Snippets. Następnie użyj shortcode’a
Krok po kroku: wdrażamy własny system rezerwacji w WooCommerce – bez płatnych wtyczekZnudziły Cię drogie wtyczki do rezerwacji, które nie dają pełnej kontroli?Chcesz wdrożyć własny system rezerwacji oparty na kodzie i WooCommerce?Dobrze trafiłeś! W tym [...] Autor: Bartosz Świnicki | 08.07.2025 11:27 Dlaczego warto osadzać wideo na stronie? Wideo skutecznie przyciąga uwagę użytkowników i zwiększa ich zaangażowanie. W czasach natłoku informacji format wideo jest bardziej przystępny niż długi tekst. Możliwość obejrzenia filmu bezpośrednio po przeczytaniu artykułu zwiększa [...] Autor: Bartosz Świnicki | 03.07.2025 09:23 Formularz opinii produktu – co to takiego? Formularz opinii produktu to funkcjonalność umożliwiająca klientom dzielenie się opiniami po zakupie. Dzięki temu użytkownicy mogą przekazywać swoje doświadczenia i pomagać innym w podjęciu decyzji zakupowej. Formularz wyświetla [...] Autor: Bartosz Świnicki | 27.06.2025 10:34 Nowoczesna nawigacja po wpisach na stronie WordPress Dobrze zorganizowana lista artykułów to ogromna zaleta każdej witryny. Szczególnie wtedy, gdy prezentujemy dużą ilość treści. Dzięki prostemu kodowi możesz wyświetlić wszystkie wpisy blogowe na jednej stronie. Dodatkowo [...] Autor: Bartosz Świnicki | 15.06.2025 08:47 Wprowadzenie do własnych shortcode’ów Tworzenie własnych shortcode’ów w WooCommerce daje pełną kontrolę nad prezentacją produktów. Możesz wyświetlać tylko te pozycje, które chcesz pokazać klientowi. Dzięki temu tworzysz dopasowane sekcje ofertowe. Nie musisz korzystać z kategorii [...] Autor: Bartosz Świnicki | 12.06.2025 11:24 Autentyczne recenzje tylko od klientów Formularz opinii WooCommerce to narzędzie, które umożliwia zbieranie prawdziwych recenzji produktów. Opinie mogą dodawać wyłącznie użytkownicy, którzy są zalogowani i posiadają historię zakupów. Takie rozwiązanie pozwala wyeliminować fałszywe komentarze, co [...] Autor: Bartosz Świnicki | 13.05.2025 09:40 Prosta i intuicyjna obsługa Wtyczka do fakturowania zaskakuje swoją prostotą od pierwszego uruchomienia. Interfejs użytkownika jest przejrzysty i czytelny, nawet dla początkujących. Wszystkie opcje są dostępne z poziomu panelu WordPress, co znacznie ułatwia zarządzanie. Nie [...] Autor: Bartosz Świnicki | 12.05.2025 09:57 W najnowszej wersji WordPressa pojawiła się innowacyjna funkcja, która może diametralnie odmienić sposób, w jaki użytkownicy doświadczają korzystania ze stron internetowych. Mowa o ładowaniu spekulacyjnym – technologii, która pozwala na niemal natychmiastowe wczytywanie stron poprzez [...] Autor: Bartosz Świnicki | 12.05.2025 08:35 Zarządzanie dużą liczbą produktów w sklepie internetowym bywa czasochłonne, zwłaszcza gdy często pracujesz z wybranym asortymentem. W tym wpisie pokażemy, jak wyświetlić priorytetowe produkty WooCommerce na początku listy produktów w panelu admina, bez ukrywania reszty [...] Autor: Bartosz Świnicki | 07.05.2025 07:54 CSS HTML Wprowadzenie do Interaktywnej Etykiety Formularza Kod przedstawia przykład zastosowania nowoczesnego rozwiązania, jakim jest Interaktywna Etykieta Formularza. To funkcjonalność, która znacząco poprawia użyteczność i estetykę pól formularzy. W tradycyjnych formularzach etykiety są statycznie umieszczone [...] Autor: Bartosz Świnicki | 19.12.2024 09:01 Profesjonalny onepage to klucz do skutecznej prezentacji Twojej marki w internecie. Przejrzystość, estetyka i funkcjonalność to cechy, które przyciągają uwagę użytkowników i budują ich zaufanie. W tym artykule dowiesz się, jakie sekcje powinny znaleźć się [...] Autor: Bartosz Świnicki | 11.12.2024 10:24 Grudzień przynosi świeże propozycje dla profesjonalistów, twórców treści i przedsiębiorców. Minimalistyczny design, funkcjonalność oraz możliwość personalizacji to tylko niektóre z atutów nowych szablonów. 🎙️💼 Dzięki nim łatwo zaprezentujesz swoją ofertę, wyróżnisz podcasty czy zbudujesz zaufanie [...] Autor: Bartosz Świnicki | 09.12.2024 09:59 Jeśli projektowanie stron internetowych, sklepów online czy aplikacji mobilnych jest Twoim zainteresowaniem, musisz przeczytać książkę „Nie każ mi myśleć!„ Steve’a Kruga. Ta kultowa pozycja to absolutny „must-have” dla każdego, kto chce tworzyć strony i produkty [...] Autor: Bartosz Świnicki | 09.12.2024 05:26 WooCommerce to niezwykle elastyczna platforma do zarządzania sklepami internetowymi, pozwalająca na dostosowanie funkcjonalności do indywidualnych potrzeb każdego przedsiębiorcy. Jej możliwości można jeszcze bardziej rozszerzyć dzięki odpowiednim fragmentom kodu oraz szerokiej gamie dostępnych wtyczek. Dzięki temu [...] Autor: Bartosz Świnicki | 08.12.2024 13:06 WooCommerce, jedna z najpopularniejszych platform e-commerce, 11 listopada 2024 roku wypuściła wersję 9.4. Aktualizacja przyniosła istotne zmiany i udoskonalenia, które mają na celu zwiększenie funkcjonalności oraz wygody użytkowania. Poniżej przedstawiamy najważniejsze nowości wprowadzone w tej [...] Autor: Bartosz Świnicki | 21.11.2024 19:52 Miliony witryn w niebezpieczeństwie – problem z WordPressemW ostatnich dniach odkryto lukę w popularnej wtyczce WordPressa, która zagraża milionom stron internetowych na całym świecie. Problem dotyczy dodatku, który ułatwia właścicielom stron zarządzanie ich funkcjami. Niestety, [...] Autor: Bartosz Świnicki | 21.11.2024 08:19 Co daje ten kod? Kod umożliwia wyświetlanie ostatnich postów w WordPress w dowolnym miejscu Twojej strony. Dzięki zastosowaniu shortcode możesz umieścić sekcję z najnowszymi artykułami na stronach, wpisach blogowych lub w widżetach. Jest to doskonałe [...] Autor: Bartosz Świnicki | 20.11.2024 12:22 Prowadzenie bloga WooCommerce w sklepie internetowym to zatem skuteczny sposób na zwiększenie zaangażowania klientów oraz poprawę widoczności w Google. Blog WooCommerce umożliwia również budowanie wizerunku eksperta w branży poprzez dzielenie się wartościowymi treściami związanymi z [...] Autor: Bartosz Świnicki | 20.11.2024 11:36 Stosowanie Zapier z WooCommerce automatyzuje procesy w sklepach internetowych, co skutecznie zwiększa wydajność i znacząco oszczędza czas pracy. Poniżej znajdują się kluczowe korzyści oraz szczegółowe przykłady zastosowań tej praktycznej integracji. Korzyści z zastosowania Zapier z [...] Autor: Bartosz Świnicki | 07.11.2024 14:44 WooCommerce oferuje duże możliwości dostosowania sklepu, w tym dodawanie niestandardowych funkcji. Czasem warto wyświetlić komunikat przed dodaniem produktu do koszyka, aby przekazać klientowi dodatkowe informacje. Można to zrobić, wyświetlając alert dla wybranego produktu WooCommerce w [...] Autor: Bartosz Świnicki | 17.10.2024 09:20 Automatyczne Powiadomienia o Pierwszych Zamówieniach w WooCommerce W dzisiejszym artykule przedstawiam prosty sposób na automatyczne powiadamianie mnie jako administratora sklepu WooCommerce o pierwszym zamówieniu złożonym przez nowego klienta. Dzięki temu będę mógł lepiej zarządzać nowymi [...] Autor: Bartosz Świnicki | 06.06.2024 09:35 Ten kod PHP pozwala na automatyczne ukrywanie produktów, które są niedostępne w magazynie, dzięki czemu sklep WooCommerce jest lepiej zorganizowany. Kod działa poprzez modyfikację głównego zapytania sklepu, aby wyświetlało tylko produkty dostępne w magazynie. Aby [...] Autor: Bartosz Świnicki | 05.06.2024 15:22 Opis Kodu Ten kod pozwala na wyróżnienie nowych produktów w WooCommerce. Dzięki niemu Twoje produkty będą bardziej widoczne dla klientów. Znaczek „Nowość” pojawi się przy produktach, które zostały dodane w ostatnich 30 dniach. Kod dodaje [...] Autor: Bartosz Świnicki | 16.05.2024 16:44 Opis Kodu Ten kod PHP został stworzony specjalnie dla sklepów internetowych WooCommerce dla ułatwienia wyświetlania ukrytych produktów. Po implementacji kodu, produkty o statusie „ukryty” będą wyróżniać się ciemnożółtym tłem w białym tekście. Ta funkcja, ułatwiająca [...] Autor: Bartosz Świnicki | 14.05.2024 08:27
// 1. Shortcode – zachowujemy oryginalną nazwę:
Kategorie
▼
Kategorie: PHP, Woocommerce
Krok po kroku: wdrażamy własny system rezerwacji w WooCommerce – bez płatnych wtyczek Znudziły Cię drogie wtyczki do rezerwacji, które nie dają pełnej kontroli?Chcesz wdrożyć własny system rezerwacji oparty na kodzie i WooCommerce?Dobrze trafiłeś! W [...]
Autor: Bartosz Świnicki | 08.07.2025 11:27
Post #24
Kategorie: PHP, Wordpress
Dlaczego warto osadzać wideo na stronie? Wideo skutecznie przyciąga uwagę użytkowników i zwiększa ich zaangażowanie. W czasach natłoku informacji format wideo jest bardziej przystępny niż długi tekst. Możliwość obejrzenia filmu bezpośrednio po przeczytaniu artykułu zwiększa [...]
Autor: Bartosz Świnicki | 03.07.2025 09:23
Post #23
Kategorie: Shortcode, Woocommerce
Formularz opinii produktu – co to takiego? Formularz opinii produktu to funkcjonalność umożliwiająca klientom dzielenie się opiniami po zakupie. Dzięki temu użytkownicy mogą przekazywać swoje doświadczenia i pomagać innym w podjęciu decyzji zakupowej. Formularz wyświetla [...]
Autor: Bartosz Świnicki | 27.06.2025 10:34
Post #22
Kategorie: Shortcode, Wordpress
Nowoczesna nawigacja po wpisach na stronie WordPress Dobrze zorganizowana lista artykułów to ogromna zaleta każdej witryny. Szczególnie wtedy, gdy prezentujemy dużą ilość treści. Dzięki prostemu kodowi możesz wyświetlić wszystkie wpisy blogowe na jednej stronie. Dodatkowo [...]
Autor: Bartosz Świnicki | 15.06.2025 08:47
Post #21
Kategorie: PHP, Shortcode, Woocommerce, Wordpress
Wprowadzenie do własnych shortcode’ów Tworzenie własnych shortcode’ów w WooCommerce daje pełną kontrolę nad prezentacją produktów. Możesz wyświetlać tylko te pozycje, które chcesz pokazać klientowi. Dzięki temu tworzysz dopasowane sekcje ofertowe. Nie musisz korzystać z kategorii [...]
Autor: Bartosz Świnicki | 12.06.2025 11:24
Post #20
Kategorie: Baza wiedzy, Wordpress
Autentyczne recenzje tylko od klientów Formularz opinii WooCommerce to narzędzie, które umożliwia zbieranie prawdziwych recenzji produktów. Opinie mogą dodawać wyłącznie użytkownicy, którzy są zalogowani i posiadają historię zakupów. Takie rozwiązanie pozwala wyeliminować fałszywe komentarze, co [...]
Autor: Bartosz Świnicki | 13.05.2025 09:40
Post #19
Kategorie: Baza wiedzy
Prosta i intuicyjna obsługa Wtyczka do fakturowania zaskakuje swoją prostotą od pierwszego uruchomienia. Interfejs użytkownika jest przejrzysty i czytelny, nawet dla początkujących. Wszystkie opcje są dostępne z poziomu panelu WordPress, co znacznie ułatwia zarządzanie. Nie [...]
Autor: Bartosz Świnicki | 12.05.2025 09:57
Post #18
Kategorie: Baza wiedzy, Wordpress
W najnowszej wersji WordPressa pojawiła się innowacyjna funkcja, która może diametralnie odmienić sposób, w jaki użytkownicy doświadczają korzystania ze stron internetowych. Mowa o ładowaniu spekulacyjnym – technologii, która pozwala na niemal natychmiastowe wczytywanie stron poprzez [...]
Autor: Bartosz Świnicki | 12.05.2025 08:35
Post #17
Kategorie: PHP, Woocommerce
Zarządzanie dużą liczbą produktów w sklepie internetowym bywa czasochłonne, zwłaszcza gdy często pracujesz z wybranym asortymentem. W tym wpisie pokażemy, jak wyświetlić priorytetowe produkty WooCommerce na początku listy produktów w panelu admina, bez ukrywania reszty [...]
Autor: Bartosz Świnicki | 07.05.2025 07:54
Post #16
Kategorie: CSS
CSS HTML Wprowadzenie do Interaktywnej Etykiety Formularza Kod przedstawia przykład zastosowania nowoczesnego rozwiązania, jakim jest Interaktywna Etykieta Formularza. To funkcjonalność, która znacząco poprawia użyteczność i estetykę pól formularzy. W tradycyjnych formularzach etykiety są statycznie umieszczone [...]
Autor: Bartosz Świnicki | 19.12.2024 09:01
Post #15
Kategorie: Baza wiedzy, Wordpress
Profesjonalny onepage to klucz do skutecznej prezentacji Twojej marki w internecie. Przejrzystość, estetyka i funkcjonalność to cechy, które przyciągają uwagę użytkowników i budują ich zaufanie. W tym artykule dowiesz się, jakie sekcje powinny znaleźć się [...]
Autor: Bartosz Świnicki | 11.12.2024 10:24
Post #14
Kategorie: Baza wiedzy, Wordpress
Grudzień przynosi świeże propozycje dla profesjonalistów, twórców treści i przedsiębiorców. Minimalistyczny design, funkcjonalność oraz możliwość personalizacji to tylko niektóre z atutów nowych szablonów. 🎙️💼 Dzięki nim łatwo zaprezentujesz swoją ofertę, wyróżnisz podcasty czy zbudujesz zaufanie [...]
Autor: Bartosz Świnicki | 09.12.2024 09:59
Post #13
Kategorie: Baza wiedzy
Jeśli projektowanie stron internetowych, sklepów online czy aplikacji mobilnych jest Twoim zainteresowaniem, musisz przeczytać książkę „Nie każ mi myśleć!„ Steve’a Kruga. Ta kultowa pozycja to absolutny „must-have” dla każdego, kto chce tworzyć strony i produkty [...]
Autor: Bartosz Świnicki | 09.12.2024 05:26
Post #12
Kategorie: PHP, Woocommerce
WooCommerce to niezwykle elastyczna platforma do zarządzania sklepami internetowymi, pozwalająca na dostosowanie funkcjonalności do indywidualnych potrzeb każdego przedsiębiorcy. Jej możliwości można jeszcze bardziej rozszerzyć dzięki odpowiednim fragmentom kodu oraz szerokiej gamie dostępnych wtyczek. Dzięki temu [...]
Autor: Bartosz Świnicki | 08.12.2024 13:06
Post #11
Kategorie: Woocommerce
WooCommerce, jedna z najpopularniejszych platform e-commerce, 11 listopada 2024 roku wypuściła wersję 9.4. Aktualizacja przyniosła istotne zmiany i udoskonalenia, które mają na celu zwiększenie funkcjonalności oraz wygody użytkowania. Poniżej przedstawiamy najważniejsze nowości wprowadzone w tej [...]
Autor: Bartosz Świnicki | 21.11.2024 19:52
Post #10
Kategorie: Baza wiedzy, Wordpress
Miliony witryn w niebezpieczeństwie – problem z WordPressemW ostatnich dniach odkryto lukę w popularnej wtyczce WordPressa, która zagraża milionom stron internetowych na całym świecie. Problem dotyczy dodatku, który ułatwia właścicielom stron zarządzanie ich funkcjami. Niestety, [...]
Autor: Bartosz Świnicki | 21.11.2024 08:19
Post #9
Kategorie: Wordpress
Co daje ten kod? Kod umożliwia wyświetlanie ostatnich postów w WordPress w dowolnym miejscu Twojej strony. Dzięki zastosowaniu shortcode możesz umieścić sekcję z najnowszymi artykułami na stronach, wpisach blogowych lub w widżetach. Jest to doskonałe [...]
Autor: Bartosz Świnicki | 20.11.2024 12:22
Post #8
Kategorie: Woocommerce
Prowadzenie bloga WooCommerce w sklepie internetowym to zatem skuteczny sposób na zwiększenie zaangażowania klientów oraz poprawę widoczności w Google. Blog WooCommerce umożliwia również budowanie wizerunku eksperta w branży poprzez dzielenie się wartościowymi treściami związanymi z [...]
Autor: Bartosz Świnicki | 20.11.2024 11:36
Post #7
Kategorie: Woocommerce
Stosowanie Zapier z WooCommerce automatyzuje procesy w sklepach internetowych, co skutecznie zwiększa wydajność i znacząco oszczędza czas pracy. Poniżej znajdują się kluczowe korzyści oraz szczegółowe przykłady zastosowań tej praktycznej integracji. Korzyści z zastosowania Zapier z [...]
Autor: Bartosz Świnicki | 07.11.2024 14:44
Post #6
Kategorie: Woocommerce, Wordpress
WooCommerce oferuje duże możliwości dostosowania sklepu, w tym dodawanie niestandardowych funkcji. Czasem warto wyświetlić komunikat przed dodaniem produktu do koszyka, aby przekazać klientowi dodatkowe informacje. Można to zrobić, wyświetlając alert dla wybranego produktu WooCommerce w [...]
Autor: Bartosz Świnicki | 17.10.2024 09:20
Post #5
Kategorie: PHP, Woocommerce
Automatyczne Powiadomienia o Pierwszych Zamówieniach w WooCommerce W dzisiejszym artykule przedstawiam prosty sposób na automatyczne powiadamianie mnie jako administratora sklepu WooCommerce o pierwszym zamówieniu złożonym przez nowego klienta. Dzięki temu będę mógł lepiej zarządzać nowymi [...]
Autor: Bartosz Świnicki | 06.06.2024 09:35
Post #4
Kategorie: PHP, Woocommerce
Ten kod PHP pozwala na automatyczne ukrywanie produktów, które są niedostępne w magazynie, dzięki czemu sklep WooCommerce jest lepiej zorganizowany. Kod działa poprzez modyfikację głównego zapytania sklepu, aby wyświetlało tylko produkty dostępne w magazynie. Aby [...]
Autor: Bartosz Świnicki | 05.06.2024 15:22
Post #3
Kategorie: PHP, Woocommerce
Opis Kodu Ten kod pozwala na wyróżnienie nowych produktów w WooCommerce. Dzięki niemu Twoje produkty będą bardziej widoczne dla klientów. Znaczek „Nowość” pojawi się przy produktach, które zostały dodane w ostatnich 30 dniach. Kod dodaje [...]
Autor: Bartosz Świnicki | 16.05.2024 16:44
Post #2
Kategorie: PHP, Woocommerce
Opis Kodu Ten kod PHP został stworzony specjalnie dla sklepów internetowych WooCommerce dla ułatwienia wyświetlania ukrytych produktów. Po implementacji kodu, produkty o statusie „ukryty” będą wyróżniać się ciemnożółtym tłem w białym tekście. Ta funkcja, ułatwiająca [...]
Autor: Bartosz Świnicki | 14.05.2024 08:27
Post #1
function custom_recent_posts_shortcode() {
ob_start(); ?>
<!-- NOWE: Filtry kategorii z akordeonem mobilnym -->
<?php
$categories = get_categories(array(
'hide_empty' => true,
'exclude' => array(103)
));
?>
<style>
@media (max-width: 768px) {
#category-accordion-toggle {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 15px;
background: #f1f1f1;
cursor: pointer;
border: 1px solid #ddd;
margin-bottom: 10px;
}
#category-accordion-toggle span {
font-weight: bold;
}
#category-accordion-toggle .arrow {
transition: transform 0.3s;
}
#category-accordion-toggle.active .arrow {
transform: rotate(180deg);
}
#custom-category-buttons {
display: none;
flex-direction: column;
gap: 10px;
margin-bottom: 20px;
}
#custom-category-buttons.show {
display: flex;
}
.category-filter-btn {
width: 100%;
text-align: left;
}
}
@media (min-width: 769px) {
#category-accordion-toggle {
display: none;
}
#custom-category-buttons {
display: flex !important;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 20px;
}
}
</style>
<div id="category-accordion-toggle">
<span>Kategorie</span>
<span class="arrow">▼</span>
</div>
<div id="custom-category-buttons">
<button class="category-filter-btn active" data-category="all" style="padding: 8px 15px;">Wszystkie</button>
<?php foreach ($categories as $category): ?>
<button class="category-filter-btn" data-category="<?php echo esc_attr($category->term_id); ?>" style="padding: 8px 15px;"><?php echo esc_html($category->name); ?></button>
<?php endforeach; ?>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
const toggle = document.getElementById('category-accordion-toggle');
const categoryList = document.getElementById('custom-category-buttons');
if (toggle && categoryList) {
toggle.addEventListener('click', function () {
toggle.classList.toggle('active');
categoryList.classList.toggle('show');
});
}
});
</script>
<div id="custom-post-search" style="margin-bottom: 20px;">
<input type="text" id="search-input" placeholder="Szukaj po tytule..." style="width: 100%; padding: 10px; font-size: 1em;" />
</div>
<div id="custom-post-list">
<?php echo get_custom_all_posts_html(); ?>
</div>
<?php
return ob_get_clean();
}
add_shortcode('ostatnie_wpisy', 'custom_recent_posts_shortcode');
// 2. Funkcja do pobierania WSZYSTKICH wpisów
function get_custom_all_posts_html() {
$args = array(
'post_type' => 'post',
'posts_per_page' => -1,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC'
);
$query = new WP_Query($args);
$total_posts = $query->found_posts;
ob_start();
if ($query->have_posts()) {
$i = 0;
while ($query->have_posts()) {
$query->the_post();
$i++;
$post_number = $total_posts - $i + 1;
?>
<div class="custom-post-item" style="display: flex; margin-bottom: 20px;">
<div class="custom-post-image" style="width: 40%; margin-right: 20px;">
<?php the_post_thumbnail('full'); ?>
</div>
<div class="custom-post-content" style="width: 60%;">
<?php
$categories = get_the_category();
if (!empty($categories)) {
echo '<div class="kategoria-wpisu" style="font-size: 0.85em; color: #777; margin-bottom: 5px;">Kategoria:<b> ' . esc_html($categories[0]->name) . '</b></div>';
}
?>
<div class="tytul-wpisu">
<h2 style="margin-top: 0;"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
</div>
<div class="streszczenie-wpisu">
<p><?php echo wp_trim_words(get_the_excerpt(), 25, ' [...]'); ?></p>
</div>
<div class="data-i-godzina-wpisu">
<p style="font-size: 0.9em; color: #555;">Autor: <?php the_author(); ?> | <?php the_time('d.m.Y H:i'); ?></p>
</div>
<div class="czytajwiecej" style="margin-top: 10px;">
<a class="czytaj-wiecej" href="<?php the_permalink(); ?>" style="display: inline-block;">Czytaj więcej</a>
<span style="margin-left: 10px; font-size: 0.9em; color: #999;">Post #<?php echo $post_number; ?></span>
</div>
</div>
</div>
<?php }
}
wp_reset_postdata();
return ob_get_clean();
}
// 3. JavaScript – live search + filtr kategorii
function custom_search_script() {
?>
<script>
document.addEventListener('DOMContentLoaded', function() {
const searchInput = document.getElementById('search-input');
const filterPosts = (categoryId, searchText) => {
const data = new FormData();
data.append('action', 'filter_posts');
data.append('category_id', categoryId);
data.append('search_text', searchText);
fetch('<?php echo admin_url("admin-ajax.php"); ?>', {
method: 'POST',
body: data
})
.then(response => response.text())
.then(html => {
document.getElementById('custom-post-list').innerHTML = html;
});
};
document.querySelectorAll('.category-filter-btn').forEach(button => {
button.addEventListener('click', function() {
document.querySelectorAll('.category-filter-btn').forEach(btn => btn.classList.remove('active'));
this.classList.add('active');
const catId = this.dataset.category;
const searchText = searchInput?.value || '';
filterPosts(catId, searchText);
});
});
if (searchInput) {
searchInput.addEventListener('input', function() {
const activeBtn = document.querySelector('.category-filter-btn.active');
const categoryId = activeBtn ? activeBtn.dataset.category : 'all';
filterPosts(categoryId, this.value);
});
}
});
</script>
<?php
}
add_action('wp_footer', 'custom_search_script');
// 4. AJAX backend handler (filtrowanie postów)
add_action('wp_ajax_filter_posts', 'ajax_filter_posts_callback');
add_action('wp_ajax_nopriv_filter_posts', 'ajax_filter_posts_callback');
function ajax_filter_posts_callback() {
$cat_id = sanitize_text_field($_POST['category_id']);
$search = sanitize_text_field($_POST['search_text']);
$args = array(
'post_type' => 'post',
'posts_per_page' => -1,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
);
if ($cat_id && $cat_id !== 'all') {
$args['cat'] = intval($cat_id);
}
if (!empty($search)) {
$args['s'] = $search;
}
$query = new WP_Query($args);
$total = $query->found_posts;
$i = 0;
if ($query->have_posts()) {
ob_start();
while ($query->have_posts()) {
$query->the_post();
$i++;
$post_number = $total - $i + 1;
?>
<div class="custom-post-item" style="display: flex; margin-bottom: 20px;">
<div class="custom-post-image" style="width: 40%; margin-right: 20px;">
<?php the_post_thumbnail('full'); ?>
</div>
<div class="custom-post-content" style="width: 60%;">
<?php
$categories = get_the_category();
if (!empty($categories)) {
echo '<div class="kategoria-wpisu" style="font-size: 0.85em; color: #777; margin-bottom: 5px;">Kategoria:<b> ' . esc_html($categories[0]->name) . '</b></div>';
}
?>
<div class="tytul-wpisu">
<h2 style="margin-top: 0;"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
</div>
<div class="streszczenie-wpisu">
<p><?php echo wp_trim_words(get_the_excerpt(), 25, ' [...]'); ?></p>
</div>
<div class="data-i-godzina-wpisu">
<p style="font-size: 0.9em; color: #555;">Autor: <?php the_author(); ?> | <?php the_time('d.m.Y H:i'); ?></p>
</div>
<div class="czytajwiecej" style="margin-top: 10px;">
<a class="czytaj-wiecej" href="<?php the_permalink(); ?>" style="display: inline-block;">Czytaj więcej</a>
<span style="margin-left: 10px; font-size: 0.9em; color: #999;">Post #<?php echo $post_number; ?></span>
</div>
</div>
</div>
<?php
}
wp_reset_postdata();
echo ob_get_clean();
} else {
echo '<p>Brak wyników.</p>';
}
wp_die();
}
