Der vollständige Leitfaden zum Entfernen von Elementor-Upsells

Elementor ist ein leistungsstarkes Tool zum Erstellen von WordPress-Websites, aber sein Dashboard kann manchmal mit Upsell-Anzeigen und Aufforderungen zu Premium-Funktionen überladen wirken.

In dieser Anleitung zeige ich Ihnen, wie Sie die meisten Elementor-Upsells entfernen, sodass Sie eine übersichtlichere, fokussiertere Benutzeroberfläche genießen können. Sie können der Anleitung folgen und den Code zu Ihrem benutzerdefinierten Theme hinzufügen oder die Anleitung überspringen und stattdessen das praktische Plugin auf Github herunterladen.

Bevor wir näher darauf eingehen, ist es erwähnenswert, dass der einfachste Weg, Elementor-Upsells zu entfernen, darin besteht, Elementor Pro zu kaufen und zu installieren (Affiliate-Link). Dies empfehle ich, allerdings benötigt nicht jeder die zusätzlichen Funktionen oder ist möglicherweise nicht bereit, die laufenden Kosten zu tragen.

Dieser Leitfaden mag kontrovers sein, aber hier ist meine Meinung: Obwohl ich die Notwendigkeit, Einnahmen zu generieren, voll und ganz verstehe, glaube ich, dass Benutzer bei der Erstellung eines kostenlosen GPL-Produkts die Freiheit haben sollten, es nach eigenem Ermessen zu ändern.

Auch hier empfehle ich Ihnen dringend, Elementor Pro zu kaufen, um auf jede Menge tolle Funktionen und Support von den Entwicklern zuzugreifen. Schauen Sie sich den Artikel Elementor Free vs Pro auf ihrer Website an, um zu sehen, was Sie verpassen würden!

Wenn Sie nicht bereit für ein Upgrade auf die Pro-Version sind und lieber bei der kostenlosen Version bleiben möchten, lesen Sie weiter, um zu erfahren, wie Sie die Upsells entfernen, um eine übersichtlichere Benutzeroberfläche zu erhalten.

TL;DR Fahren Sie mit dem endgültigen Code und Plugin fort

WPEX_Remove_Elementor_Upsells PHP-Klasse

Beginnen wir mit der Erstellung unserer PHP-Klasse, die den gesamten Code enthält, der zum Entfernen von Elementor-Upsells erforderlich ist. Dadurch bleibt alles aufgeräumt und strukturiert. Am Ende des Kurses führen wir eine Prüfung durch, um sicherzustellen, dass bei einem Upgrade auf Elementor Pro nichts entfernt oder beeinträchtigt wird.

Hier ist unsere Starterklasse:

