Bekomme RSS Liste mittels CSS u. sidebar.php nicht formatiert

    Hallo zusammen, frohes neues Jahr erstmal (sofern das am 03.01 noch gilt).

    Ich möchte in meinem Theme eine Box erstellen in der eine kleine Liste wie folgt abgebildet werden soll:

    {Listpunkt kleines Image 1} Text: RSS Feed der Beiträge
    {Listpunkt kleines Image 1} Text: RSS Feed der Kommetare
    {Listpunkt kleines Image 2} Text: E-Mail Newsletter
    {Listpunkt kleines Image 3} Text: Twitter

    Ich bekomme die sidebar nicht so richtig auf meine CSS Formate geklemmt bzw anders rum. Ich habe die folgenden CSS Formate:


    In meiner Sidebar steht das folgende:

    PHP
    <div id="subscribe">
   <ul class="subscribe ul">
             <li class="li.feed-abo"><a href="<?php bloginfo_rss('rss2_url') ?>"><?php _e('Beitr&auml;ge RSS'); ?></a></li>
            <li class="li.feed-abo"><a href="<?php bloginfo_rss('comments_rss2_url') ?>"><?php _e('Kommentare RSS'); ?></a></li>
   </ul>
</div>


    Das Ergebniss ist zu sehen unter von pixeln /&/ paddeln

    Ich finde nicht woran es klemmt?

    • Gerade eben
    • 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

    sorry für das code massaker.

    Soll natürlich images und nicht imgages heißen ;-)

    Leider bringt auch die korrektur des Ordnernamens das gaze nicht dahi wo ich hin will. Ich möchte diesen bereich mit der ID #subscribe ansprechen.

    Für den Aufruf der beiden RSS Teile, Beiträge und Kommentare, möchte ich die ID #subscribe li.feed-abo nutzen in der als Listenzeichen ein RSS Symbol aufgerufen wird.

    Sinngemäß dann das gleiche bei einem E-Mail Newsletter und dem Link zu Twitter.

    Leider "verzahnen" sich sidebar.php und CSS nicht.

    Ah okay. Dann vermute ich mal, es liegt an der falschen Referenzierung der Bilder:

    Code
    background: url(images/feed-icon-16x16.gif)


    Das heißt, relativ zum Stylesheet im Unterverzeichnis "images". Deine Bilder liegen aber eine Ebene höher. Probiers mal so:

    Code
    background: url([COLOR="Red"][B]../[/B][/COLOR]images/feed-icon-16x16.gif)


    Damit wird aus dem Theme-Verzeichnis gesprungen (also in wp-content), und dann in Images. Das sollte klappen.

    ah ja, ich hab in dem hard gecodeten Teil das ganze a'la geschrieben

    Code
    wp-content/images/feed-icon-16x16.gif

    ersetze es aber so peu à peu

    Irgendwie greifen meine ganze schönen formatierungen nicht so wie ich will, ich denke ja es mit css eleganter gelöst werde kann

    So, dann mal weiter. Dir fehlt scheinbar ein wenig grundlegendes Verständnis für CSS, wenn ich mir deine Codes so anschaue. ;-) Fang am besten mal mit den Selektoren an:
    CSS 4 You - The Finest in Stylesheets: Workshop CSS: Teil 3 - Selektoren I

    Dieser Code:

    HTML
    <div id="subscribe">
  <ul>
    <li id="li.feed-abo">
      <a href="http://pixeltunes.de/feed/">Beiträge RSS</a>
    </li>
    <li class="li.feed-abo">
    </li>
  </ul>
</div>


    #subscribe genügt für das meiste schon, den <li> kannst du jeweils noch eine Klasse oder ID geben. Aber dann ohne "li." dabei. Etwa so:

    HTML
    <div id="subscribe">
  <ul>
    <li id="feed-abo">
      <a href="http://pixeltunes.de/feed/">Beiträge RSS</a>
    </li>
    <li class="twitter-link"><!-- content --></li>
    <li class="newsletter-abo"><!-- content --></li>
  </ul>
</div>


    Auf diese greifst du dann in CSS so zu:

    Code
    #subscribe li.feed-abo {}
#subscribe li.twitter-link {}
#subscribe li.newsletter-abo {}


    Wobei das "li." steht für: "HTML Element <li> mit der Klasse ..."

    So, ich hoffe das hilft dir erstmal 1-2 Schritte weiter. ;-)

    ok ok und hey, vielen Dank schon mal.

    Ich bin jetzt mit folgendem Code schon mal auf dem richtigen Weg, zwei Fehler bekomme ich jedoch nicht gefixed:
    sidebar.php

    style.css

    Code
    <div id="subscribe">
  <ul>
    <li class="feed-abo"><a href="http://pixeltunes.de/feed/">Beitr&auml;ge RSS</a></li>
    <li class="feed-abo"><a href="http://pixeltunes.de/comments/feed/">Kommentare RSS</a></li>
    <li class="newsletter-abo">E-Mail Newsletter (folgt asap)</li>
    <li class="twitter"><a href="http://twitter.com/pixeltunes">Twitter</a></li>
  </ul>
</div>


    Unter von pixeln /&/ paddeln sind jetzt die beiden Fehler zu sehen.
    1. Im Unteren Kasten wird das twitter.png nicht angezeigt (liegt auf dem Server, siehe oberer Kasten)
    2. Ich bekomme die Listenpunkte nicht weg, siehe style.css / dort steht list-style-type:none drin???

    Zitat von ilnowa

    1. Im Unteren Kasten wird das twitter.png nicht angezeigt (liegt auf dem Server, siehe oberer Kasten)


    Ist falsch referenziert. Unter dieser URL:

    Code
    http://pixeltunes.de/wp-content/themes/alpen3col//images/twitter.png


    ists jedenfalls nicht zu finden. Die korrekte URL lautet:

    Code
    http://pixeltunes.de/wp-content/images/twitter.png


    Schreib die Eigenschaften mal so:

    Code
    background: url(../images/feed-newsletter.gif)


    (2 Punkte am Anfang, gefolgt von 1 Schrägstrich!)

    Zitat

    2. Ich bekomme die Listenpunkte nicht weg, siehe style.css / dort steht list-style-type:none drin???


    Du gibst dem <div id="subscribe"> die Eigenschaft, dass diese Liste keinen Listenpunkt haben soll. Ein <div> ist aber keine Liste, daher wird die Angabe ignoriert. ;-) So passts:

    Code
    #subscribe ul {
list-style-type:none;
}

Jetzt mitmachen!

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

Benutzerkonto erstellen Anmelden