Haben Sie jemals gewollt, dass AffiliateWP genau Ihren Bedürfnissen entspricht, z. B. durch Hinzufügen einer persönlichen Nachricht zum Affiliate-Dashboard oder durch Anpassung einiger Designelemente? Wenn Sie sich fragen, wie Sie AffiliateWP ohne Risiko für Ihre Website anpassen können, führt Sie diese Anleitung Schritt für Schritt durch.
Mit Hilfe des WPCode-Plugins zeigen wir Ihnen, wie Sie benutzerdefinierte Code-Snippets schnell, sicher und an einem Ort hinzufügen.
Warum benutzerdefinierten Code hinzufügen?
Das Hinzufügen von benutzerdefiniertem Code kann Ihnen helfen, AffiliateWP wirklich zu Ihrem eigenen zu machen. Egal, ob Sie das Styling ändern oder den Affiliate-Bereich personalisieren möchten, benutzerdefinierte Code-Snippets können diese Änderungen zum Leben erwecken. Das direkte Ändern von Code in den Plugin-Dateien kann jedoch riskant sein – wenn etwas schief geht, könnte Ihre Website unzugänglich werden.
Stattdessen verwenden wir einen sichereren Ansatz, indem wir mit einem Code-Verwaltungstool namens WPCode arbeiten, das Ihre Hauptdateien unberührt lässt und es Ihnen ermöglicht, benutzerdefinierte Code-Snippets von einem Ort aus zu organisieren und zu aktivieren.
Verwenden des WPCode-Plugins zum Hinzufügen der Code-Snippets
Der erste Schritt ist die Installation des WPCode-Plugins, mit dem Sie Code-Snippets einfach hinzufügen und verwalten können, ohne Kerndateien bearbeiten zu müssen. WPCode bietet Ihnen einen dedizierten Bereich zum sicheren Hinzufügen von benutzerdefiniertem Code, sodass Sie alle Ihre Änderungen an einem Ort organisieren können.
Um WPCode einzurichten, gehen Sie zu Ihrem WordPress-Dashboard, navigieren Sie zu Plugins > Neu hinzufügen und suchen Sie nach WPCode.
Sobald Sie es gefunden haben, klicken Sie auf Jetzt installieren und dann auf Aktivieren.
Nach der Aktivierung des Plugins sehen Sie einen neuen Menüpunkt namens Code-Snippets im Dashboard.
Hier fügen Sie Ihren benutzerdefinierten Code hinzu und verwalten ihn.
Hinzufügen von PHP-Code
Versuchen wir, unser erstes benutzerdefiniertes Code-Snippet zu AffiliateWP hinzuzufügen. Stellen Sie sich vor, Sie möchten am oberen Rand des Affiliate-Bereichs eine Willkommensüberschrift hinzufügen, um ihn für Ihre Affiliates ansprechender zu gestalten. Dies ist ein perfekter Anwendungsfall für ein PHP-Snippet.
Gehen Sie in Ihrem WordPress-Dashboard zu Code-Snippets und wählen Sie Neu hinzufügen. Da Sie das Plugin gerade installiert haben, wird Ihre Liste leer sein.
Sie gelangen zu einem Bildschirm, auf dem Sie Ihren benutzerdefinierten Code eingeben können. Hier können Sie entweder Ihren eigenen eindeutigen Code hinzufügen oder ein Code-Snippet aus der vorgefertigten Bibliothek auswählen. Fahren Sie mit der Maus über Eigene benutzerdefinierte Codes hinzufügen (Neues Snippet) und klicken Sie auf die Schaltfläche Benutzerdefiniertes Snippet hinzufügen.
Sie gelangen zu einem Bildschirm, auf dem Sie den Code-Typ auswählen können. Hier müssen Sie PHP-Snippet auswählen.
Beginnen Sie damit, Ihrem Snippet einen Titel zu geben, z. B. Benutzerdefinierte Überschrift für den Affiliate-Bereich – etwas, das Ihnen hilft, sich daran zu erinnern, was dieses Snippet tut.
Fügen Sie im Codefeld den folgenden PHP-Code ein:
// Add a custom heading to the Affiliate Area
function custom_affiliate_area_heading() {
echo '<h2>Welcome to Your Affiliate Dashboard!</h2>';
}
add_action('affwp_affiliate_dashboard_top', 'custom_affiliate_area_heading');
Dieses Code-Snippet fügt eine Überschrift hinzu, die am oberen Rand des Affiliate-Bereichs erscheint. Um sicherzustellen, dass das Snippet automatisch ausgeführt wird, wählen Sie unter Einfügeoptionen Automatisch einfügen.
Wenn Sie fertig sind, schalten Sie das Menü Aktiv ein und klicken Sie auf die Schaltfläche Snippet speichern.
Wenn Sie nun zum Affiliate-Bereich wechseln, sehen Sie die benutzerdefinierte Überschrift, die Ihre Affiliates begrüßt.
Hinzufügen von benutzerdefiniertem CSS
Nehmen wir nun an, Sie möchten die Farbe der Navigations-Tabs im Affiliate-Bereich anpassen. Hierfür verwenden wir einen CSS-Snippet, der die Textfarbe ändert, sodass die Navigations-Tabs besser zum Design Ihrer Website passen.
Klicken Sie im WPCode-Dashboard auf Neu hinzufügen, um einen weiteren Snippet zu erstellen, und wählen Sie CSS-Snippet aus.
Fügen Sie in das Codefeld den folgenden CSS-Code ein:
/* Change text color for all navigation tabs */
#affwp-affiliate-dashboard-tabs li.affwp-affiliate-dashboard-tab a {
color: #333; /* Default text color */
}
/* Change text color for the active tab */
#affwp-affiliate-dashboard-tabs li.affwp-affiliate-dashboard-tab.active a {
color: #3498db; /* Active tab text color */
font-weight: bold; /* Optional: make active tab text bold */
}
Stellen Sie dann die Einfügung auf Automatische Einfügung ein, damit der Stil für alle Navigations-Tabs von AffiliateWP angewendet wird. Speichern und aktivieren Sie Ihren Snippet, und die Navigationslinks im Affiliate-Bereich werden nun mit den aktualisierten Farben angezeigt.
Das war's! Sie haben nun sowohl PHP- als auch CSS-Snippets hinzugefügt, um AffiliateWP anzupassen und eine persönlichere Erfahrung für Ihre Affiliates zu schaffen. Die Verwendung von WPCode macht diesen Prozess sicher und einfach, sodass Sie sich keine Sorgen über die Bearbeitung von Kerndateien oder die Verwaltung komplexer Codeänderungen machen müssen.