Skip to content

Kõik WordPressist, veebiarendusest — ja mitte ainult

🛠 Kuidas avada Elementori hüpikakent ankurlinki kaudu oma saidi mis tahes lehelt

🛠 Kuidas avada Elementori hüpikakent ankurlinki kaudu oma saidi mis tahes lehelt

Vajate nuppu ükskõik kus oma saidil, et avada Elementor hüpikaken, kuid tavaline „klõpsamise" päästik töötab ainult ühel lehel? Selle ülesande saab lahendada viie minutiga, ilma kolmandate osapoolte pluginateta ja koodi muutmata.

Sisseehitatud Elementor Pro mehhanism, ankurlink kombineerituna Open By Selector CSS-valijaga. Kui olete selle seadistanud, saate hüpikakna, mis avaneb teie saidi mis tahes lehelt: menüüpunktist, tekstilingist või jaluses olevast nupust. Allpool on samm-sammuline juhend alates hüpikakna loomisest kuni selle testimiseni reaalsel saidil. Iga sammu illustreerib ekraanipilt tegelikust seadistusest.

💡 Kiire ülevaade:

  • Looge hüpikaken jaotises Elementor Templates → Popups ja avaldage see
  • Kuvamistingimustes valige „Entire Site", see on meetodi võtmepunkt
  • Hüpikakna üldseadetes lubage „Disable Page Scroll" ja „Prevent Multiple Popups"
  • Vahekaardil Advanced sisestage väljale Open By Selector valija a[href="#your-anchor"]
  • Paigutage ankruga #your-anchor lingid üle kogu saidi, hüpikaken avaneb igalt poolt

1. Samm: looge hüpikaken Elementoris

Elementor hüpikaken kontaktvormiga

Avage WordPressi külgmenüüst Templates → Popups ja klõpsake „Add New". Valige Elementori teegist valmis mall või alustage tühja lõuendiga. Nimetage hüpikaken tähendusrikkalt, näiteks „Kontaktivorm" või „Päringuvorm", et selle hiljem loendist hõlpsasti üles leiaksite. Kujundus võib olla ükskõik milline: kontaktvorm, uudiskirja tellimine, tagasisidevorm või reklaambänner.

Koostage sisu Elementori ehitajas nagu tavalist lehte: lisage pealkiri, vorm, tekst ja sulgemisnupp. Kui valmis, klõpsake Publish.

Pärast avaldamist avab Elementor tingimuste, päästikute ja lisareeglite ekraani. Siin teeme ainsa kriitilise seadistuse.

2. Samm: tingimus „Entire Site"

Hüpikakna kuvamise tingimus kogu saidile Elementoris

Tingimuste ekraanil leidke rippmenüüst ja valige Entire Site. See on ainus tingimus, mille peate määrama.

Märkus: isegi kui plaanite hüpikakent kuvada ainult kindlatel lehtedel, on „Entire Site" valimine lihtsaim tee. Kuvamist ei juhi mitte lehe tingimus, vaid ankru-lingi #contact olemasolu URL-is. Kui aadressiribal ankrut pole, pole ka hüpikakent.

Päästikute ekraani ja lisareeglid võib vahele jätta: klõpsake Next, seejärel Save & Close. Ankurlingi meetod töötab nendest seadistustest sõltumatult.

3. Samm: hüpikakna üldseaded

Elementori hüpikakende globaalsed seaded

Klõpsake hüpikakna redigeerimisekraani vasakus alanurgas hammasrattaikooni, avaneb Popup Settings paneel. Minge vahekaardile Advanced.

Täpsemad seaded Elementori hüpikaknas

Siin seadistage käitumine vastavalt oma ülesandele. Soovitame lubada:

  • Disable Page Scroll, et taustaleht ei keriks, kui hüpikaken on avatud;
  • Prevent Multiple Popups, et vältida mitme hüpikakna üksteise peale kattumist.

Jätke ülejäänud parameetrid vaikeväärtustele. Peamine on väli vahekaardi kõige all, mille jaoks kõike seda alustati.

4. Samm: Open By Selector, ankru maagia

Ava selektori väli ankru lingi CSS-selektoriga

Väljale Open By Selector sisestage CSS-valija, mis „kuulab" ankru linki. Vorming on range:

1a[href="#contact"]

#contact asemel asendage oma ankur: #popup / #callback / #sale või mõni muu unikaalne identifikaator. Valija reageerib klõpsule mis tahes <a> elemendil, mille href atribuut võrdub teie ankruga.

