Cześć drodzy użytkownicy podpowiedzi WordPress(WordPress tooltip ), mam nadzieję, że ta wiadomość zastaje Was w dobrym zdrowiu i cieszycie się radosnymi dniami w gronie bliskich. Ostatnio otrzymaliśmy prośbę o nową funkcję od utalentowanego dewelopera WordPress, który zaproponował nam fantastyczne sugestie. Nasz zespół zajmujący się rozwojem wtyczek pracuje nieustannie, aby jak najszybciej wdrożyć te prośby:
Cześć zespole Tooltips,
Dziękuję za aktualizację 35.5.8 oraz za szybką pomoc wcześniej. Używam Tooltips Pro Plus na stronie działającej na motywie Salient (z WPBakery).
Przyczyna: Podpowiedzi załadowały Bootstrap/Awesome/reset CSS + admin.css na frontend, co nadpisało responsywną siatkę Salient i stos FA.
Kolizja z Font Awesome (motyw/stos używa FA6, wtyczka wstrzyknęła inną wersję FA; ikony społecznościowe stały się pustymi prostokątami / niewłaściwymi glyphami).
Rozwiązanie A:
Przerobiliśmy naszą wtyczkę podpowiedzi WordPress w następujący sposób:
1: Skanuj każdą załadowaną/zrealizowaną arkusz stylów (handle + scr) w poszukiwaniu dowolnego ciągu bootstrap/font-awesome
2: Jeśli motyw lub inna wtyczka już go załadowała, rutyna natychmiast się poddaje, wtyczka podpowiedzi WordPress nie załadowała pakietów bootstrap/font-awesome.
3: W przeciwnym razie wtyczka podpowiedzi WordPress sama ładuje pakiety bootstrap/font-awesome.
Nasz kod wygląda tak:
$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);
Następna prośba o funkcję:
Podpowiedzi wykraczają poza mobilne (okno podpowiedzi wyszło poza widok w pobliżu krawędzi; strzałka również przycięta nad treścią).
Co zrobiłem, aby to ustabilizować: A) Zatrzymałem CSS wtyczki, który nie powinien ładować się na frontendzie.
Usunąłem/zarejestrowałem tylko zasoby Tooltips, które powodują konflikty (admin.css, ionRangeSlider skin, bootstrap/awesome/reset). Minimalny, ukierunkowany fragment:
Rozwiązanie B:
Dokładnie przeglądnęliśmy kod wtyczki podpowiedzi WordPress. W poprzednich wersjach ładaliśmy tylko admin.css i skin ionRangeSlider w obszarze administratora, zapewniając, że nie są one ładowane na froncie. Kod jest zorganizowany w następujący sposób:
add_action(‘admin_head’, ‘tooltips_pro_admin_css’);
add_action(‘admin_head’, ‘tooltips_admin_rangeslider_css_js’);
Następna prośba o funkcję:
B) Ładowany FA6 dokładnie raz (brak duplikatów FA na frontendzie)
To rozwiązało problemy z ikonami (w tym stare klasy fa fa-* dzięki v4-shims).
Rozwiązanie C:
Ten problem został rozwiązany w sekcji Rozwiązanie A.
Prośba o funkcję:
Co by pomogło, gdybyś to wdrożył we wtyczce.
Izolacja zasobów / opcje:
- Nie ładuj administracyjnych CSS na frontend (jeśli (is_admin()) zabezpieczenia).
Zrobione. - Spraw, aby Bootstrap/Font Awesome były opcjonalne (domyślnie wyłączone). Zapewnij 3 opcje w ustawieniach:
a) Nie ładuj żadnego zestawu ikon (użyj zestawu z motywu),
b) Ładuj FA6 (core/brands/solid),
c) Tylko legacy shim dla starego fa fa-.
Zrobione, używasz FA6.5, wtyczka podpowiedzi WordPress używa FA6.4. - Unikaj ładowania stylów ionRangeSlider na frontend, chyba że suwak jest faktycznie renderowany.
Zrobione. - Przestrzeń nazw i zakres CSS
Prefiksuj wszystkie selektory wtyczki pod unikalnym korzeniem (np. .tooltips-pro …) i unikaj ogólnych selektorów, takich jak .row, .col, .btn, i, .icon, strong globalnie.
Zrobione, nigdy nie używamy ogólnych selektorów, takich jak .row, .col, .btn, i, .icon, strong globalnie. - Jeśli musisz stylizować klasy podobne do Bootstrapa, ogranicz je: .tooltips-pro .btn { … } a nie .btn { … }.
Zrobione. - Ładuj tylko wtedy, gdy jest to potrzebne
Dodaj zasoby frontendowe tylko wtedy, gdy na stronie faktycznie znajduje się podpowiedź (skanowanie shortcode/tresci lub flaga po stronie serwera).
Ponieważ wtyczka podpowiedzi WordPress obsługuje wiele rodzajów efektów podpowiedzi, na przykład, podpowiedzi dla elementów menu, używanie ALT obrazu jako podpowiedzi obrazów, podpowiedzi dla pól formularza kontaktowego itp., obecnie podpowiedzi działają dla dowolnego elementu na stronie… ponieważ nie mamy sposobu, wiedzieć, jak użytkownicy korzystają z podpowiedzi na stronie WordPress, w tej chwili nie możemy znaleźć rozwiązania dla tej prośby, przepraszam.
Kompatybilność z Font Awesome:
Jeśli dostarczasz FA, używaj FA6 i dokumentuj stos; unikaj wstrzykiwania starszej wersji FA obok FA6, aby zapobiec niezgodności glyph. Rozważ inline SVG dla swoich ikon UI, aby całkowicie uniknąć jakiejkolwiek zależności od FA.
Zrobione, używasz FA6.5, wtyczka podpowiedzi WordPress używa FA6.4.
Dziękujemy za świetne sugestie, jeśli masz jeszcze jakieś prośby o funkcje, nie wahaj się z nami skontaktować, bardzo chętnie je zrealizujemy dla Ciebie
Dziękuję, życzę błogosławionego dnia z rodziną
Z poważaniem,
Wsparcie dla Wtyczki Podpowiedzi WordPress


Leave a Reply