Optimiertes Laden von CSS / JAVASCRIPT für das WordPress Tooltips-Plugin, Veröffentlichung des WordPress Tooltips Pro Plus-Plugins 36.5.8

Liebe Nutzer des WordPress tooltip Plugins, wir hoffen, es geht Ihnen gut und dass Sie schöne Momente mit Ihrer Familie genießen. Kürzlich haben wir interessante Vorschläge für neue Funktionen von einem talentierten WordPress-Entwickler erhalten, die unser Interesse geweckt haben. Unser Entwicklerteam arbeitet hart daran, diese Ideen so schnell wie möglich umzusetzen.

Grüße vom Tooltip-Team,
vielen Dank für Ihr schnelles Feedback zur Aktualisierung auf Version 35.5.8 und für Ihre anhaltende Unterstützung. Ich verwende das Tooltips Pro Plus-Plugin für meine Website, die auf dem Salient-Theme (und WPBakery) basiert.

Problem: Die Tooltips auf dem Frontend laden CSS-Stile, die mit Bootstrap/Awesome/reset + admin.css verbunden sind, was das benutzerdefinierte Grid von Salient überlagert und Konflikte mit dem Font Awesome-Team verursacht.
Es gibt Konflikte mit Font Awesome (das Thema/Team verwendet die FA6-Version, während das Plugin eine andere Version von FA hinzufügt, was dazu führt, dass Kommunikationssymbole als leere Kästchen angezeigt werden oder Icon-Fehler auftreten).

Lösung A:

Ich habe das WordPress Tooltip-Plugin folgendermaßen geändert:

  1. Überprüfen, ob jede geladene/entfernte Stile auf die Bootstrap/font-awesome-Strings bezogen ist.
  2. Wenn das Theme oder andere Plugins bereits geladen sind, sofort die Funktion stoppen, um das Laden von benutzerdefiniertem Bootstrap/font-awesome aus dem WordPress Tooltip-Plugin zu vermeiden.
  3. Andernfalls lädt das WordPress Tooltip-Plugin sein eigenes Bootstrap/font-awesome.

Unser Code ist wie folgt:

$enableBootstrapCSS = get_option('enableBootstrapCSS');
if ($enableBootstrapCSS == 'NO') {

} else {

global $wp_styles;
$bs_handles = array(
'bootstrap',
'bootstrap-css',
'bootstrap-style',
'bootstrap5',
'bootstrap-5',
'bootstrap4',
'bootstrap-4',
'tb-bootstrap',
'theme-bootstrap',
'font-enableBootstrapCSS',
'enableBootstrapCSS',
);
foreach ( $bs_handles as $hdl ) {
if ( wp_style_is( $hdl, 'registered' ) || wp_style_is( $hdl, 'done' ) ) {
return;
}
}

$needles = array( 'bootstrap', 'bootstrap.min.css' );
foreach ( array_merge( $wp_styles->done, $wp_styles->queue ) as $done_or_queued ) {
$obj = $wp_styles->registered[ $done_or_queued ] ?? false;
if ( ! $obj ) {
continue;
}
$src = $obj->src ?? "";
foreach ( $needles as $n ) {
if ( stripos( $src, $n ) !== false ) {
return;
}
}
}

wp_enqueue_script('bootstrap', plugin_dir_url( __FILE__ ) . 'js/bootstrap/bootstrap.min.js', array('jquery'), '5.0', true);
}

Eine weitere funktionale Anforderung:

Wir müssen das Problem der Tooltips beheben, die sich auf mobilen Bildschirmen bewegen (Tooltips überdecken den Inhalt an den Seiten).

Stabilisierungsschritte:

A) Stoppen Sie das Laden von Stilen aus dem Plugin, die nicht im Frontend sein sollten.
Wir haben die Tooltips-Ressourcen, die Konflikte verursacht haben, entfernt/reduziert (admin.css, skin ionRangeSlider, bootstrap/awesome/reset). Minimalziel:

Lösung B:

