Nogle detaljer fortjener ikke et helt afsnit på siden. En kort note, der vises på hover, gør jobbet, som ekstra kontekst på et funktionskort eller en etiket på en ikon-kun-knap. Elementor har ingen indbygget måde at gøre det på, så den Værktøjstip forlængelse i Master Addons til Elementor tilføjer en til hvert elements fane Avanceret.
Du skriver værktøjstipsteksten, vælger, hvor den vises, og hvordan den animerer, og styler den derefter som enhver anden del af dit design. Ingen shortcode og ingen CSS.
Hvad Tooltip-udvidelsen gør #
Når det er aktiveret, får hvert Elementor-element en Værktøjstip afsnit under Advanced fane. Slå det til for et element, skriv teksten, og besøgende ser en lille boble, når de holder markøren over det element på live-siden. Hvert element bærer sit eget værktøjstip, så tre kort i træk kan forklare sig med forskellig tekst.
Udvidelsen opdeles i to underfaner: Indstillinger for adfærd (tekst, placering, animation, trigger, timing) og Style for udseende (farver, bredde, polstring, typografi).
Før du starter #
- WordPress med Elementor installeret og aktiv.
- Master Addons til Elementor installeret og aktiv. Ny i plugin? Følg installationsvejledning first.
- Tooltips er en gratis udvidelse, så der kræves ingen Pro-licens.
Sådan aktiveres Tooltip-udvidelsen #
Fra dit WordPress dashboard, gå til Master Addons og åbn Udvidelser fane. Værktøjstip sidder i Dynamiske widgets gruppe med et Populært badge, ved siden af Dynamiske tags og Wrapper Link. Klik på dens toggle, så den bliver lilla, og hit derefter Gem ændringer øverst og vent på den grønne “Indstillinger gemt med succes”-meddelelse.
Føje et værktøjstip til et element #
Åbn din side med Elementor, og vælg elementet. I videoeksemplet er det et Infobokskort i en funktionsrække med tre kolonner. Gå til Advanced fane, åbn Værktøjstip sektion med det lilla MA-mærke, og vend Værktøjstip skift til Ja. Underfanen Indstillinger åbnes først.
Indstillinger forklaret #
- Indhold: værktøjstipteksten. Skriv den ind, eller brug linket Skriv med AI, hvis du vil have et udgangspunkt.
- Placering: hvilken side af elementet boblen foretrækker: øverst (standard), nederst, venstre eller højre.
- Følg markør: gør værktøjstipsporet til musen i stedet for at sidde stille.
- Animation: hvordan boblen kommer ind. Syv valg: Ingen, Fade, Shift-Away, Shift-Toward, Scale, Perspective og Fill Effect.
- Udløser: hvad åbner værktøjstippet, hold markøren som standard.
- Varighed og Forsinkelse: animationshastigheden i millisekunder, og hvor længe boblen bliver hængende, før den lukkes.
- X og Y Offset: skub boblen væk fra dens standardplads.
- Pil og pil Type: tilføj den lille pointer, der forbinder boblen til element, skarp eller rund.
Style værktøjstippet #
Skift til Style sub-fane for at få boblen til at matche dit design i stedet for at ligne en browserstandard.
- Max bredde: caps hvor bred boblen vokser, 200px i demoen, så lang tekst ombrydes i stedet for at strække sig over skærmen.
- Tekst, baggrund og pilfarve: fuld farvekontrol, inklusive markøren.
- Polstring, Border Type og Border Radius: boblens form.
- Tekstjustering, Box Shadow og typografi: afslut looket med din egen skrifttype og dybde.
Resultatet på siden #
Gem og se siden. Hold markøren over kortet, og værktøjstippet toner ind med den tekst, du har skrevet, ved hjælp af den animation, farver og bredde, du har indstillet. Flyt markøren væk, og den lukkes efter forsinkelsen.
Gentag for de andre elementer på siden. I demoen får hvert af de tre featurekort sin egen værktøjstiptekst, skrevet en gang i panelet og serveret på hver hover.
Hvor værktøjstip tjener deres hold #
- Featurekort. En sætning med ekstra detaljer uden at forlænge kortet.
- Prisfastsættelsestabeller. Forklar, hvad “prioritetsstøtte” egentlig dækker over, lige der hvor folk undrer sig.
- Knapper og ikoner. Etiket ikon-kun kontroller, så ingen gætter.
- Teammedlemmer. En sjov kendsgerning eller rolle note på hover over hvert billede.
- Tekniske termer. Korte definitioner på jargon, billigere end en ordliste side.
Video Tutorial #
Foretrækker du at se det live? Denne video går igennem aktivering af udvidelsen, skrivning af værktøjstippet og styling af boblen.
Ofte stillede spørgsmål #
Hvordan tilføjer jeg et værktøjstip i Elementor?
Aktiver udvidelsen Værktøjstip i fanen Mastertilføjelsesprogrammer, og vælg derefter et hvilket som helst element i Elementor-editoren, åbn fanen Avanceret, og slå kontakten Værktøjstip til. Skriv din tekst i feltet Indhold, vælg en placering og animation, og værktøjstipshowene ved svæve.
Kan jeg tilføje et værktøjstip til enhver Elementor-widget?
Ja. Afsnittet Værktøjstip vises på fanen Avanceret for hvert element: widgets, kolonner, containere og sektioner. Hvert element beholder sin egen værktøjstiptekst og indstillinger, så forskellige kort på samme side kan sige forskellige ting.
Kan jeg style værktøjstippet, så det passer til mit websted?
Ja. Underfanen Style styrer maks. bredde, tekstfarve, baggrundsfarve, pilfarve, polstring, kant, grænseradius, tekstjustering, boksskygge og typografi. Boblen kan matche dit brand i stedet for at ligne en browserstandard.
Hvilke animationer understøtter værktøjstippet?
Syv muligheder: Ingen, Fade, Shift-Away, Shift-Toward, Scale, Perspective og Fill Effect. Du styrer også animationsvarigheden i millisekunder, og forsinkelsen før værktøjstippet lukkes, efter markøren forlader.
Er Tooltip-udvidelsen gratis?
Ja. Værktøjstip leveres med den gratis version af Master Addons for Elementor, i gruppen Dynamiske widgets under fanen Udvidelser. Den prissætning side viser, hvad Pro-planerne tilføjer ud over de gratis udvidelser.
Indpakning #
Tooltip-udvidelsen til Elementor sætter en lille, stilbar svævenote på alt, hvad du bygger: vend kontakten på fanen Avanceret, skriv teksten, vælg placering og animation, og stil boblen én gang. Det lyder som en del af dit design, ikke en browserrest. For mere Advanced-tab opgraderinger, gennemse Master Addons widgets og udvidelser, eller se den Glasmorfisme forlængelse for endnu en one-toggle effekt.