Salvestage hüpikaken. Nüüd ootab see, kuni külastaja järgib vajaliku ankruga linki.

5. Samm: paigutage ankru-lingid üle kogu saidi

Jääb üle vaid lisada lingid, kust külastaja hüpikakna avab. Sobib iga Elementori vidin, millel on lingiväli: Button, Text Editor, Image, Icon Box.

Lingiväljale sisestage tavalise URL-i asemel #contact (või oma ankur). Esiküljel toimib see järgmiselt: klõpsamisel lisab brauser aadressiribale #contact, valija a[href="#contact"] käivitub ja hüpikaken avaneb.

Praktikas kasutame kolme tüüpilist stsenaariumi:

  • Nupp esilehe ülaosas, „Telli kõne" href-iga #callback;
  • Menüüpunkt, jaotises Appearance → Menus lisage kohandatud link ankruga #contact;
  • Tekstilink postituse sisus, valige tekst ja sisestage ankur lingipaneelil.

Testige: avage oma saidi suvaline leht, lisage aadressiribale #contact ja vajutage Enter, hüpikaken peaks ilmuma. Kui mitte, minge tagasi 4. sammu juurde ja kontrollige valijat.

Video: seadistamine 3 minutiga

Ametlik Elementori video näitab protsessi algusest lõpuni, alates hüpikakna loomisest kuni selle testimiseni reaalsel saidil.

⁉️🤔 Korduma kippuvad küsimused

Kas meetod töötab ilma Elementor Prota?

Ei. Popup Builderi moodul on ainult Elementor Pro-s. Ehitaja tasuta versioonis pole hüpikaknad saadaval. Kui kasutate tasuta versiooni, uurige Elementori kombinatsiooni eraldi hüpikakna pluginaga (näiteks Popup Maker), kuid seadistus on seal teistsugune, jQuery valijate kaudu, mitte standardse Open By Selector kaudu.

Kas tingimus „Entire Site" on kohustuslik?

Jah, see on meetodi põhinõue. Kui jätate tingimuseks „On Specific Pages", kuvatakse hüpikakent ainult valitud lehtedel ja ainult lehe laadimisel, mitte ankrule klõpsamisel. Režiim „Entire Site" annab juhtimise üle Open By Selector valijale.

Kas saab luua mitu erinevat hüpikakent erinevate ankrutega?

Jah. Looge iga ankru jaoks eraldi hüpikaken. Näiteks „Kontaktid" hüpikaken valijaga a[href="#contact"] ja „Soodustus" hüpikaken valijaga a[href="#sale"]. Mõlemad on seatud tingimusele „Entire Site" ja käivituvad iseseisvalt oma ankruga.

Miks hüpikaken ankruga ei avane?

Kontrollige kolme asja. Esiteks: #your-anchor peab ilmuma aadressiribale, brauser lisab selle ainult vastava href-iga <a> elemendil klõpsamisel, otse klaviatuurilt sisestamine ei pruugi töötada. Teiseks: väli Open By Selector peab sisaldama täpselt a[href="#contact"], ilma tühikuteta ja õigete jutumärkidega. Kolmandaks: avage brauseri konsool (F12) ja otsige JavaScripti vigu, konflikt mõne teise pluginaga võib päästiku blokeerida.

Kas see mõjutab SEO-d?

Ei. Ankurlingid koos räsiga (#) ei indekseerita otsingumootorite poolt eraldi lehtedena. Google'i jaoks on see tehniline navigatsioonielement, mitte duplikaat sisu.

Mida teha, kui standardsetest päästikutest ei piisa

Ankurlink läbi Open By Selector on kõige universaalsem viis Elementori hüpikakna avamiseks ükskõik kust teie saidil. See ei sõltu sellest, millisel lehel külastaja on, ega nõua faili functions.php muutmist.

Kui ülesanne muutub keerukamaks, näiteks peaks hüpikaken avanema kindla plokini kerimisel või 10 sekundit pärast saidile sisenemist, kasutage standardseid Elementori päästikuid: On Scroll, On Page Load, On Exit Intent. Need seadistatakse samal ekraanil, kus valisime „Entire Site", ja need kombineeruvad suurepäraselt ankru meetodiga.

Proovige seda testsaidil: looge hüpikaken, sisestage a[href="#test"], paigutage selle ankruga nupp avalehele. Kogu protsess võtab vähem kui viis minutit.