Bună, dragi utilizatori ai pluginului WordPress Tooltip, sper că acest mesaj vă găsește bine și că vă bucurați de zile minunate alături de familie. Am primit un ticket de la un utilizator uimitor al pluginului WordPress Tooltip care a raportat un conflict CSS cu tema lor în pluginul WordPress Tooltips. Dezvoltatorul nostru WordPress a verificat tema și a constatat că aceasta intră în conflict cu Bootstrap și Font Awesome, care sunt utilizate de tooltips, printre altele. Pentru a rezolva problema pentru utilizatorul nostru valoros de tooltips, dezvoltatorul nostru de WordPress Tooltips a lansat o nouă versiune: WordPress Tooltips Pro Plus 35.8.8.
1: Am rezolvat conflictul dintre temă și cadrul Bootstrap inclus în tooltipurile WordPress:
Bună echipă de suport,
În primul rând: mulțumiri enorme din nou pentru răspunsul incredibil de rapid și pentru munca de noapte târziu.
Cu 35.8.8 aproape totul este perfect de partea mea:
Pagina de comenzi WooCommerce → avertismentele PHP au dispărut ✅
Salient → Panoul de administrare tipografie → nu mai este rupt ✅
Iconițele sociale din antet/subsol → arată bine ✅
Există doar o regresie care a apărut imediat după actualizarea la 35.8.8:
Pe pagina principală, aspectul antetului/eroi pe mobil este rupt (blocul de meniu/antet se deplasează și distanțarea este greșită).
Aceasta a fost deja reparată în versiunea anterioară, dar cu 35.8.8 a revenit.
Din nou, vă mulțumesc foarte mult pentru munca voastră neobosită și pentru răspunsurile super-rapide — apreciez cu adevărat cât de flexibili și de ajutor sunteți!
Cu căldură,
Am rezolvat problema pentru utilizatorul de tooltipuri și am răspuns:
Bună
Sper că acest mesaj te găsește bine și că ai zile fericite alături de familie
Ne pare rău pentru problemă, am verificat codurile temei și ale pluginului nostru, am testat această problemă pe diverse rezoluții și, în cele din urmă, am descoperit că a fost cauzată de un conflict între Bootstrap și temă. Soluția este simplă, te rugăm să deschizi panoul de setări globale ale tooltipurilor și să dezactivezi opțiunea: „Activează / Dezactivează CSS Bootstrap pentru a evita conflictele cu tema?”, din partea noastră, am constatat că toate lucrurile funcționează bine
Ai putea, te rog, să faci un test și să ne dai un feedback? Dacă există vreo problemă, te rugăm să nu eziți să ne spui, o vom rezolva pentru tine cât mai repede posibil
Mulțumim, să ai o zi binecuvântată alături de cei dragi
Cu cele mai bune gânduri,
Suport WordPress Tooltips
2: Pagina de comenzi WooCommerce: mai multe avertismente PHP apar încă sub secțiunea detalii comenzi (legate de post_type fiind null):
Am rezolvat, am rescris codurile noastre astfel pentru a rezolva problema:
if (isset($post->post_type)) {
if ($post->post_type == ‘tooltips’) { add_meta_box(“show_tooltips_excerpt_control_meta_box_id”, __(‘Afișați extrasul în tooltip pop-up?’, ‘wordpress-tooltips’), ‘show_tooltips_excerpt_meta_box’, null, “side”, “high”, null); } }
Funcționează bine acum
3: Panoul de tipografie Salient: interfața de administrare sub Salient → Tipografie devine ruptă și nealiniată atunci când WordPress Tooltips Pro este activ.
Am rezolvat, am revizuit codul temei de bază și am constatat că include o clasă .tooltip, care intră în conflict cu clasa .tooltips din fișierul nostru admin.css. Am rescris pluginul nostru WordPress Tooltips astfel:
încărcați fișierul admin.css pentru pluginul WordPress Tooltips în zona wp-admin doar atunci când ecranul curent aparține pluginului.
Coduri:
if (isset($_GET[‘post_type’]))
{
$tooltips_admin_post_type_check = sanitize_text_field($_GET[‘post_type’]);
if ($tooltips_admin_post_type_check === ‘tooltips’)
{
wp_enqueue_style(‘tooltips_pro_admin_css’, plugin_dir_url(__FILE__) . ‘asset/css/admin/admin.css’);
}
}
Funcționează bine acum
4: Iconițele sociale: iconițele Font Awesome din meniu și subsol (linkuri sociale) încă se afișează incorect sau ca niște casete goale.
Am rezolvat, în tema Salient, am constatat că acestea își încarcă scripturile târziu astfel:
add_action( ‘wp_enqueue_scripts’, ‘nectar_enqueue_dynamic_css’, 20 );
Am rescris pluginul nostru pentru a încărca Font Awesome târziu pentru a evita conflictele cu alte teme sau pluginuri:
add_action( ‘wp_enqueue_scripts’, ‘ttfa_load_font_awesome’ ,10000);
Astfel, toate codurile din tema Salient vor rula mai întâi, codurile noastre vor apela la încărcarea fontului awesome la final.
Prin urmare, toate codurile din tema Salient vor fi executate cu prioritate, iar pluginul nostru va apela în cele din urmă Font Awesome pentru a se încărca.
Funcționează bine acum
Tema utilizatorului folosea Font Awesome 6.5, iar tooltipurile noastre Font Awesome utilizau de asemenea Font Awesome 6.4 în WordPress Tooltips Pro Plus 35.8.8. Am actualizat tooltipurile Font Awesome pentru a folosi cea mai recentă versiune: Font Awesome 7.1. Ce este Font Awesome?
Font Awesome este un toolkit popular de iconițe și font web care oferă o vastă colecție de iconițe vectoriale scalabile și logo-uri sociale. Permite dezvoltatorilor să încorporeze cu ușurință iconițe de înaltă calitate în site-urile și aplicațiile lor fără a necesita fișiere de imagine. Caracteristici cheie ale Font Awesome:
Iconițe scalabile: Fiind bazate pe vectori, iconițele Font Awesome pot fi scalate la orice dimensiune fără a pierde calitate, făcându-le perfecte pentru designuri responsive.
Compatibilitate între browsere: Font Awesome funcționează perfect pe toate browserele web moderne.
Integrare ușoară: Dezvoltatorii pot integra cu ușurință Font Awesome în proiectele lor folosind un simplu tag <link> sau instalându-l prin manageri de pachete precum npm sau Yarn.
Personalizabil: Iconițele pot fi stilizate cu CSS, permițând modificări de culoare, dimensiune, rotație și multe altele pentru a se potrivi cerințelor de design ale unui site web.
Accesibilitate: Iconițele Font Awesome pot fi făcute accesibile prin atribute HTML corespunzătoare, asigurându-se că sunt utilizabile de cititoarele de ecran.
Actualizări regulate: Toolkitul este actualizat frecvent cu noi iconițe, îmbunătățind biblioteca sa în timp.
De ce utilizatorii apreciază Font Awesome:
Varietate largă: Font Awesome oferă mii de iconițe care acoperă numeroase categorii, oferind utilizatorilor suficiente opțiuni pentru a găsi iconița perfectă pentru orice aplicație.
Simplitate: Sintaxa pentru utilizarea Font Awesome este simplă, făcându-l ușor de implementat pentru dezvoltatori de toate nivelurile de abilități.
Performanță: Fiind un set de iconițe bazat pe fonturi, Font Awesome se încarcă de obicei mai repede decât iconițele tradiționale din imagini, contribuind la îmbunătățirea performanței site-ului.
Suport comunitar: Cu o comunitate mare de utilizatori și documentație cuprinzătoare, dezvoltatorii pot găsi cu ușurință suport, tutoriale și exemple.
Stil consistent: Toate iconițele au un stil uniform, ceea ce ajută la menținerea consistenței vizuale în aplicațiile web.
Opțiuni gratuite și plătite: Font Awesome oferă atât versiuni gratuite, cât și premium, permițând utilizatorilor să aleagă în funcție de nevoile și bugetul lor.
Concluzie
Font Awesome a devenit o soluție preferată pentru mulți dezvoltatori datorită versatilității, ușurinței de utilizare și bibliotecii extinse de iconițe. Indiferent dacă construiești un site web simplu sau o aplicație web complexă, Font Awesome oferă instrumentele necesare pentru a îmbunătăți designul UI și a îmbunătăți experiența utilizatorului. Ce sunt Tooltipurile Font Awesome?
Tooltipurile Font Awesome sunt o caracteristică care permite dezvoltatorilor să creeze casete de informații sau sugestii hoverabile folosind iconițe Font Awesome, incluse în versiunea wordpress tooltips pro plus 19.9.8. Aceste tooltipuri oferă context sau informații suplimentare despre un element de pe o pagină web atunci când un utilizator trece cu cursorul peste acesta. Caracteristici cheie ale Tooltipurilor Font Awesome:
Iconițe: Poți încorpora cu ușurință iconițe din biblioteca Font Awesome în tooltipurile tale, îmbunătățind atractivitatea vizuală și experiența utilizatorului.
Personalizare: Tooltipurile pot fi stilizate și personalizate pentru a se potrivi designului site-ului tău, permițând ajustări de culoare, dimensiune și poziționare.
Responsivitate: Acestea se adaptează bine la diferite dimensiuni de ecran, făcându-le potrivite atât pentru interfețele desktop, cât și pentru cele mobile.
Accesibilitate: Tooltipurile implementate corect pot îmbunătăți accesibilitatea prin furnizarea de informații suplimentare fără a aglomera UI-ul.
Suport JavaScript: Multe implementări de tooltipuri folosesc JavaScript sau cadre CSS (cum ar fi Bootstrap) pentru a îmbunătăți funcționalitatea, cum ar fi efectele de afișare și ascundere.
Cum să adaugi Tooltipuri Font Awesome în Postarea ta WordPress
Crearea de conținut captivant în postările tale WordPress a devenit mai ușoară cu tooltipurile Font Awesome! Urmează acești pași simpli pentru a-ți îmbunătăți postările cu iconițe frumoase care oferă informații suplimentare cititorilor tăi. Pasul 1: Creează o Nouă Postare WordPress
Începe prin a crea o nouă postare în WordPress. În editor, pur și simplu inserează shortcode-ul tooltip Font Awesome astfel:
[ ttfa tooltip_id=”13″ set=”fas” icon=”fa-question-circle” size=”2x” color=”#9ee2c6″ ]
Acest shortcode pentru tooltip Font Awesome îți va permite să afișezi un tooltip în postarea ta.
Mai multe shortcode-uri pentru tooltipuri WordPress pot fi găsite în documentația noastră detaliată despre shortcode-uri; tooltips.org/how-to-use-wordpress-tooltip-shortcode-tooltips-to-add-tooltips-manually/ Pasul 2: Previziunea Tooltipului Tău
Odată ce ai adăugat shortcode-ul, mergi la partea din față a postării tale WordPress. Vei vedea o frumoasă iconiță de cerc cu întrebare, care arată astfel:
Iconița Tooltip Font Awesome
Când utilizatorii trec cu mouse-ul peste cercul cu întrebare, un popup tooltip va apărea, oferind mai multe detalii:
Popup Tooltip Font Awesome Pasul 3: Personalizează-ți Tooltipul
Ai flexibilitatea de a personaliza dimensiunea și culoarea iconițelor tale Font Awesome. De exemplu, dacă vrei să faci iconița cercului cu întrebare mai mare, pur și simplu schimbă parametrul de dimensiune de la 2x la 3x, 4x sau chiar mai mare! Iată un exemplu: fereastra popup tooltip font awesome în partea din față
Pentru a schimba culoarea, modifică parametrul de culoare la orice valoare hex preferi, cum ar fi #cccccc sau #eeeeee. Pasul 4: Alege Stilul Iconiței Tale
Poți, de asemenea, să ajustezi stilul tooltipului tău Font Awesome schimbând parametrul set:
fas — Iconițe solide
far — Iconițe regulate
fab — Iconițe de marcă
Rezumat rapid al ceea ce trebuie să știi:
tooltip_id: Acesta este ID-ul tooltipului pe care l-ai creat în editorul de tooltipuri WordPress.
set: Alege între iconițe solide (fas), regulate (far) sau de marcă (fab).
icon: Am folosit iconița cercului cu întrebare, dar amintește-ți, există peste 1.588 de iconițe uimitoare disponibile pentru tine!
size: Nu ezita să crești dimensiunea la 3x, 4x etc., în funcție de preferințele tale de design.
color: Personalizează culoarea pentru a se potrivi cu site-ul tău, cum ar fi #eeeeee.
Acum ești pregătit să îmbunătățești postările tale WordPress cu tooltipuri delicioase Font Awesome! Blogging plăcut! Concluzie:
Font Awesome include peste 1.500 de iconițe de înaltă calitate care pot fi personalizate în ceea ce privește dimensiunea, culoarea și stilul folosind CSS
„Acum ești pregătit să îmbunătățești postările tale WordPress cu minunatele tooltip-uri Font Awesome! Blogging plăcut!
Concluzie:
Font Awesome include peste 1.500 de pictograme de înaltă calitate care pot fi personalizate în ceea ce privește dimensiunea, culoarea și stilul folosind CSS. Aceste pictograme sunt concepute pentru a fi compatibile cu diferite browsere. Tooltip-urile Font Awesome sunt un component util pentru îmbunătățirea interacțiunii utilizatorului și oferirea de informații utile într-un mod vizual atrăgător pe paginile web.
Dacă este nevoie să facem vreo modificare, te rugăm să nu eziți să ne spui, vom încerca să o finalizăm cât mai repede posibil (este ora 01:52 AM pentru noi).
Dacă totul funcționează bine, te rugăm să schimbi accesul site-ului tău de test, nu ne-am conectat niciodată la contul tău, pentru a-ți proteja datele private și informațiile personale
Mulțumim, să ai o zi binecuvântată alături de cei dragi
Cu cele mai bune gânduri,
Asistența pentru Tooltip-uri WordPress
