Title: Theme Virtue Problem mit Darstellung Widget „Kategorien“ Last modified: 1. November 2016 --- # Theme Virtue Problem mit Darstellung Widget „Kategorien“ * Gelöst [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/) * Hallo zusammen, meine Seite [http://www.meer-sehn.de](http://www.meer-sehn.de) habe ich jetzt mit dem Theme „Virtue“ erstellt (hier: [http://themes.kadencethemes.com/virtue/](http://themes.kadencethemes.com/virtue/)). Ich komme auch sehr gut damit zurecht, ein Child-Theme ist angelegt und aktiviert. Das Virtue-Theme bringt eine ganze Reihe an eleganten, einfachen Einstellungen mit sich und es ist entspannend damit zu arbeiten. Ein Problem habe ich dennoch: * Bei den Widgets wie Archiv, Kommentaren oder auch den Autor, Erstellt von, etc. ist das kleine Symbol auf der linken Seite vor dem Wort. Somit passt dies gut in eine Zeile. Bei dem Widget **Kategorien** wird das kleine Symbol **rechts hinter dem Wort** angezeigt und durch die Anzeige wieviel Beiträge enthalten sind, rutscht dies dann in die nächste Zeile runter. Hier schauen: [http://www.meer-sehn.de/blog/](http://www.meer-sehn.de/blog/)( rechte Seite, betitelt mit „Themen“ bei mir). * Wo und wie finde ich die Einstellung, dass ich dies ändern kann? Wenn ich mit dem Firefox Entwicklerwerkzeug die Stelle suche, kann ich erkennen, dass ich „:: after“ durch „::before“ ersetzen muss/sollte. Nur, wo finde ich das? Muss ich dies dann im Bereich „Benutzerdefiniertes CSS“ programmieren? * Ich hoffe, jemand kann mir hier helfen 🙂 danke schon mal, Viele Grüße, newbie11wp Ansicht von 12 Antworten – 1 bis 12 (von insgesamt 12) * Moderator [Bego Mario Garde](https://de.wordpress.org/support/users/pixolin/) * (@pixolin) * Moderator (nicht mehr aktiv) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33592) * Du warst schon sehr nah dran: Du kannst die Formatierung durch eigenes CSS anpassen. Dazu gibst du folgende CSS-Regel unter Design > Anpassen > Additional CSS ein: * ``` .widget_categories .widget-inner .cat-item a:before { font-family: FontAwesome; font-style: normal; speak: none; font-weight: 400; content: "\f07c"; float: left; -webkit-font-smoothing: antialiased; padding-right: 10px; } .widget_categories .widget-inner .cat-item a:after { content: none; } ``` * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33600) * Hallo Bego Mario Garde, vielen Dank für die Hilfe, das funktioniert schon sehr gut. Das Symbol ist vor dem Text – juhuuuuu -, nur leider ist die Zahl in Klammer noch in der nächsten Zeile unten. Wie bekomme ich die jetzt noch hoch? * Wenn ich das ganze jetzt mit dem weiter unten stehenden „Archiv“ vergleiche, dann müsste das Symbol noch etwas weiter nach vorne gerückt werden. Da liegt das Symbol vor dem hellgrauen Strich der sich unten drunter befindet und das Wort beginnt mit Anfang Strich. * Wie gesagt, vielen Dank für die Hilfe 🙂 * Viele Grüße, newbie11wp * Moderator [Bego Mario Garde](https://de.wordpress.org/support/users/pixolin/) * (@pixolin) * Moderator (nicht mehr aktiv) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33602) * ``` .product-categories li a, .sidebar .product-categories li a, .sidebar .widget_categories li a { display: inline; } .widget_categories .widget-inner .cat-item a:before { font-family: FontAwesome; font-style: normal; speak: none; font-weight: 400; content: "\f07c"; float: left; -webkit-font-smoothing: antialiased; padding: 0 0 0 0px; margin: 0 0 0 -10px; } .widget_categories .widget-inner .cat-item a:after { content: none; } ``` * Eine gute Einführung in CSS findest du z.B. beim [Mozilla Developer Network](https://developer.mozilla.org/de/docs/Web/CSS). * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33671) * Hallo Bego Mario Garde, vielen Dank. Das sieht noch besser aus 🙂 aber es ist noch nicht ganz genau. Ich habe mir mal das Theme runtergeladen und mit dem PS Pad Editor angeschaut. In der Datei virtue-unmin.css habe ich den folgenden Code für die **Kategorie ** gefunden: * ``` .widget_categories .widget-inner .cat-item a:after { font-family: 'FontAwesome'; font-style: normal; speak: none; font-weight: normal; content: "\f07c"; float: right; -webkit-font-smoothing: antialiased; } ``` * Der Code für z.B. das **Archiv **lautet: * ``` .widget_archive .widget-inner li a:before { font-family: 'FontAwesome'; font-style: normal; speak: none; font-weight: normal; content: "\f187"; float: left; margin-left: -20px; -webkit-font-smoothing: antialiased; } ``` * Da steht auch „li“ vor dem „before“. Meine Sache ist nämlich, dass durch deinen Code sich zwar das Symbol nach vorne orientiert, aber das Layout nicht übereinstimmt, sprich der graue Unterstrich endet beim letzten Buchstaben bzw. Klammer, das Symbol ist nicht ganz vorne, die Zeilenhöhe ist nicht die selbe (habe ich gelöst indem ich einfach die Codezeile „line-height: 30px;“ unter „display: inline;“ kopiert habe)… * Ich frag mich, was ich wegen diesem „.cat-item“ machen kann. Da hängt noch eine andere Programmierung mit drin. Beim „Archiv“ (siehe oben) steht das ja gar nicht. * Bin schon selber am rumprobieren, aber nichts hat bisher gewirkt. * Danke für weitere Ideen und Code-Schnippsel 🙂 Ihr seid echt super 😀 * Viele Grüße von newbie11wp - Diese Antwort wurde vor 9 Jahren, 11 Monaten von [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) geändert. * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33673) * Was mir aufgefallen ist: * – Beim **Archiv **ist das Symbol unabhängig vom danach stehenden Text * – Bei der **Kategorie **ist das Symbol mit dem Text eine Einheit * Vielleicht hat das auch damit zu tun. Das Symbol beim Archiv hat eine ganz andere Abhängigkeit… Ich weiß nicht, ob das richtig ausdrücke… * Grüße 🙂 newbie11wp * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 11 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-33946) * Hallo zusammen, * leider bin ich immer noch nicht weiter gekommen 🙁 ich probiere und teste, aber die „Kategorien“ sehen nicht wie das „Archiv“ aus… * Jemand noch eine Idee??? * Hier meine Website mit dem „Problem“: [http://www.meer-sehn.de/blog/](http://www.meer-sehn.de/blog/) * Danke für jede Idee und Hilfe. * Viele Grüße, newbie11wp * Moderator [Torsten Landsiedel](https://de.wordpress.org/support/users/zodiac1978/) * (@zodiac1978) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34252) * Mit Inline-Block wäre zumindest schon mal die Zahl in der richtigen Zeile: * ``` .product-categories li a, .sidebar .product-categories li a, .sidebar .widget_categories li a { display: inline-block; } ``` * Ob das mit dem Rahmen für dich passt, kannst du ja schauen … * Gruß, Torsten * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34368) * Hallo Torsten, * danke, die Zahl ist jetzt oben… Der Unterstrich in Grau hört aber jetzt nach der Zahl auf und geht nicht bis zum Schluss. * Was ist denn der Unterschied zwischen dem „Archiv“ und der „Kategorie“?? * Das ist ja echt eine schwierige Aufgabe 🙂 alles was ich so versuche bringt entweder die Zahl nach unten und den grau Strich auf ganze Länge oder die Zahl nach oben und der Graustrich entdet hinter der Zahl. Auch ist das Logo an die Zeile gebunden und nicht extra (wie beim Archiv)… * Grüße und danke für eure Hilfe – Thema und Problem ist noch nicht gelöst. newbie11wp * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34392) * Salut zusammen, * ok, ich stelle meine Frage um (vielleicht will ich ja auch das Schwieriger Problem bisher unbedingt lösen): * Wie kann ich auf meinem Blog, rechts in der Sidebar, die grauen Striche bei „ das rudel“, „links“ und „archiv“ hinter dem letzten Buchstaben enden lassen?? Also so, dass dieser nicht bis ganz zum Ende durchgeht??? * Ich schaffe es nicht, den grauen Strich der „themen“ bis zum Schluss durchzuziehen– jetzt würde ich die anderen gerne daran anpassen… * Weiß jemand einen Rat (für das eine oder andere)??? * Vielen lieben Dank 🙂 newbie11wp - Diese Antwort wurde vor 9 Jahren, 10 Monaten von [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) geändert. * [Flower33](https://de.wordpress.org/support/users/flower33/) * (@flower33) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34395) * Hallo newbie11wp, * „Strich“ bei allen bis zum Schluss fände ich persönlich besser. Heißt also: Bei den Links die `border-bottom` entfernen, stattdessen durchgängig dem Listenelement die `border-bottom` zuweisen. Probier mal, obs mit nachfolgendem Code klappt. * ``` .product-categories li a, .sidebar .product-categories li a, .sidebar .widget_categories li a { border:none; } .product-categories li, .sidebar .product-categories li, .sidebar .widget_categories li { border-bottom: solid 1px #eee; border-color: rgba(0, 0, 0, 0.05); line-height: 20px; } ``` - Diese Antwort wurde vor 9 Jahren, 10 Monaten von [Flower33](https://de.wordpress.org/support/users/flower33/) geändert. - Diese Antwort wurde vor 9 Jahren, 10 Monaten von [Flower33](https://de.wordpress.org/support/users/flower33/) geändert. * Themenersteller [newbie11wp](https://de.wordpress.org/support/users/newbie11wp/) * (@newbie11wp) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34410) * Hallo Flower33, * ja, „Strich“ bis zum Ende finde ich auch besser, leider hat es bisher nicht so gut funktioniert… * Juhuuuuu – super – danke, das hat geklappt. Meinen herzlichsten Dank 🙂 * Grüße, newbie11wp * [Flower33](https://de.wordpress.org/support/users/flower33/) * (@flower33) * [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34412) * Freut mich, dass es geklappt hat, [@newbie11wp](https://de.wordpress.org/support/users/newbie11wp/), danke für deine Rückmeldung! Ansicht von 12 Antworten – 1 bis 12 (von insgesamt 12) Das Thema „Theme Virtue Problem mit Darstellung Widget „Kategorien““ ist für neue Antworten geschlossen. ## Schlagwörter * [Virtue Kategorie Symbol](https://de.wordpress.org/support/topic-tag/virtue-kategorie-symbol/) * In: [Themes](https://de.wordpress.org/support/forum/themes/) * 12 Antworten * 4 Teilnehmer * Letzte Antwort von: [Flower33](https://de.wordpress.org/support/users/flower33/) * Letzte Aktivität: [vor 9 Jahren, 10 Monaten](https://de.wordpress.org/support/topic/theme-virtue-problem-mit-darstellung-widget-kategorien/#post-34412) * Status: gelöst ## Themen ### Beliebteste Themen ### Unbeantwortete Themen ### Nicht-Support-Themen ### Gelöste Themen ### Ungelöste Themen ### Alle Themen