Jak dodać miniaturki do odnośników do poprzednich i następnych wpisów w WordPressie?

Chcesz wyświetlać miniaturki z odnośnikami do poprzednich i następnych wpisów w WordPressie?

Na dole każdego wpisu WordPress wyświetla odnośniki do poprzednich i następnych wpisów, co ułatwia nawigację. Dodanie miniaturek do tych odnośników sprawi, że będą one bardziej atrakcyjne dla twoich czytelników.

W tym artykule pokażemy, jak używać miniaturek z odnośnikami do poprzednich i następnych wpisów w WordPressie.

Po co wyświetlać miniaturki z odnośnikami do poprzedniego i następnego wpisu?

Twój blog WordPress oferuje kilka przydatnych funkcji, które pomagają odwiedzającym znaleźć nowe treści i poruszać się po witrynie.

Funkcje te obejmują menu nawigacyjne, pasek wyszukiwania i widżet archiwum wpisów.

Kolejna pomocna funkcja nawigacji znajduje się na dole każdego wpisu na blogu WordPress. Znajdują się tam odnośniki do poprzednich i następnych wpisów na twojej witrynie.

Takie odnośniki budują zaangażowanie użytkowników, ponieważ gdy twoi odwiedzający skończą czytać jeden wpis na blogu, będą szukać czegoś innego do przeczytania. Jednak odnośniki będą wyglądać bardziej interaktywnie, jeśli dodasz miniaturki.

Jest to również dobry sposób na zwrócenie uwagi na twoje najskuteczniejsze wpisy na blogu. Na przykład, możesz mieć treści filarowe, które już teraz generują mnóstwo ruchu i przekształcają tych czytelników w subskrybentów e-maili. Dodanie miniaturek z odnośnikami do wpisów tylko pomoże ci zbudować listę mailingową i rozwinąć twoją małą firmę.

Mając to na uwadze, przyjrzyjmy się, jak dodać miniaturki do odnośników do poprzedniego i następnego wpisu w WordPress.

Używanie miniaturek z odnośnikami do poprzednich i następnych wpisów w WordPressie

Aby dodać miniaturki do odnośników do poprzedniego i następnego wpisu, musisz dodać kod do plików twojego motywu WordPress. Jeśli nie robiłeś tego wcześniej, zapoznaj się z naszym przewodnikiem na temat kopiowania i wklejania kodu w WordPress.

Dodawanie kodu za pomocą WPCode

Pierwszym krokiem jest dodanie poniższego fragmentu kodu za pomocą wtyczki takiej jak WPCode.

WPCode to najlepsza wtyczka do fragmentów kodu, która umożliwia dodawanie kodu bez niszczenia twojej witryny. Zawiera również wiele gotowych szablonów, dzięki czemu nie trzeba pisać kodu od zera.

Aby rozpocząć, należy zainstalować i włączyć wtyczkę WPCode. Aby uzyskać więcej informacji, zapoznaj się z naszym artykułem na temat instalacji wtyczki WordPress.

Stamtąd przejdź do strony Fragmenty kodu „ + Fragmenty kodu. Następnie kliknij „Utwórz nowy”.

Zostaniesz przeniesiony do biblioteki fragmentów kodu, gdzie znajdziesz mnóstwo gotowych szablonów do wyboru.

W sekcji „Dodaj własny kod” kliknij „Użyj fragmentu kodu”.

Nadaj fragmentowi kodu nazwę, aby móc się do niego później odwołać.

Następnie skopiuj poniższy kod do edytora tekstu WPCode. Upewnij się, że jako rodzaj kodu wybrano „Fragment kodu PHP”.

function wpb_posts_nav(){
    $next_post = get_next_post();
    $prev_post = get_previous_post();
    
    if ( $next_post || $prev_post ) : ?>
    
        <div class="wpb-posts-nav">
            <div>
                <?php if ( ! empty( $prev_post ) ) : ?>
                    <a href="<?php echo get_permalink( $prev_post ); ?>">
                        <div>
                            <div class="wpb-posts-nav__thumbnail wpb-posts-nav__prev">
                                <?php echo get_the_post_thumbnail( $prev_post, [ 100, 100 ] ); ?>
                            </div>
                        </div>
                        <div>
                            <strong>
                                <svg viewBox="0 0 24 24" width="24" height="24"><path d="M13.775,18.707,8.482,13.414a2,2,0,0,1,0-2.828l5.293-5.293,1.414,1.414L9.9,12l5.293,5.293Z"/></svg>
                                <?php _e( 'Previous article', 'textdomain' ) ?>
                            </strong>
                            <h4><?php echo get_the_title( $prev_post ); ?></h4>
                        </div>
                    </a>
                <?php endif; ?>
            </div>
            <div>
                <?php if ( ! empty( $next_post ) ) : ?>
                    <a href="<?php echo get_permalink( $next_post ); ?>">
                        <div>
                            <strong>
                                <?php _e( 'Next article', 'textdomain' ) ?>
                                <svg viewBox="0 0 24 24" width="24" height="24"><path d="M10.811,18.707,9.4,17.293,14.689,12,9.4,6.707l1.415-1.414L16.1,10.586a2,2,0,0,1,0,2.828Z"/></svg>
                            </strong>
                            <h4><?php echo get_the_title( $next_post ); ?></h4>
                        </div>
                        <div>
                            <div class="wpb-posts-nav__thumbnail wpb-posts-nav__next">
                                <?php echo get_the_post_thumbnail( $next_post, [ 100, 100 ] ); ?>
                            </div>
                        </div>
                    </a>
                <?php endif; ?>
            </div>
        </div> <!-- .wpb-posts-nav -->
    
    <?php endif;
}

