Springe zum Hauptinhalt

Wie ein einzigartigen Stil für die verschiedenen Kategorien von Wordpress geben

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 701.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Möchten Sie Kategorien in WordPress anders kategorisieren?

Die meisten WordPress-Themes verwenden für alle Kategorienarchivseiten das gleiche Design. Wenn Sie jedoch über eine inhaltsreiche Website verfügen, können Sie jede Kategorie auf unterschiedliche Weise anzeigen, um ihr Potenzial zu maximieren.

In diesem Tutorial zeigen wir Ihnen, wie Sie Kategorien in Ihrem WordPress-Blog unterschiedlich anzeigen können.

Ohne weiteres laden wir Sie ein, unsere Liste zu entdecken. Aber zuerst, wenn Sie WordPress noch nie installiert haben, finden Sie es heraus Wie man ein Wordpress-Blog 7 Schritte für die Installation et Wie finden, zu installieren und ein Wordpress-Theme auf Ihrem Blog aktivieren 

Dann zurück zu warum wir hier sind.

Warum Kategorien in WordPress einen anderen Stil geben?

Wie bereits erwähnt, verwenden die meisten WordPress-Designs für jede Kategoriearchivseite dieselbe Vorlage. Dies liegt daran, dass Entwickler von WordPress-Themes nicht wissen, wie Sie Kategorien auf Ihrer Website verwenden werden.

Lesen Sie auch: Wie nur RSS-Inhalte angezeigt werden an die Abonnenten auf Wordpress

Wenn Sie jedoch eine inhaltsreiche Website haben, Ändern des Layouts einer Archivseite Kategorie kann einen dramatischen Einfluss darauf haben, wie Benutzer mit dem Inhalt dieser Seite interagieren.

Wenn Sie beispielsweise eine Nachrichten- oder Zeitschriftenwebsite verwalten, können Sie lokale Ankündigungen in der Kategorie "Lokale Nachrichten" anzeigen. Sie können Wetterinformationen anzeigen, die beliebtesten Geschichten in dieser Kategorie anzeigen usw.

Das heißt, lassen Sie uns sehen, wie Sie einzelne Kategorien in WordPress einfach anpassen können.

Wie man Kategorien einen Stil verleiht

Es gibt verschiedene Möglichkeiten, Kategorien in WordPress zu kategorisieren. Wir zeigen Ihnen zwei verschiedene Methoden, um den Kategorien einen anderen Stil zu verleihen, und Sie können die Methoden auswählen, die Ihren Anforderungen und Ihrem Kenntnisstand am besten entsprechen.

Verwenden einer einzelnen Kategorievorlage für ein WordPress-Thema

WordPress-Themes folgen einer Standardvorlagenhierarchie. Entsprechend dem Namen einer Vorlagendatei kann WordPress automatisch die richtige Vorlage zum Anzeigen einer Seite auswählen.

Beispielsweise wird nach der Datei category.php gesucht, um Kategoriearchivseiten anzuzeigen.

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

WordPress ermöglicht es Ihnen auch Modelle erstellen für einzelne Kategorien. Angenommen, Sie möchten die Kategorie "ApfelAnders. Sie können dies tun, indem Sie Ihrem WordPress-Theme eine neue Vorlagendatei hinzufügen und diese benennen Kategorie-apple.php.

Stellen Sie über einen FTP-Client eine Verbindung zu Ihrer WordPress-Website her und navigieren Sie zu / Wp-content / themes / your-Thema / und erstellen Sie eine neue Datei mit dem Namen category-apple.php. Denken Sie daran, "Apple" durch den Namen Ihrer Kategorie zu ersetzen.

Fügen Sie eine neue WordPress-Kategorie hinzu

Sie können die Datei verwenden " category.php Von Ihrem WordPress-Theme als Ausgangspunkt. Bearbeiten und kopieren Sie einfach den gesamten Inhalt. Benennen Sie nun Ihre neue Datei in " Kategorie-apple.php Und fügen Sie den Code ein.

Anschließend können Sie Änderungen an Ihrem individuellen Kategoriemodell vornehmen. Sie können eine andere Seitenleiste für diese Kategorie erstellen und verwenden. Machen Sie daraus eine Seite mit voller Breite. Fügen Sie eine Willkommensnachricht hinzu oder was auch immer du willst.

Geben Sie Kategorien mithilfe von CSS-Code einen Stil

WordPress fügt automatisch CSS-Klassen zu verschiedenen Elementen auf Ihrer Website hinzu. Dazu gehören sowohl die Body-Klasse als auch die Publikationsklasse.

Wenn Sie beispielsweise eine Kategoriearchivseite anzeigen und dann das Inspect-Tool verwenden, werden Sie die CSS-Klassen "Kategorien" und den Namen der Kategorie im Tag "body" bemerken.

Body WordPress Kategorie Tag

Sie können diese CSS-Klasse für jede einzelne Kategorie von verwenden Hinzufügen von benutzerdefiniertem CSS.

