Chers utilisateurs du plugin WordPress tooltip, Nous espérons que vous allez tous bien et que vous profitez d’un bon moment en famille. Récemment, nous avons reçu des suggestions passionnantes de nouvelles fonctionnalités d’un développeur WordPress talentueux qui ont attiré notre attention. Notre équipe de développement travaille dur sur ces idées afin de les mettre en œuvre dès que possible.
Salutations de l’équipe Tooltips,
Nous vous remercions pour votre réaction rapide concernant la mise à jour vers la version 35.5.8 et pour votre soutien continu. J’utilise le plugin Tooltips Pro Plus pour mon site, qui est basé sur le thème Salient (et WPBakery).
Problème : Les tooltips sur le front-end chargent des styles CSS liés à Bootstrap/Awesome/reset + admin.css, ce qui couvre la grille personnalisée de Salient et crée des conflits avec l’équipe de Font Awesome.
Il y a des conflits avec Font Awesome (le thème/l’équipe utilise la version FA6, tandis que le plugin ajoute une autre version de FA, ce qui fait que les icônes de communication apparaissent comme des cases vides ou génèrent des erreurs d’icônes).
Solution A :
J’ai modifié le plugin WordPress Tooltip comme suit :
- Vérifier si chaque style chargé/retiré est lié à la chaîne Bootstrap/font-awesome.
- Si le thème ou d’autres plugins sont déjà chargés, arrêter immédiatement la fonction pour éviter de charger le Bootstrap/font-awesome personnalisé du plugin WordPress Tooltip.
- Sinon, le plugin WordPress Tooltip chargera son propre Bootstrap/font-awesome.
Notre code est le suivant :
$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);
}
Autre exigence fonctionnelle :
Nous devons résoudre le problème des tooltips qui se déplacent sur les écrans mobiles (les tooltips couvrent le contenu sur les côtés).
Étapes pour stabiliser :
A) Arrêter le chargement de styles du plugin qui ne devraient pas être sur le front-end.
Nous avons retiré/réduit les ressources de Tooltips qui causaient des conflits (admin.css, skin ionRangeSlider, bootstrap/awesome/reset). Objectif minimum :
Solution B :
Nous avons examiné attentivement le code du plugin WordPress Tooltip. Les versions précédentes ne chargeaient que admin.css et skin ionRangeSlider dans le panneau, empêchant leur chargement sur le front-end. Le code est organisé de la manière suivante :
add_action('admin_head', 'tooltips_pro_admin_css');add_action('admin_head', 'tooltips_admin_rangeslider_css_js');
Autre exigence fonctionnelle :
B) Charger FA6 une seule fois (éliminer les répétitions sur le front-end).
Cette solution résoudra les problèmes d’icônes (les versions précédentes shim dans les catégories fa-* sont disponibles).
Solution C :
Ce défi a été abordé dans la Solution A.
Exigence fonctionnelle :
Ce serait formidable d’implémenter cela dans votre plugin.
Isolement des ressources/cas extrêmes :
- Ne pas charger le CSS du thème pour le back-end sur le front-end (is_admin()).
Terminé. - Fournir l’option de sélectionner Bootstrap/Font Awesome (sans approbation comme configuration par défaut). Offrir 3 options dans la configuration :
A) Ne pas charger d’équipe d’icônes (utiliser l’équipe du thème),
B) Charger FA6 (core/brands/solid),
C) Charger uniquement les versions précédentes de shim fa.
Terminée. La version précédente utilise encore FA6.5 et le plugin Tooltip est en FA6.4. - Charger le style ionRangeSlider sur le front-end uniquement si le slider n’est pas visible.
Terminé. - Les noms des styles doivent être uniques et spécifiques.
Ajouter un nom racine unique (par exemple : .tooltips-pro …) à toutes vos options dans le plugin et éviter d’utiliser des sélecteurs trop généraux comme .row, .col, .btn, i, .icon, strong.
Terminé. Nous ne pouvons pas utiliser des sélecteurs généraux comme .row, .col, .btn, i, .icon, strong. - Chaque fois que cela est possible, utilisez des styles similaires à Bootstrap, limite : .tooltips-pro .btn { … } pas .btn { … }
Terminé. - Charger uniquement si c’est absolument nécessaire.
Ajouter des ressources au front-end uniquement lorsque les tooltips sont déjà présents sur la page (vérifier le shortcode/contenu ou utiliser une étiquette du serveur).
Bien que nous soutenions des fonctions liées au Tooltip (menu en Tooltip, utilisation du texte alternatif des images comme tooltip, et Tooltip pour les champs de formulaire de contact, etc.), nous n’avons pas encore trouvé de solution simple pour ce besoin. Nous nous en excusons.
Compatibilité avec Font Awesome :
Si vous changez le Font Awesome, veuillez utiliser FA6 et le documenter. Évitez d’importer des versions antérieures de FA dans FA6 pour éviter des problèmes avec les icônes. Utiliser des SVG comme icônes intégrées dans l’interface utilisateur est une bonne méthode pour éliminer complètement les dépendances de FA.
Terminé. La version précédente utilise encore FA6.5 et le plugin Tooltip est en FA6.4.
Nous vous remercions sincèrement pour vos excellentes suggestions et si vous avez d’autres exigences fonctionnelles, n’hésitez pas à nous contacter. Nous espérons pouvoir les mettre en œuvre pour vous
Merci. Nous espérons que vous passerez un bon moment avec votre famille
Cordialement,
L’équipe de support du plugin WordPress Tooltip
Related posts:
- Comment créer des infobulles multilingues en utilisant le plugin Polylang avec les infobulles WordPress ?
- Comment utiliser le modèle de glossaire de table Bootstrap dans le plugin WordPress Tooltips pour créer un glossaire attrayant
- Guide étape par étape : Implémentation des infobulles WordPress Tooltips sur les titres de produits WooCommerce
- Y a-t-il un moyen d’afficher sélectivement des infobulles WordPress provenant de catégories spécifiques — WordPress Tooltips
Leave a Reply