Bildunterschrift erstellen / CSS spricht nicht an

  • [COLOR=#333333]Hallo allerseits[/COLOR]

    [COLOR=#333333]Danke vorab für Eure Hilfe. Folgendes ist mein Problem:[/COLOR]

    [COLOR=#333333]Das Theme meines Blogs [/COLOR]https://www.velofahrer.ch/[COLOR=#333333] zeigt standardmässig keine Bildunterschriften zu den Artikelbildern. Deshalb möchte ich diese Funktion selbst einbauen. So bin ich - via Child-Theme - vorgegangen:[/COLOR]

    [COLOR=#333333]In die Datei content-single.php habe ich an der passenden Stelle diesen Code eingefügt:[/COLOR]

    [COLOR=#333333]PHP-Code:
    [COLOR=#000000][COLOR=#0000BB]<?php [/COLOR][COLOR=#007700]echo [/COLOR][COLOR=#0000BB]get_post[/COLOR][COLOR=#007700]([/COLOR][COLOR=#0000BB]get_post_thumbnail_id[/COLOR][COLOR=#007700]())->[/COLOR][COLOR=#0000BB]post_excerpt[/COLOR][COLOR=#007700]; [/COLOR][COLOR=#0000BB]?>[/COLOR][/COLOR]
    [/COLOR]
    [COLOR=#333333]Das Ganze habe ich so eingepackt:[/COLOR]

    [COLOR=#333333]PHP-Code:
    [COLOR=#000000]<p class="bildlegende">[COLOR=#0000BB]<?php [/COLOR][COLOR=#007700]echo [/COLOR][COLOR=#0000BB]get_post[/COLOR][COLOR=#007700]([/COLOR][COLOR=#0000BB]get_post_thumbnail_id[/COLOR][COLOR=#007700]())->[/COLOR][COLOR=#0000BB]post_excerpt[/COLOR][COLOR=#007700]; [/COLOR][COLOR=#0000BB]?>[/COLOR]</p>[/COLOR]
    [/COLOR]
    [COLOR=#333333]So sollte ich doch über .bildlegende in der style.css die Bildunterschrift formatieren können, oder?[/COLOR]

    [COLOR=#333333]Der Code dort lautet (mal fürs erste):[/COLOR]

    [COLOR=#333333]Code:
    .bildlegende { font-size: 0.9rem;
    line-height: 1.25;
    font-style: italic;
    padding: 0px 2px 0px; 0px !important;
    }[/COLOR]
    [COLOR=#333333]Ergebnis:[/COLOR]

    [COLOR=#333333]Die Bildunterschrift erscheint, guckt mal hier:[/COLOR]

    https://www.velofahrer.ch/2017/04/ro...hen-des-wolfs/


    [COLOR=#333333]Weiter tut sich aber nichts, d.h. die CSS-Anweisung wirkt sich nicht aus. Woran könnte das liegen? Kann mir jemand weiterhelfen?[/COLOR]

    [COLOR=#333333]Via "Untersuchen" stelle ich zudem fest, dass zwischen Bild und Bildunterschrift ein <a>...</a>-Abstand ist, den es dort eigentlich nicht braucht.[/COLOR]

    [COLOR=#333333]Danke für Eure Hilfe![/COLOR]

    [COLOR=#333333]Grüsse

    Dominik
    [/COLOR]

    • Anzeige

    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

  • Versuche es einmal mit

    CSS
    .bildlegende {
        font-size: 0.9rem !important;
        font-style: italic;
        line-height: 1.25 !important;
        padding: 0 2px;
    }
  • Hallo Edi, das hat geklappt, danke. Weshalb wohl, gibts eine Begründung? Liegt es aran, dass du die !important anders gesetzt hast?

    Ich habe die Werte noch ein wenig verändert, jetzt sieht es so aus:

    https://www.velofahrer.ch/2017/04/rad-un…wei-raeder-hat/

    Zwischen Bild und Legende ist immer noch ein <a>....</a>, von dem ich nicht weiss, woher es kommt. Ich habe das nun mit margin-top:-18px; "weggemacht". Ist das die korrekte Lösung oder eine unsaubere?

    Grüsse

    Dominik

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!