Hier ist ein Beispiel für CSS, das Sie als Ausgangspunkt verwenden können.

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

body.category-Apfel {background-color: #EEE background: url ( „http://example.com/wp-content/uploads/2017/background.jpg‚) no-repeat befestigt ist; color: #FFFFFF; } .category-apple .Site {background: #232323; } .category-Apfel {color: #CCCCCC; }

Vergessen Sie nicht, den Kategorienamen in der CSS-Klasse durch den Namen Ihrer Kategorie zu ändern.

Bearbeiten einer WordPress-CSS-Codekategorie

Jetzt können Sie WordPress benutzerdefinierten CSS-Code hinzufügen. Wenn Sie jedoch eine Premium-Lösung benötigen, um einen benutzerdefinierten CSS-Code hinzuzufügen, bieten wir nachfolgend zwei Premium-WordPress-Plugins an, die Ihnen bei dieser Aufgabe helfen.

1. Easy Custom JS und CSS 

Dieses Premium-WordPress-Plugin ist ein leistungsstarker CSS- und Javascript-Code-Editor, mit dem Sie diese zu jedem Abschnitt Ihrer Website hinzufügen können. Damit können Sie Ihre Anpassungen auch nach einem größeren Update Ihres WordPress-Themas beibehalten. Einfache benutzerdefinierte js und css zusätzliche Anpassung WordPress-Plugin

Sie haben die Möglichkeit, den Verwendungsbereich Ihres personalisierten Codes einzuschränken. Beispielsweise können Sie Ihren Code nur für einen Artikel im Videoformat verwenden.

Lesen Sie unsere Artikel auf So fordern Sie die Annahme der Nutzungsbedingungen für WordPress

Oder Sie können Ihren Code auf ein bestimmtes WordPress-Thema beschränken. Das ist praktisch, wenn Sie gerade Themen für Ihr WordPress-Blog ändern.

Download | Demo | Web-Hosting

2. Benutzerdefiniertes JavaScript & CSS in Seiten!

Dank dieses WordPress-Plugins haben Sie die Möglichkeit, hinzuzufügen CSS-Stile und benutzerdefiniertes JavaScript auf bestimmten Seiten. Außerdem können Sie Regeln für mehrere Seiten definieren. Auf diese Weise können Sie vordefinierte oder eindeutige Stile für bestimmte Abschnitte festlegen.

Benutzerdefinierte Javascript CSS in Seiten WordPress Plugin e1558356028853

Wie bei jeder anderen Funktion, die von diesem WordPress-Plugin angeboten wird, können Sie problemlos verschiedene Skripte auf verschiedenen Seiten Ihrer Website einfügen.

Download | Demo | Web-Hosting

Empfohlene Ressourcen

Informieren Sie sich über andere empfohlene Ressourcen, die Sie beim Erstellen und Verwalten Ihrer Website unterstützen.

Erstellen Sie einfach Ihren Online-Shop

Laden Sie kostenlos WooCommerce herunter, die besten E-Commerce-Plugins, um Ihre physischen und digitalen Produkte auf WordPress zu verkaufen. [Empfohlen]

Fazit

Hier ! Das war's für dieses Tutorial. Ich hoffe, Sie können damit benutzerdefinierten CSS-Code in WordPress hinzufügen. Zögere nicht zu Teile diesen Artikel mit deinen Freunden in deinen bevorzugten sozialen Netzwerken

Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung.

Wenn Sie Vorschläge oder Anmerkungen haben, hinterlassen Sie diese in unserer Rubrik commentaires.

...  

Dieser Artikel enthält Kommentare 2

  1. Guten Tag!
    Bitte sehen Sie, ob Sie mir helfen können, weil ich meinen Kopf rauche
    Ich mache einen Online-Shop mit Divi und Woocommerce und habe ein Problem, weil ich die Kategorieseite nicht anpassen kann.
    Ich übergebe den Link, damit Sie sehen können:
    https://chachocarp.com/product-category/los-mas-vendidos
    Was ich ändern möchte, ist:
    1. Ich habe 24 Produkte in dieser Kategorie und anstatt sie auf zwei Seiten von 12 Produkten zu zeigen, werden sie auf drei Seiten von 9, 9 und 6 angezeigt, und es ist fatal klar.
    2. Ich habe die Hover-Konfiguration nicht beibehalten, als ich mit der Maus über die Produkte gefahren bin. Ich möchte, dass die Transparenz blau ist und die Buchstaben "Produkt als naranaja ansehen" wie im Store-Modul der Hauptseite.
    3. Ich möchte, dass in der linken Seitenleiste alle Kategorien und Unterkategorien angezeigt werden.
    Wie hat er das gemacht?
    Merci pour ton aide

    1. Hallo Miguel,

      Bitte stellen Sie die Frage zu einem Artikel über WooCommerce oder Divi. Und ich werde Ihnen gerne antworten. 😉

Hinterlassen Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
7 Aktien
Aktie4
tweet1
Registrieren2