/** * Remove Elementor Upsells. */class WPEX_Remove_Elementor_Upsells {/** * Constructor. */public function __construct() {if ( did_action( 'elementor/loaded' ) ) {$this->register_actions();} else {add_action( 'elementor/loaded', [ $this, 'register_actions' ] );}}/** * Register our main class actions. */public function register_actions(): void {if ( is_callable( 'ElementorUtils::has_pro' ) && ElementorUtils::has_pro() ) {return; // bail early if we are using Elementor Pro.}// We will do things here...}}new WPEX_Remove_Elementor_Upsells;

Im weiteren Verlauf dieses Tutorials werden wir dieser Klasse neuen Code hinzufügen. Es ist wichtig, genau mitzumachen, da das Überspringen eines Abschnitts dazu führen kann, dass Sie wichtigen Code verpassen. Alternativ können Sie bis zum Ende springen und die vollständige Endversion der Klasse kopieren.

Entfernen Sie „nutzlose“ Admin-Panels und Links

Elementor registriert verschiedene Admin-Seiten, die eigentlich nichts anderes tun, als eine Landingpage anzuzeigen, um auf die Pro-Version zu aktualisieren. Wir werden zunächst die folgenden nutzlosen Seiten entfernen:

• Einsendungen
• Benutzerdefinierte Schriftarten
• Benutzerdefinierte Symbole
• Benutzerdefinierter Code
• Add-ons (Bonus)

Wir beginnen mit der Aktualisierung unserer register_actions Methode, die so aussieht:

/** * Register our main class actions. */public function register_actions(): void {if ( is_callable( 'ElementorUtils::has_pro' ) && ElementorUtils::has_pro() ) {return; // bail early if we are using Elementor Pro.}add_action( 'elementor/admin/menu/after_register', [ $this, 'remove_admin_pages' ], PHP_INT_MAX, 2 );}

Dann fügen wir eine neue Methode mit dem Namen hinzu remove_admin_pages zur Klasse, die so aussehen wird:

/** * Remove admin pages. */public function remove_admin_pages( $menu_manager, $hooks ): void {$pages_to_remove = [];$subpages_to_remove = [];if ( is_callable( [ $menu_manager, 'get_all' ] ) ) {foreach ( (array) $menu_manager->get_all() as $item_slug => $item ) {if ( isset( $hooks[ $item_slug ] )&& is_object( $item )&& ( is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Item' )|| is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Template' ))) {$parent_slug = is_callable( [ $item, 'get_parent_slug' ] ) ? $item->get_parent_slug() : '';if ( ! empty( $parent_slug ) ) {$subpages_to_remove[] = [ $parent_slug, $item_slug ];} else {$pages_to_remove[] = $hooks[ $item_slug ];}}}}foreach ( $pages_to_remove as $menu_slug ) {remove_menu_page( $menu_slug );}foreach ( $subpages_to_remove as $subpage ) {remove_submenu_page( $subpage[0], $subpage[1] );}}

Dieser Code-Hook nutzt einen praktischen Hook im Elementor-Plugin, sodass wir dynamisch eine Liste der Admin-Werbeseiten abrufen und diese entfernen können.

Entfernen Sie die Add-ons-Seite

Das Bedienfeld „Add-ons“ kann für Sie hilfreich sein, da es eine Möglichkeit bietet, mit Elementor kompatible Plugins zu finden, die zusätzliche Funktionen bieten. Bei den meisten davon handelt es sich jedoch um Premium-Add-ons (auch bekannt als Anzeigen), und wenn Sie Elementor Pro nicht kaufen, werden Sie wahrscheinlich auch nichts auf dieser Seite kaufen.

Um die Add-Ons-Seite zu entfernen, aktualisieren wir die vorherige Methode, um eine zusätzliche Prüfung wie folgt durchzuführen:

/** * Remove admin pages. */public function remove_admin_pages( $menu_manager, $hooks ): void {$pages_to_remove = [];$subpages_to_remove = [];if ( is_callable( [ $menu_manager, 'get_all' ] ) ) {foreach ( (array) $menu_manager->get_all() as $item_slug => $item ) {if ( isset( $hooks[ $item_slug ] )&& is_object( $item )&& ( is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Item' )|| is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Template' )|| 'elementor-apps' === $item_slug)) {$parent_slug = is_callable( [ $item, 'get_parent_slug' ] ) ? $item->get_parent_slug() : '';if ( ! empty( $parent_slug ) ) {$subpages_to_remove[] = [ $parent_slug, $item_slug ];} else {$pages_to_remove[] = $hooks[ $item_slug ];}}}}foreach ( $pages_to_remove as $menu_slug ) {remove_menu_page( $menu_slug );}foreach ( $subpages_to_remove as $subpage ) {remove_submenu_page( $subpage[0], $subpage[1] );}}

Wir haben nur hinzugefügt || 'elementor-apps' === $item_slug zur if-Anweisung.

Entfernen Sie den Link „Add-ons“ aus der Admin-Leiste

Wenn Sie die Add-ons-Seite entfernt haben, möchten Sie auch den Link in der oberen Leiste von Elementor entfernen. Andernfalls wird jemand, der auf den Link klickt, zu einer WordPress-Fehlerseite mit der Warnung „Der Zugriff auf diese Seite ist Ihnen leider nicht gestattet.“ weitergeleitet.

Um die Sache einfach zu halten, fügen wir im WP-Administrator ein kleines benutzerdefiniertes CSS hinzu, das den Link mithilfe des modernen :has()-Selektors verbirgt.

Fügen wir dem eine neue Aktion hinzu register_actions Methode wie diese:

add_action( 'elementor/admin_top_bar/before_enqueue_scripts', [ $this, 'admin_top_bar_css' ] );

Fügen Sie dann das Neue hinzu add_css_to_elementor_admin Methode an das Ende der Klasse:

/** * Add inline CSS to modify the Elementor admin top bar. */public function admin_top_bar_css(): void {wp_add_inline_style('elementor-admin-top-bar','.e-admin-top-bar__bar-button:has(.eicon-integration){display:none!important;}');}

Dieser Code nutzt die Tatsache, dass Elementor jedem Link in der oberen Leiste bestimmte Schriftartensymbole zuweist, sodass wir die Schaltfläche direkt anhand ihres Symbols ansprechen können.

Das Verfolgen von Empfehlungen verstößt gegen die WordPress-Plugin-Richtlinien

Zum Zeitpunkt der Veröffentlichung dieses Artikels verwendet Elementor getarnte Links auf seiner Add-ons-Seite. Wenn Sie also mit der Maus über die Schaltfläche „Los geht’s“ eines Premium-Add-ons fahren, sehen Sie eine Ziel-URL, die etwa so aussieht:

https://go.elementor.com/{product-slug}/

Wenn Sie auf diesen Link klicken und ihn aufrufen, werden Sie möglicherweise zu einem Empfehlungslink weitergeleitet. Dies könnte einen Verstoß gegen die folgende Plugin-Richtlinie darstellen. Wie in diesem Abschnitt erwähnt:

Werbung innerhalb des WordPress-Dashboards sollte vermieden werden, da sie im Allgemeinen wirkungslos ist. Denken Sie daran: Das Verfolgen von Verweisen über diese Anzeigen ist nicht gestattet.

Fairerweise muss man sagen, dass Elementor gute Arbeit leistet, wenn es darum geht, offenzulegen, wie die Add-ons-Seite auf der eigenen Website funktioniert. Aber um den WordPress-Richtlinien vollständig zu entsprechen (soweit ich weiß), sollten sie auf Seiten ihrer Website verlinken und keine getarnten Links direkt im WP-Adminbereich hinzufügen.

Bonus: Entfernen Sie den Link „Hilfe anfordern“.

Wenn Sie das auch entfernen möchten Holen Sie sich Hilfe Link können Sie zu unserem zurückkehren remove_admin_pages Methode und fügen Sie unten Folgendes hinzu:

remove_submenu_page( 'elementor', 'go_knowledge_base_site' );

Entfernen Sie den rosafarbenen Upgrade-Button in der Seitenleiste

Als Nächstes entfernen wir die rosa Upgrade-Schaltfläche, die in der Admin-Seitenleiste unter dem übergeordneten Menüelement Elementor angezeigt wird. Dies ist technisch gesehen eine Admin-Seite (beim Besuch wird eine Weiterleitung verwendet, um zu deren Website zu gelangen), daher kann sie auch mit entfernt werden remove_submenu_page.

Fügen Sie den folgenden Code unten (unten) hinzu remove_admin_pages Verfahren.

remove_submenu_page( 'elementor', 'go_elementor_pro' );

Entfernen Sie den Link „Jetzt aktualisieren“ in der Admin-Leiste

Der Link „Jetzt upgraden“ oben auf den Elementor-Seiten ist der am wenigsten aufdringliche Upsell und meiner Meinung nach auf eine recht elegante Art und Weise umgesetzt. Obwohl ich persönlich denke, dass dies völlig akzeptabel ist, geht es in diesem Leitfaden darum, Ihnen dabei zu helfen, so viele Upsells wie möglich zu entfernen. Deshalb zeige ich Ihnen, wie Sie diese loswerden.

Wenn Sie mitmachen und sich entschieden haben, die Add-On-Seite auszublenden, haben Sie sie bereits hinzugefügt admin_top_bar_css Methode zu Ihrer Klasse. Wir werden diese Methode aktualisieren, um auch das auszublenden Jetzt upgraden Taste. Wenn nicht, scrollen Sie bitte nach oben und befolgen Sie die Schritte in diesem Abschnitt.

Das haben Sie aktualisiert admin_top_bar_css Methode sollte so aussehen:

public function admin_top_bar_css(): void {$target_icon_classes = ['.eicon-integration', // Add-ons'.eicon-upgrade-crown', // Upgrade now];wp_add_inline_style('elementor-admin-top-bar','.e-admin-top-bar__bar-button:has(' . implode( ',', $target_icon_classes ) . '){display:none!important;}');}

Entfernen Sie den Theme Builder

Als kostenloser Benutzer haben Sie keinen Zugriff auf den Theme Builder. Das ist übrigens großartig und wird in unserem Total-Theme vollständig unterstützt. Meiner Meinung nach ist Theme Builder der Hauptgrund, warum Sie die Pro-Version kaufen sollten. Damit können Sie wirklich eine individuelle Website erstellen.

Wie Sie wahrscheinlich vermutet haben, handelt es sich auch hier um eine „Dummy“-Administratorseite, genau wie der rosafarbene Upgrade-Button, den wir zuvor entfernt haben. Zum Entfernen kehren wir zu unserem zurück remove_admin_pages Methode und fügen Sie unten Folgendes hinzu:

if ( ! isset( $_GET['page'] ) || 'elementor-app' !== $_GET['page'] ) {    remove_submenu_page( 'edit.php?post_type=elementor_library', 'elementor-app' );}

Wir fügen eine zusätzliche Prüfung für den Seitenabfrageparameter hinzu, andernfalls funktioniert die Kit-Bibliothek nicht mehr.

Entfernen Sie den Link zur Admin-Leiste des Theme Builders

Elementor fügt außerdem den Theme Builder-Link zur Benutzeradministrationsleiste hinzu, wenn Sie angemeldet sind und das Frontend Ihrer Website anzeigen. Wenn Sie auf den Link klicken, gelangen Sie wiederum auf eine nutzlose Seite, auf der Sie als kostenloser Benutzer nichts tun können.

Um diesen Link zu entfernen, müssen wir zunächst eine neue Aktion zu unserem hinzufügen register_actions Verfahren:

add_filter( 'elementor/frontend/admin_bar/settings', [ $this, 'modify_admin_bar' ], PHP_INT_MAX );

Dann fügen wir ein neues hinzu modify_admin_bar Methode zum Ende unserer Klasse:

/** * Modify the admin bar links. */public function modify_admin_bar( $admin_bar_config ) {if ( isset( $admin_bar_config['elementor_edit_page']['children'] )&& is_array( $admin_bar_config['elementor_edit_page']['children'] )) {foreach ( $admin_bar_config['elementor_edit_page']['children'] as $k => $item ) {if ( isset( $item['id'] ) && 'elementor_app_site_editor' === $item['id'] ) {unset( $admin_bar_config['elementor_edit_page']['children'][ $k ] );break;}}}return $admin_bar_config;}

Entfernen Sie die Promo-Widgets

Elementor fügt auch alle Premium-Widgets in die Widget-Auswahl ein, was ich als eine Möglichkeit verstehe, den Benutzern zu zeigen, was ihnen fehlt. Allerdings kann die Suche nach Elementen ziemlich frustrierend sein, insbesondere wenn Sie ein Add-on-Plugin verwenden, das Widgets mit ähnlichen Namen registriert.

Wir „entfernen“ die Widgets technisch gesehen nicht, daher geben wir keinen Speicher frei. Wir können sie jedoch mithilfe von CSS ausblenden, um die Seitenleiste aufzuräumen und zu verschlanken.

Fügen wir unserer Aktion eine neue Aktion hinzu register_actions Verfahren:

add_action( 'elementor/editor/after_enqueue_styles', [ $this, 'editor_css' ] );

Dann fügen wir am Ende unserer Klasse die folgende Methode hinzu:

/** * Hide elements in the editor. */public function editor_css(): void {wp_add_inline_style('elementor-editor','.elementor-element-wrapper.elementor-element--promotion,#elementor-panel-category-pro-elements,#elementor-panel-category-theme-elements,#elementor-panel-category-theme-elements-single,#elementor-panel-category-woocommerce-elements{display:none!important;}');}

Entfernen Sie das Editor-Sidebar-Banner

Um das Banner aus der Seitenleiste im Elementor-Widget zu entfernen, verwenden wir ebenfalls CSS. Wir aktualisieren einfach das vorherige Snippet, um ein paar weitere Elemente wie dieses aufzunehmen:

/** * Hide elements in the editor. */public function editor_css(): void {wp_add_inline_style('elementor-editor','.elementor-element-wrapper.elementor-element--promotion,#elementor-panel-category-pro-elements,#elementor-panel-category-theme-elements,#elementor-panel-category-theme-elements-single,#elementor-panel-category-woocommerce-elements,#elementor-panel-get-pro-elements,#elementor-panel-get-pro-elements-sticky{display:none!important;}');}

Entfernen Sie die Editor-Benachrichtigungsleiste

Wenn Sie den Elementor-Editor zum ersten Mal öffnen, werden Sie unten auf der Seite eine Leiste mit Haftnotizen bemerken. Denn natürlich kann es nie zu viele Upsells geben, oder? Sie können zwar auf das „X“ klicken, um es zu schließen, dies verhindert jedoch nicht, dass es später (14 Tage später) wieder angezeigt wird.

Kehren wir zu unserem zurück editor_css Methode und update Es soll den Klassennamen e-notice-bar enthalten. Hier ist die aktualisierte Methode.

/** * Hide elements in the editor. */public function editor_css(): void {wp_add_inline_style('elementor-editor','.e-notice-bar,.elementor-element-wrapper.elementor-element--promotion,#elementor-panel-category-pro-elements,#elementor-panel-category-theme-elements,#elementor-panel-category-theme-elements-single,#elementor-panel-category-woocommerce-elements,#elementor-panel-get-pro-elements,#elementor-panel-get-pro-elements-sticky{display:none!important;}');}

Entfernen Sie das Admin-Dashboard-Widget

Ich bin sicher, dass viele von Ihnen, wie ich, nicht viel Zeit auf der WordPress-Dashboard-Seite verbringen. Dies ist jedoch die Standardseite, zu der Sie weitergeleitet werden, wenn Sie sich bei WordPress anmelden. Elementor fügt dem Dashboard ein benutzerdefiniertes Widget hinzu, das einen Feed aus seinem Blog anzeigt – und natürlich weitere Upsell-Links!

Fügen Sie Folgendes hinzu register_actions Verfahren:

add_action( 'wp_dashboard_setup', [ $this, 'remove_dashboard_widget' ], PHP_INT_MAX );

Fügen Sie dann am Ende der Klasse die folgende Methode hinzu:

/** * Remove dashboard widget. */public function remove_dashboard_widget(): void {remove_meta_box( 'e-dashboard-overview', 'dashboard', 'normal' );}

Endgültiger Code und Plugin

Wenn Sie mitgemacht haben, sollten Sie jetzt eine Klasse haben, die so aussieht:

/** * Remove Elementor Upsells. */class WPEX_Remove_Elementor_Upsells {/** * Constructor. */public function __construct() {if ( did_action( 'elementor/loaded' ) ) {$this->register_actions();} else {add_action( 'elementor/loaded', [ $this, 'register_actions' ] );}}/** * Register our main class actions. */public function register_actions(): void {if ( is_callable( 'ElementorUtils::has_pro' ) && ElementorUtils::has_pro() ) {return; // bail early if we are using Elementor Pro.}add_action( 'elementor/admin/menu/after_register', [ $this, 'remove_admin_pages' ], PHP_INT_MAX, 2 );add_action( 'elementor/admin_top_bar/before_enqueue_scripts', [ $this, 'admin_top_bar_css' ] );add_filter( 'elementor/frontend/admin_bar/settings', [ $this, 'modify_admin_bar' ], PHP_INT_MAX );add_action( 'elementor/editor/after_enqueue_styles', [ $this, 'editor_css' ] );add_action( 'wp_dashboard_setup', [ $this, 'remove_dashboard_widget' ], PHP_INT_MAX );}/** * Remove admin pages. */public function remove_admin_pages( $menu_manager, $hooks ): void {$pages_to_remove = [];$subpages_to_remove = [];if ( is_callable( [ $menu_manager, 'get_all' ] ) ) {foreach ( (array) $menu_manager->get_all() as $item_slug => $item ) {if ( isset( $hooks[ $item_slug ] )&& is_object( $item )&& ( is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Item' )|| is_subclass_of( $item, 'ElementorModulesPromotionsAdminMenuItemsBase_Promotion_Template' )|| 'elementor-apps' === $item_slug)) {$parent_slug = is_callable( [ $item, 'get_parent_slug' ] ) ? $item->get_parent_slug() : '';if ( ! empty( $parent_slug ) ) {$subpages_to_remove[] = [ $parent_slug, $item_slug ];} else {$pages_to_remove[] = $hooks[ $item_slug ];}}}}foreach ( $pages_to_remove as $menu_slug ) {remove_menu_page( $menu_slug );}foreach ( $subpages_to_remove as $subpage ) {remove_submenu_page( $subpage[0], $subpage[1] );}remove_submenu_page( 'elementor', 'go_knowledge_base_site' );remove_submenu_page( 'elementor', 'go_elementor_pro' );if ( ! isset( $_GET['page'] ) || 'elementor-app' !== $_GET['page'] ) {remove_submenu_page( 'edit.php?post_type=elementor_library', 'elementor-app' );}}/** * Add inline CSS to modify the Elementor admin top bar. */public function admin_top_bar_css(): void {$target_icon_classes = ['.eicon-integration', // Add-ons'.eicon-upgrade-crown', // Upgrade now];wp_add_inline_style('elementor-admin-top-bar','.e-admin-top-bar__bar-button:has(' . implode( ',', $target_icon_classes ) . '){display:none!important;}');}/** * Hide elements in the editor. */public function editor_css(): void {wp_add_inline_style('elementor-editor','.e-notice-bar,.elementor-element-wrapper.elementor-element--promotion,#elementor-panel-category-pro-elements,#elementor-panel-category-theme-elements,#elementor-panel-category-theme-elements-single,#elementor-panel-category-woocommerce-elements,#elementor-panel-get-pro-elements,#elementor-panel-get-pro-elements-sticky{display:none!important;}');}/** * Remove dashboard widget. */public function remove_dashboard_widget(): void {remove_meta_box( 'e-dashboard-overview', 'dashboard', 'normal' );}}new WPEX_Remove_Elementor_Upsells;

Sie können diesen Code kopieren und in die Datei „functions.php“ Ihres benutzerdefinierten übergeordneten oder untergeordneten WordPress-Themes einfügen oder ihn über eine eigene Datei einbinden (empfohlen).

Alternativ habe ich den Code in ein praktisches Plugin eingefügt, das Sie von Github herunterladen und auf Ihrer Website installieren können. Ich werde dieses Plugin nicht in das WordPress-Repository hochladen. Wenn es also jemals aktualisiert werden muss, müssen Sie es manuell patchen.

Abschluss

Wenn es innerhalb Ihres Budgets liegt, sollten Sie Elementor Pro kaufen (Affiliate-Link). Auch wenn Sie keine der Premium-Funktionen benötigen, ist es gut, wenn Sie Elementor überhaupt nutzen, den Entwicklern etwas zurückzugeben und bei der Unterstützung des Produkts zu helfen.

Habe ich etwas verpasst? Welches Plugin kommt als nächstes?

Wenn Sie ein Plugin verwenden, das Sie mit Werbung und Promos bombardiert, erwähnen Sie mich @wpexplorer (auf X/Twitter). Wenn das Plugin populär genug ist, könnte ich darüber nachdenken, als nächstes einen ähnlichen Leitfaden dafür zu schreiben.

Oder wenn ich etwas in Elementor verpasst habe, lassen Sie es mich wissen!