Następnie przełącz przycisk z „Nieaktywny” na „Aktywny”.

Spowoduje to uruchomienie fragmentu kodu.

Następnie wystarczy nacisnąć przycisk „Aktualizuj”.

Teraz musimy wrócić do fragmentu kodu „ +Dodaj fragment kodu na stronie.

Ponownie, pod opcją „Dodaj swój własny kod” wybierz „Użyj fragmentu kodu”.

Nadaj fragmentowi kodu nazwę, aby móc się do niego później odwołać.

Następnie skopiuj poniższy kod do edytora tekstu WPCode. Upewnij się, że jako rodzaj kodu wybrano „Fragment kodu PHP”.

wpb_posts_nav();

Ten kod mówi WordPressowi, gdzie pokazać nawigację z wyróżniającym się obrazkiem.

Następnie przewiń w dół do sekcji Wstaw. Musisz kliknąć menu rozwijane obok opcji Lokalizacja.

Z tego miejsca przejdź do opcji Specyficzne dla strony i wybierz opcję Wstaw po wpisie. W ten sposób miniaturki pojawią się prawidłowo obok odnośników.

Na koniec włącz fragment kodu, przełączając przycisk „Aktywny”.

Następnie kliknij „Aktualizuj”.

Po zapisaniu twoich zmian, funkcja ta może być wywołana z szablonu, w którym chcesz wyświetlić odnośniki do poprzedniego i następnego wpisu z miniaturkami.

Teraz, gdy zobaczysz wpis na twojej witrynie internetowej, zobaczysz, że poprzednie i następne odnośniki na dole wpisu mają teraz miniaturki.

Teraz, gdy zobaczysz wpis na twojej witrynie internetowej, zobaczysz, że poprzednie i następne odnośniki na dole wpisu mają teraz miniaturki.

Aby dowiedzieć się, jak dodać miniaturki do wpisów, zapoznaj się z naszym przewodnikiem na temat dodawania wyróżniających się obrazków lub miniaturek wpisów w WordPress.

Alternatywa: Wyświetlanie popularnych wpisów z miniaturkami

Innym sposobem na zaangażowanie twoich czytelników po przeczytaniu wpisu jest wyświetlenie listy popularnych wpisów po każdym artykule. Dzięki temu czytelnicy będą mogli zapoznać się z twoją najlepszą treścią, a nie tylko z poprzednimi i kolejnymi opublikowanymi artykułami.

Twoje popularne wpisy zawierają najbardziej skuteczne treści. Wyświetlanie ich odwiedzającym zbuduje zaufanie, poprawi dowód społeczny i sprawi, że odwiedzający pozostaną na twojej witrynie internetowej dłużej.

Sprawdzając pierwszą metodę w naszym przewodniku na temat wyświetlania wpisów według zobaczonych odsłon w WordPressie, dowiesz się, jak łatwo jest dodać popularne wpisy za pomocą wtyczki MonsterInsights.

Widżet popularnych wpisów MonsterInsights oferuje szeroką gamę atrakcyjnych motywów i wiele opcji konfiguratora.

Warto również zapoznać się z naszym przewodnikiem na temat dodawania własnych widżetów after-post w WordPressie, z którego dowiesz się, jak dodawać różnego rodzaju treści na końcu każdego wpisu na blogu.

Mamy nadzieję, że ten poradnik pomógł ci nauczyć się używać miniaturek z odnośnikami do poprzednich i następnych wpisów w WordPress. Możesz również dowiedzieć się, jak przyspieszyć działanie WordPressa lub sprawdzić naszą listę najlepszych wtyczek do mediów społecznościowych dla WordPressa.

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.