Gleicher Text nach wp_list_pages

El-Q

Hallo miteinander

Ich designe gerade mein ersten WP-Theme und komme leider nicht mehr weiter. Ich möchte, dass nach jedem Seiten-Titel bei wp_list_pages ein Text kommt. Genauer gesagt, möchte ich, dass jeweils ganz rechts eines <li>-Tags ein Pfeil kommt: >

Bsp:
Seite 1 >
Seite 2 >
Seite 3 >

Ich dachte, dass ich den Pfeil dann mit CSS nach rechts verschiebe:

Code

span.arrow {
	float: right;
	width: 13px;
}

... und folglich müsste nach jedem Seiten-Titel folgendes angehängt werden:

Zitat

<img src="blabla/arrow.png" alt="arrow" />

Mit <?php wp_list_pages('title_li=', ' ', '<img src="blabla/arrow.png" alt="arrow" />'); ?> funktioniert es auch nicht...

Ich hoffe, ihr habt eine Idee oder sogar eine besseren Lösungs-Ansatz.

Danke und freundliche Grüsse

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Alphawolf

Versuch mal das:

PHP

<?php wp_list_pages('title_li=&link_after=<span class="arrow"><img src="blabla/arrow.png" alt="arrow" /></span>'); ?>

spickzettel

Ich würde das als Hintergrundbild zu den Links machen, das scheint mir die sauberere Lösung.

El-Q

Danke Alphawolf für Deine Hilfe. Irgendwie schluckt die Funktion nicht. Mit einem Wort bzw. Zeichen geht's.

spickzettel
Ich würde gerne versuchen Deinen Vorschlag auszuprobieren. Leider stehe ich ein bisschen auf dem Schlauch, wie das immer ganz rechts vom <li> ist.

Danke nochmals.

Alphawolf

Ganz grob könnte das mit CSS so aussehen:

HTML

li.page_item a {
  background: url(blabla/arrow.png) center right no-repeat;
}

El-Q

Cool, danke. Hab's mal versucht, jedoch wird das Bild nicht am Ende des <li> positioniert, sondern am Ende des Textes... Es wird also nur die Breite des Inhaltes berücksichtigt.
Mir ist das so wichtig, da ich gerade versuche ein PDA-optimiertes Theme zu erstellen.

Danke

Alphawolf

Achso, ich dachte, der Pfeil soll am Ende des Links stehen, abhängig von der Länge des Links, also so:

Code

Link 123 >
Link 2 >
Link wasweißich >

Du willst es also so?

Code

Link 123  >
Link 1    >
Link lala >

Dann probier es damit.

PHP

li.page_item {
  background: url(blabla/arrow.png) center right no-repeat;
}

El-Q

Hi

Danke Alphawolf, genau so habe ich es mir gedacht!
Nun habe ich auch das "page_item" kennen gelernt ;)

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Gleicher Text nach wp_list_pages

Jetzt mitmachen!