Ich habe den Code des WordPress Tooltip-Plugins sorgfältig analysiert. Frühere Versionen luden nur admin.css und skin ionRangeSlider im Panel, wodurch sie im Frontend nicht geladen wurden. Der Code ist folgendermaßen organisiert:

add_action('admin_head', 'tooltips_pro_admin_css');

add_action('admin_head', 'tooltips_admin_rangeslider_css_js');

Eine weitere funktionale Anforderung:
B) Laden Sie FA6 nur einmal (vermeiden Sie Wiederholungen im Frontend).
Diese Lösung wird die Probleme mit den Icons beheben (frühere Versionen shim in fa-* Kategorien sind verfügbar).

Lösung C:

Diese Herausforderung wurde in Lösung A angesprochen.

Funktionale Anforderung:
Es wäre großartig, dies in Ihr Plugin zu implementieren.

Isolierung von Ressourcen/extreme Fälle:

  • Laden Sie das CSS des Themas für das Backend nicht im Frontend (is_admin()).
    Abgeschlossen.
  • Bieten Sie die Möglichkeit, Bootstrap/Font Awesome auszuwählen (nicht genehmigt als Standardkonfiguration). Bieten Sie 3 Optionen in den Einstellungen an:

    A) Laden Sie das Icon-Team nicht (verwenden Sie das Team des Themas),
    B) Laden Sie FA6 (core/brands/solid),
    C) Laden Sie nur ältere Versionen von shim fa.
    Abgeschlossen. Die ältere Version verwendet noch FA6.5 und das Tooltip-Plugin ist in FA6.4.

  • Laden Sie den Stil ionRangeSlider im Frontend nur, wenn der Slider nicht sichtbar ist.
    Abgeschlossen.
  • Die Namen der Stile sollten einzigartig und spezifisch sein.
    Fügen Sie jedem Plugin-Option einen einzigartigen Root-Namen hinzu (z. B. .tooltips-pro …) und vermeiden Sie die Verwendung von zu allgemeinen Selektoren wie .row, .col, .btn, i, .icon, strong.
    Abgeschlossen. Wir können keine allgemeinen Selektoren wie .row, .col, .btn, i, .icon, strong verwenden.
  • Verwenden Sie wann immer möglich Stile, die Bootstrap ähnlich sind, Grenze: .tooltips-pro .btn { … } nicht .btn { … }
    Abgeschlossen.
  • Laden Sie nur, wenn es absolut notwendig ist.
    Fügen Sie Ressourcen nur dann im Frontend hinzu, wenn Tooltips bereits auf der Seite vorhanden sind (überprüfen Sie den Shortcode/den Inhalt oder verwenden Sie ein Serverskript).

Obwohl wir Funktionen im Zusammenhang mit Tooltip unterstützen (Menü im Tooltip, Verwendung des Alternativtextes von Bildern als Tooltip, und Tooltip für Kontaktformularfelder usw.), haben wir noch keine einfache Lösung für dieses Bedürfnis gefunden. Wir entschuldigen uns dafür.

Kompatibilität mit Font Awesome:
Wenn Sie Font Awesome ändern, verwenden Sie bitte FA6 und dokumentieren Sie dies. Vermeiden Sie den Import älterer Versionen von FA in FA6, um Icon-Probleme zu vermeiden. Die Verwendung von SVGs als Icons in der Benutzeroberfläche ist eine gute Methode, um Abhängigkeiten von FA vollständig zu eliminieren.
Abgeschlossen. Die ältere Version verwendet noch FA6.5 und das Tooltip-Plugin ist in FA6.4.

Vielen Dank für die großartigen Vorschläge, und wenn Sie weitere funktionale Anforderungen haben, zögern Sie bitte nicht, uns zu kontaktieren. Wir hoffen, dass wir diese für Sie umsetzen können

Vielen Dank. Wir wünschen Ihnen schöne Momente mit Ihrer Familie

Mit besten Grüßen,

Das Support-Team des WordPress Tooltip-Plugins


Wenn Sie sonst noch etwas benötigen oder Änderungen haben möchten, lassen Sie es mich bitte wissen!

today at 8:56 AM

Tagged with:

Leave a Reply

Your email address will not be published. Required fields are marked *

*