Cum să faci clic pe un link

Publicat: 2023-05-15

Linkurile online pun bazele unei interactivitati simple online, fie că este vorba despre trimiterea utilizatorilor către pagini web, documente descărcabile sau alte aplicații.

Ceea ce este grozav este că puteți face linkuri pe care se poate face clic în multe aplicații, inclusiv ca sisteme de gestionare a conținutului, creatori de site-uri web, procesoare de text și clienți de e-mail.

Acest ghid ilustrează tot ce trebuie să știți despre cum să faceți clic pe un link, explicând în același timp elementele de bază din spatele unui link și terminologia pe care o puteți întâlni atunci când creați unul.

Noțiuni de bază pentru hyperlink

Există diferiți termeni pentru o bucată de conținut, cum ar fi text sau o imagine, care oferă posibilitatea de a face clic sau opțiunea interactivă de a plasa cursorul peste conținut și de a naviga în altă parte.

Unii dintre acești termeni includ:

  • Legătură
  • Hyperlink
  • Link pe care se poate face clic
Nimic nu este mai frustrant decât un link care nu face clic. Asigură-te că al tău funcționează! Faceți clic pentru a trimite pe Tweet

Din punct de vedere tehnic, toate acestea au propriile lor definiții, dar în prezent sunt folosite interschimbabil.

Capacitatea unui utilizator de a interacționa cu conținutul online se bazează pe aceste hyperlinkuri, în care utilizatorii pot derula peste un fragment de text, o imagine sau un buton și pot face clic pe el, trimițându-i astfel către o altă bucată de conținut (cum ar fi o pagină web externă) sau către efectuați o acțiune (cum ar fi apelarea unui număr de telefon de pe smartphone).

O versiune simplă codificată HTML a unui hyperlink arată astfel:

 <a href="https://example.com/">the hyperlink text</a>

Dar devine mai complex atunci când se iau în considerare elemente opționale precum ținte și elemente nofollow:

 < a href = "https://example.com/" target = "_blank" rel = "noreferrer noopener" >the hyperlink text</ a >

Iată elementele care alcătuiesc un hyperlink:

  1. Continutul
  2. Adresa URL sau permalink
  3. Ţintă
  4. Nofollow, noreferrer și noopener
părți ale unui hyperlink evidențiate și etichetate
Elementele unui hyperlink

Continuați să citiți pentru a afla despre fiecare dintre aceste elemente și cum funcționează.

Continutul

Puteți crea linkuri pe care se poate face clic cu două tipuri de conținut:

  1. Text
  2. Grafică

Aceasta înseamnă că, atâta timp cât aplicația pe care o utilizați acceptă hyperlinkuri, puteți găsi orice linie de text sau imagine scrisă în conținutul dvs. și să o transformați într-un link pe care se poate face clic.

Text cu hyperlink

Textul este una dintre opțiunile de conținut atunci când faceți linkuri pe care se poate face clic.

Dacă utilizați un editor precum WordPress, puteți evidenția orice text doriți în ecranul editorului, apoi selectați butonul Link .

un link către site-ul The Potbelly
Adăugarea unui link în WordPress

Aceasta redă un link pe front-end, de obicei cu text colorat, subliniat.

un link pentru vizualizarea unui meniu
Un link pe care se poate face clic pe front-end

Un hyperlink text se schimbă uneori când un utilizator trece cu mouse-ul peste el, adesea schimbând culorile sau ascund sublinierea pentru a specifica că este un link pe care se poate face clic.

În plus, la mutarea mouse-ului peste un link text, browserele afișează de obicei o previzualizare a adresei URL conectate pentru a vedea unde duce.

link de previzualizare despre sandvișuri
O previzualizare a adresei URL țintă

Imagini cu hyperlink

Multe programe, inclusiv WordPress, vă permit să generați hyperlinkuri folosind media online, cum ar fi imagini.

Acest lucru funcționează prin selectarea unei imagini pe backend (în loc de text) și adăugarea adresei URL dorite prin intermediul funcției Link .

imagine sandwich pe un site web care este conectat
Legarea unei imagini

Odată publicată, săgeata standard a cursorului se transformă într-un cursor manual atunci când trec cu mouse-ul peste imagine, iar vizitatorii vor vedea că browserul prezintă o previzualizare a adresei URL conectate.

săgeată care indică adresa URL de previzualizare a browserului pe pagina unui produs Potbelly
O previzualizare a adresei URL țintă

Indiferent dacă este un link imagine sau text, dacă faceți clic pe acesta, se va activa o acțiune, cum ar fi trimiterea utilizatorului la o adresă URL diferită.

o pagină de sandwich Potbelly
O pagină țintă externă

Cum arată codarea

Conținutul textului sau al imaginii dintr-un hyperlink este reprezentat de „Textul linkului” în exemplul de mai jos:

 < a href = "https://example.com/" target = "_blank" rel = "noreferrer noopener" >The Link Text</ a >

Cu toate acestea, a învăța cum să faci un link pe care se poate face clic înseamnă că vei înlocui acel text cu propriul tău conținut.

Pentru un link text, textul pe care se poate face clic merge chiar înaintea parantezei de închidere </a> .

textul linkului evidențiat în codul linkului
Textul linkului

Link-urile imaginilor sunt puțin diferite, deoarece trebuie să includă adresa URL a imaginii (cel mai bine dacă sunt încărcate în baza de date media site-ului dvs.).

Adresa URL media se află între ghilimele din secțiunea img src="" .

URL-ul imaginii evidențiat

Adresa URL a sursei imaginii

Există și alte elemente de adăugat cu link-uri de imagine, cum ar fi:

  • O etichetă alt ( alt=“” ): text care descrie imaginea pentru crawlerele motoarelor de căutare și utilizatorii cu deficiențe de vedere.
  • O clasă ( class=“” ): un nume codat pentru utilizarea imaginii în altă parte în codul sau fișierele site-ului.

URL-ul

Ca parte a unui hyperlink, adresa URL servește ca destinație sau acțiune care are loc atunci când cineva face clic pe link.

link-ul inserat în câmpul URL
O adresă URL într-un link pe care se poate face clic

Dar nu toate adresele URL prezintă adrese URL ale paginilor web. Este posibil să descoperiți că unele hyperlinkuri au funcționalitate „clic pentru a apela”, permițând utilizatorilor să apeleze un număr de telefon direct de pe smartphone-ul lor cu un singur clic.

un număr de telefon în câmpul URL
Un exemplu de funcționalitate clic pentru a apela

O altă opțiune este de a dezvălui o hartă care deschide aplicația de hartă a utilizatorului pe telefonul său.

un link către Hărți Google plasat într-un câmp URL
Un link care duce la o aplicație pentru hărți

Cum arată codarea

Adresele URL din linkurile pe care se poate face clic sunt plasate între ghilimele din partea <a href="” a hyperlinkului.

De exemplu, partea https://www.example.com a următorului cod de hyperlink este adresa URL:

 < a href = "https://www.example.com" target = "_blank" rel = "noreferrer noopener" >View the entire menu.</ a >
o legătură cu partea ahref evidențiată
Adresa URL prezentată într-un hyperlink cod HTML

Unele adrese URL duc la documente descărcabile, în timp ce altele necesită codare specială. De exemplu, un link „clic pentru a apela” vă cere să plasați tel: și un număr de telefon între ghilimele href="” .

link cu numărul de telefon din cadrul acestuia
Exemplu de telefon: clic pentru a apela link

Fereastra țintă

Fereastra țintă este o parte opțională a unui hyperlink. Specifică dacă conținutul se deschide în aceeași filă de browser sau într-o filă nouă de browser.

Pe WordPress și multe alte aplicații, puteți adăuga o fereastră țintă fără a atinge niciun cod, utilizând editorul vizual.

Pur și simplu dezactivați comutatorul „Deschideți într-o filă nouă” dacă doriți ca linkul să se deschidă în aceeași filă vizualizată în prezent de utilizator.

fila este dezactivată pentru un link
Comutatorul Deschidere în filă nouă este dezactivat

Alternativ, puteți activa comutatorul „Deschideți într-o filă nouă” , care adaugă automat un atribut _blank la codificarea hyperlinkului și deschide adresa URL într-o filă nouă când se face clic.

comutatorul este acum pornit pentru link-ul meniului
Comutatorul Deschidere în filă nouă este activat

Cum arată codarea

Aceste opțiuni sunt declanșate prin adăugarea și editarea elementului target="" într-un hyperlink.

Deși atributul țintă are mai multe valori, cum ar fi _blank , _parent , _self și _top , în general folosim doar valoarea _blank .

Un hyperlink fără ținta _blank arată astfel:

au eliminat ținta goală a codului linkului
Nicio țintă _blank într-un link

Veți observa că nu este diferit de un hyperlink obișnuit. Asta pentru că hyperlinkurile, în mod implicit, nu se deschid într-o filă nouă. Deci, nu trebuie să faceți nimic linkului decât dacă preferați să se deschidă într-o filă separată a browserului.

Un hyperlink cu ținta _blank, care declanșează deschiderea adresei URL într-o filă separată, arată cam așa:

 < a href = "https://www.example.com" target = "_blank" >View the entire menu.</ a >
o țintă goală a fost acum adăugată
Link pe care se poate face clic cu o _țintă goală

nofollow, noreferrer și noopener

De asemenea, puteți adăuga elemente suplimentare la un link pe care se poate face clic, dintre care majoritatea adaugă securitate sau acoperire de la motoarele de căutare:

  • nofollow: un atribut care blochează „sucul de link-uri SEO” să acceseze site-ul web legat. Acest lucru vă ajută să vă protejați site-ul și poate ascunde linkul de motoarele de căutare.
  • noopener: Acesta este un atribut HTML care este adăugat automat la linkurile WordPress marcate ca „Deschide într-o filă nouă”. Este asociat cu noreferrer pentru a minimiza anumite probleme de securitate în timp ce deschideți linkuri în file noi.
  • noreferrer: Adesea asociat cu noopener , atributul noreferrer blochează transmiterea tuturor informațiilor de recomandare către site-ul țintă, adăugând un plus de securitate și blocând posibil datele de pe site-urile de urmărire și site-urile afiliate cu venituri.

Nu puteți identifica niciunul dintre aceste atribute de legături privind un link de pe site-ul live. În schimb, trebuie să atingeți codul HTML.

Cum arată codarea

Toate aceste atribute ale linkului merg între ghilimele din partea rel="” a linkului pe care se poate face clic.

Este posibil să le includeți pe toate într-un singur link.

rel=noreferrer noopener și nofollow evidențiate în codul de link
Link cu noreferrer, noopener și nofollow toate incluse

Alternativ, puteți vedea că unele hyperlinkuri includ doar un atribut noreferrer noopener sau un nofollow fără celelalte două. Totul depinde de ceea ce vrea să obțină creatorul linkului.

Motive pentru care ați putea dori să faceți clic pe un link

Când învățați cum să faceți clic pe un link, este important să înțelegeți toate motivele din spatele hyperlinkului. În acest fel, ești la curent cu funcțiile și poți profita de ele în viitor.

Iată principalele motive pentru care ați putea dori să faceți clic pe un link:

  1. Hiperlinkuri generale interne/externe către adrese URL: puteți crea legături text care să conducă departe de site-ul dvs. web (cum ar fi pentru citarea surselor sau pentru a întări un argument cu un studiu terță parte) sau către alte pagini de pe site-ul dvs. (în special utile pentru a trimite cititorii către conținut relevant și păstrarea acestora pe site-ul dvs. pentru o perioadă mai lungă de timp).
  2. Legarea imaginilor: puteți adăuga hyperlinkuri către adrese URL, fișiere media sau pagini atașate la orice imagine de pe WordPress și la mulți alți constructori de site-uri web.
  3. Butoanele de conectare: butoanele CSS oferă opțiuni pentru adăugarea de hyperlinkuri, adăugând o experiență vizuală mai atrăgătoare linkului tău pe care se poate face clic în comparație cu textul simplu.
  4. Numere de telefon: numită adesea o funcție „clic pentru a apela”, hyperlinkurile care duc la numere de telefon deschid aplicații cu capabilități de apelare, cum ar fi aplicația de telefon reală de pe dispozitiv sau Skype.
  5. Adrese: hyperlinkarea către anumite coordonate de pe Google sau Apple Maps înseamnă că utilizatorul care face clic pe link va avea acele informații plasate automat în aplicația GPS/hărți pentru navigare.
  6. Adrese de e-mail: este similar cu link-urile „click to call”, dar cu adrese de e-mail. Declanșează aplicația de e-mail pe un telefon sau computer, împreună cu o nouă compoziție de e-mail cu o anumită adresă de e-mail adăugată în câmpul Către .
  7. Pentru a crea link-uri de ancorare: Puteți crea linkuri către conținutul de pe aceeași pagină utilizând link-uri de ancorare; acestea sunt foarte populare pentru crearea unui cuprins la începutul unei postări lungi pe blog. Acestea sunt uneori numite „hiperlinkuri de marcaj”.
  8. Pentru a oferi un fișier descărcabil: WordPress — și alți creatori de site-uri web — oferă instrumente pentru a încărca fișiere SVG, PDF-uri, fișiere HTML și multe altele; puteți chiar să încărcați articole în bloc. După aceea, este posibil să creați hyperlinkuri în postări/pagini pentru ca utilizatorii să descarce fișierele direct pe dispozitivele lor.

Acum că am acoperit tipurile de hyperlinkuri și motivele pentru care ați dori să generați unul, continuați să citiți pentru a afla totul despre cum să faceți acest lucru.

Cum să faci clic pe un link

Metoda pe care o alegeți pentru a crea un link depinde de experiența dvs. Puteți opta pentru o metodă vizuală mai ușoară sau puteți lua în considerare utilizarea codului HTML.

Există patru metode principale pentru a face clic pe un link:

  1. Folosind editorul clasic WordPress
  2. Utilizarea editorului de blocuri WordPress (Gutenberg)
  3. Folosind HTML
  4. Utilizarea oricărei interfețe grafice cu utilizatorul (GUI)

Rețineți că toate aceste metode funcționează în mod similar pentru postările și paginile WordPress. Aceste ghiduri (în special Metoda 4) sunt utile și pentru alți creatori de aplicații/site-uri web, dar unele terminologii/funcționalități pot varia.

Metoda 1: Utilizarea editorului clasic WordPress

Dacă lucrați cu Editorul clasic WordPress, cel mai simplu mod de a crea un link pe care se poate face clic pe o postare sau o pagină este prin fila Editor vizual .

Pentru a face acest lucru, accesați secțiunea Postări sau Pagini din tabloul de bord WordPress și selectați o pagină sau postare individuală pe care doriți să o editați, folosind fila Vizual .

Pasul 1: Evidențiați textul pe care doriți să îl faceți clicabil

Pentru un link text, cel mai bine este să aveți deja textul introdus în editorul vizual . După aceea, utilizați cursorul pentru a evidenția șirul de text.

evidențierea unei secțiuni de text în editorul WordPress
Evidențiați un text

Dacă transformați o imagine într-un link pe care se poate face clic:

Selectați imaginea astfel încât să puteți vedea o bară de instrumente a editorului și un contur în jurul imaginii.

În editorul WordPress, făcând clic și selectând o imagine
Selectați imaginea

Pasul 2: Faceți clic pe butonul Inserați/Editați legătura

Cu textul încă evidențiat, derulați peste butonul Inserare/Editare link din bara de instrumente Visual Editor. Pictograma butonului arată ca o verigă.

textul evidențiat și făcând clic pe butonul Inserați linkul Editare din WordPress
Faceți clic pe butonul Inserați/Editați legătura

Dacă transformați o imagine într-un link pe care se poate face clic:

Cu imaginea încă selectată, faceți clic pe butonul Inserați/Editați legătura (cel care arată ca o verigă).

Postare WordPress unde facem clic pe butonul Editare pentru a lega o imagine
Alegeți butonul Editați

Pasul 3: inserați o adresă URL

Aceasta dezvăluie un câmp URL gol. Copiați (Command + C sau Ctrl + C) adresa URL a linkului dorită în clipboard-ul dispozitivului dvs. Acest link poate fi o adresă URL externă pe care ați găsit-o în altă parte pe internet sau o adresă URL de pe propriul site web.

Odată copiat, lipiți-l (Command + V sau Ctrl + V) în câmp.

Editor WordPress în care lipim o adresă URL în câmp
Lipiți într-o adresă URL

Dacă transformați o imagine într-un link pe care se poate face clic:

Lipiți adresa URL dorită în câmpul afișat, apoi faceți clic pe butonul Aplicați pentru a activa linkul.

Editor de postări WordPress cu o imagine, făcând clic pe butonul de inserare editare link și
Introduceți linkul și faceți clic pe butonul Aplicați

Pasul 4: Aplicați legătura

Faceți clic pe butonul Aplicați pentru a activa linkul și pentru a face clic pe text.

textul evidențiat în WordPress, apoi făcând clic pe butonul albastru de aplicare pentru a adăuga un link
Faceți clic pe butonul Aplicați

Ar trebui să vedeți acum porțiunea de hyperlink a textului subliniată și, eventual, într-o culoare diferită.

Un link care este subliniat pentru a arăta că se poate face clic în backend-ul WordPress
Legătura rezultată

Dacă faceți clic pe hyperlink din editorul dvs., acesta dezvăluie un link live de testat, împreună cu instrumente de editare în cazul în care doriți să schimbați hyperlinkul.

selectând instrumentul de opțiuni de legătură

Faceți clic pe butonul Opțiuni de legătură

Aici poti:

  • Ajustați adresa URL
  • Schimbați textul linkului
  • Deschideți linkul într-o filă nouă
  • Căutați și conectați la conținutul existent pe site-ul dvs
fereastră pop-up cu câmpuri URL, Text link și Căutare
Mai multe opțiuni

Dacă transformați o imagine într-un link pe care se poate face clic:

Editorul Classic WordPress oferă o modalitate secundară de a face clic pe imagini. Asta prin selectarea imaginii, apoi alegând butonul Editare (care arată ca un creion) din bara de instrumente pop-up.

imaginea selectată în WordPress și făcând clic pe butonul Editare

Derulați la câmpul Link către , care vă permite să creați un link către o adresă URL personalizată . Pur și simplu inserați adresa URL dorită în câmpul de mai jos și faceți clic pe Actualizare .

fereastră pop-up nouă cu câmpul Link către disponibil în partea de jos
Găsiți și editați câmpul Link către

De asemenea, puteți selecta meniul derulant Link către pentru a crea un hyperlink către:

  • Fișiere media
  • Pagini atașate
  • Adrese URL personalizate
  • Nici unul
meniul drop-down din câmpul Link către pentru adăugarea diferitelor opțiuni de conectare, cum ar fi pagina atașată și adresa URL personalizată
Alegeți diferite opțiuni de conectare

Metoda 2: Utilizarea editorului de blocuri WordPress (Gutenberg)

Hyperlinkurile funcționează la fel atât în ​​postări, cât și în pagini din Editorul de blocuri WordPress.

Pentru a începe, accesați secțiunea Postări sau Pagini din tabloul de bord WordPress. Selectați o postare sau o pagină individuală pe care doriți să o editați, apoi urmați pașii de mai jos.

Pasul 1: Evidențiați un text

Tastați ceva text în editor. Cu cursorul, evidențiați porțiunea textului pe care doriți să o faceți clicabilă. În bara de instrumente pop-up, faceți clic pe butonul Link .

în WordPress evidențiind text și făcând clic pe butonul Link pentru editorul vizual
Evidențiați textul și faceți clic pe butonul Link

Dacă transformați o imagine într-un link pe care se poate face clic:

A face clic pe o imagine în editorul WordPress Block începe prin adăugarea efectivă a unei imagini în editor.

Pentru a face acest lucru, faceți clic pe butonul Adăugare bloc , apoi selectați blocul Imagine . Încărcați orice imagine pe care doriți să o legați.

în postarea WordPress, există un bloc + buton pentru clic, apoi puteți căuta blocul Imagine
Adăugați un bloc de imagini

Faceți clic pe imagine astfel încât să fie evidențiată/selectată, apoi alegeți butonul Inserare link din fereastra pop-up din bara de instrumente.

făcând clic pe imagine și făcând clic pe butonul Insert Link, care arată ca o pictogramă de link
Selectați imaginea și introduceți linkul

Pasul 2: inserați adresa URL și trimiteți linkul

Veți vedea o fereastră pop-up cu un câmp gol. Inserați orice adresă URL la care doriți să faceți un link, apoi faceți clic pe Enter de pe tastatură sau pe butonul Trimitere pentru a activa linkul pe care se poate face clic.

inserând o adresă URL și făcând clic pe butonul Trimite, care arată ca o săgeată curbă
Introduceți o adresă URL și faceți clic pe Trimiteți

Ca rezultat, textul hyperlink se afișează într-o culoare diferită și puteți face clic pe link pentru a examina o previzualizare a conținutului și pentru a adăuga setări mai avansate de conectare.

făcând clic pe noul link, se afișează o previzualizare vizuală cu linkul paginii, imaginea prezentată și mai multe informații
Vizualizați o previzualizare și setări mai avansate pentru linkuri

Dacă transformați o imagine într-un link pe care se poate face clic:

Există opțiuni pentru hyperlink fișiere media și pagini atașate, dacă doriți.

fereastra pop-up de link pentru imagini are opțiuni pentru a lega fișiere media și pagini atașate
Luați în considerare fișierele media și linkurile paginilor atașate

În caz contrar, inserați o adresă URL în câmpul de link gol. Faceți clic pe butonul Aplicați pentru a activa linkul. După publicare, oricine face clic pe imagine este adus la linkul pe care l-ați specificat.

URL-ul este lipit în câmpul de link și puteți face clic pe Aplicare
Faceți clic pe butonul Aplicați după introducerea unei adrese URL

Pentru mai multe opțiuni, faceți clic pe butonul jos morcov (v) pentru a:

  • Deschideți linkul într-o filă nouă
  • Adăugați Link Rel
  • Adăugați clasă CSS Link
Există un buton jos morcov care arată câmpurile de deschis într-o filă nouă, link rel și link clasă CSS
Faceți clic pe butonul jos morcov pentru mai multe setări

Opțiuni suplimentare

Vom detalia structurile avansate de hyperlink în secțiunile următoare, dar trebuie să știți că un buton Editați este disponibil dacă faceți clic pe cursorul pe linkul nou creat.

există un buton de editare care arată ca un creion
Faceți clic pe butonul Editați

Pagina Editare dezvăluie câmpuri pentru:

  • Schimbați textul linkului
  • Modificați adresa URL
  • Deschideți linkul într-o filă nouă
noua pagină pop-up are câmpuri pentru text, URL și pentru a deschide într-o filă nouă
Pagina Editare

Alte linkuri pe care se poate face clic pe care le puteți face în Editorul de blocuri

Editorul de blocuri WordPress extinde opțiunile obișnuite de conectare disponibile. De fapt, zeci de blocuri încorporate permit un fel de structură de link pe care se poate face clic, inclusiv:

  • Butoane: o modalitate elegantă de a lega conținutul în comparație cu linkurile simple text.
  • Fișiere: Încărcați rapid fișiere și includeți un buton pentru ca utilizatorii să facă clic și să descarce.
  • Pictograme sociale: inserați pictograme sociale cu linkuri pe care se poate face clic.
  • Navigare: plasați butoanele de navigare oriunde pe site-ul dvs. folosind link-uri pe care se poate face clic.
  • Citiți mai multe: Poate fi folosit pentru a vă scurta conținutul și pentru a oferi un link către versiunea mai extinsă.
  • Conectare/Ieșire: Adăugați un link rapid pentru ca utilizatorii să se conecteze la site-ul dvs.
  • Postarea următoare: Adăugați un link/buton pe care se poate face clic la următoarea postare de blog de pe site-ul dvs.
  • Postarea anterioară: Adăugați un link/buton pe care se poate face clic care duce la postarea anterioară de blog de pe site-ul dvs.
a fost adăugat un buton, pe care îl puteți conecta la fel ca orice alt text sau imagine
Un buton este încă un alt stil de link pe care se poate face clic disponibil în Editorul de blocuri WordPress

Metoda 3: Utilizarea HTML

Faceți clic pe un link cu funcții HTML în același mod, indiferent de interfața editorului dvs.

Puteți edita HTML cu:

Panoul Text din Editorul clasic WordPress

făcând clic pe fila text
Panoul WordPress Classic Editor Text

Editorul de cod în Editorul de blocuri WordPress

făcând clic pe butonul de cod
Editorul de cod în Editorul de blocuri WordPress

Un editor HTML/Text pe dispozitivul dvs

Editorii de text precum Atom, Sublime Text și Coda oferă interfața necesară pentru a scrie și edita HTML, în special pentru linkurile pe care se poate face clic. De asemenea, este posibil să utilizați editori de reducere.

editor de text negru cu file deschise cu ceva cod înăuntru
Editorul de text Atom

După ce lucrați cu editorul de text, puteți:

  • Încărcați fișierele pentru a le publica pe internet, prin FTP sau SFTP. Vă recomandăm să utilizați FileZilla pentru cel mai simplu proces.
  • Încărcați în bloc fișiere HTML în directorul de fișiere WordPress.
  • Utilizați unul dintre mulți alți clienți FTP pentru a încărca fișiere HTML în WordPress.

După ce găsiți un editor de text - și știți cum veți încărca HTML-ul în WordPress - treceți la pașii de mai jos pentru a face clic pe un link cu HTML.

Acest format este folosit pentru hyperlinkurile de bază în HTML:

 <a href="https://www.example.com">Link Text</a>
editor text în WordPress cu cod pentru un link
Format de link HTML de bază

Note:

  1. Înlocuiți „https://www.example.com” cu adresa URL dorită.
  2. Înlocuiți „Textul linkului” cu textul linkului dorit.

Odată ce ați pregătit linkul, puteți publica postarea/pagina sau puteți încărca codul HTML pe site-ul dvs. De asemenea, este posibil să obțineți o previzualizare vizuală a linkului trecând la fila Vizual de pe WordPress.

O versiune publicată a acelui link HTML arată linkul subliniat și uneori într-o culoare diferită. Deplasarea mouse-ului peste acel link dezvăluie ținta acestuia în partea de jos a browserului.

postare frontală cu textul linkului subliniat
Link pe front-end cu previzualizarea browserului

Metoda 4: Utilizarea oricărei interfețe grafice cu utilizatorul (GUI)

Deși nu putem acoperi fiecare interfață grafică imaginabilă existentă, a învăța cum să facem clic pe un link în ceva în afară de WordPress sau HTML, de obicei, arată similar cu ceea ce tocmai am acoperit.

În general, fiecare GUI poate folosi un nume de buton sau pictogramă ușor diferit pentru a crea un hyperlink.

Procesul dvs. general ar trebui să decurgă astfel:

  1. Evidențiați textul pe care doriți să îl conectați.
  2. Faceți clic pe pictograma Link (poate avea un alt nume) din editor.
  3. Lipiți în adresa URL dorită.
  4. Faceți clic pe butonul Adăugați link (ar putea avea, de asemenea, un alt nume).

Ca exemplu de bază, un constructor de magazine online, cum ar fi Shopify, vă permite să faceți un link pe care să se poată da clic în orice pagină sau postare, evidențiind text și făcând clic pe butonul Inserați link .

interfața de utilizator Shopify cu textul conectat
Inserarea unui link într-o GUI alternativă

Apoi inserați adresa URL țintă și faceți clic pe butonul Inserați link .

un link a fost lipit, deschis într-o fereastră nouă și introdus
Lipiți adresa URL și faceți clic pe Inserați link

Aceasta produce un link pe care se poate face clic.

linkul subliniat din editorul Shopify
Link pe care se poate face clic într-o altă GUI

Cum se deschid linkurile într-o filă nouă

După cum am discutat mai devreme, WordPress și alte interfețe grafice oferă opțiuni suplimentare de personalizare pentru link-urile pe care se poate face clic, cum ar fi forțarea unui link să se deschidă într-o filă diferită.

Cum faci asta? Hai să aruncăm o privire.

Deschideți linkul într-o filă nouă folosind Editorul clasic WordPress

După ce aveți un link pe care se poate face clic în Editorul clasic WordPress, alegeți butonul Opțiuni de legătură .

făcând clic pe butonul opțiuni de link
Opțiuni de legătură

fereastră pop-up cu opțiunea de a deschide linkul într-o filă nouă

Deschideți linkul într-o filă nouă

Deschideți linkul în filă nouă folosind Editorul de blocuri WordPress

Presupunând că ați adăugat deja un link în Editorul de blocuri WordPress, făcând clic pe link se deschide o previzualizare pop-up a conținutului țintă.

Butonul Editare oferă acces la mai multe setări (inclusiv opțiunea Deschidere într-o filă nouă ), dar este mai ușor să răsturnați comutatorul Deschidere într-o filă nouă> chiar în partea de jos a ferestrei pop-up.

text evidențiat cu un comutator pentru a se deschide într-o filă nouă
Deschideți într-o nouă filă comutator

Deschideți linkul în filă nouă folosind HTML

În editorul de text WordPress, editorul de cod WordPress sau un editor HTML general, puteți utiliza următorul cod pentru a face ca linkul dvs. pe care se poate face clic să se deschidă într-o filă nouă:

 <a href="https://www.example.com" target="_blank" rel="noreferrer noopener">Link Text</a>
  1. Înlocuiți „https://www.example.com” cu adresa URL țintă dorită
  2. Înlocuiți „Textul de legătură” cu orice text pe care doriți să îl legați.
  3. Atributul target=“_blank” este segmentul de cod care deschide de fapt linkul în noua filă. Este singura parte care este cu adevărat necesară pentru această funcție simplă.
  4. Vă recomandăm cu căldură să adăugați atributele și valorile rel="noreferrer noopener" pentru blocarea problemelor obișnuite de securitate atunci când deschideți link-uri în file noi. Cu toate acestea, este complet posibil să le excludeți din cod și să aveți în continuare linkul deschis într-o filă nouă.

După publicare, linkul arată exact la fel; dar, când se dă clic, adresa URL țintă se deschide într-o filă nouă.

browser web frontend cu un link care se deschide într-o filă nouă
Un link care își deschide ținta într-o filă nouă

Cum să adăugați Nofollow la un hyperlink

Valoarea HTML nofollow le spune motoarelor de căutare să ignore un link pe care se poate face clic și oprește transmiterea creditului motorului de căutare (sucul linkului) către site-ul țintă. Scopul principal al nofollow este de a reduce spam-ul, dar creatorii de conținut îl folosesc pentru link-uri plătite, comentarii, conținut generat de utilizatori, încorporare sau oricând nu ați fi văzut ca susținând un site la care vă conectați.

WordPress nu are o modalitate încorporată de a adăuga un link nofollow , dar este posibil accesând codul HTML.

Următorul cod reflectă o legătură de bază cu o valoare nofollow :

 < a href = "https://www.example.com" rel = "nofollow" >The Link Text.</ a >
Cod HTML în editorul de text WordPress clasic
Cod de legătură HTML cu nofollow

Ce vezi:

  1. Înlocuiți textul „https://www.example.com” cu adresa URL țintă dorită.
  2. Înlocuiți partea „Textul linkului” cu textul linkului dorit.
  3. Utilizați atributul și valoarea rel=“nofollow” din linkul HTML.

Când este publicat sau în vizualizarea vizuală, un link nofollow nu arată deloc diferit de un hyperlink standard; totuși, funcționalitatea nofollow este salvată în codul backend.

un link regulat subliniat în interiorul editorului de text
Un link nofollow nu pare diferit pe front-end

Cum se face legătura cu conținutul existent

Conectarea la conținutul existent este o funcție exclusivă pentru WordPress, unde puteți căuta postări și pagini de blog create anterior chiar în editorul WordPress. Acest lucru elimină nevoia de a le afișa adresele URL într-o altă fereastră de browser pentru a le copia și lipi într-un link pe care se poate face clic.

Link către conținutul existent în Editorul clasic WordPress

Creați un link evidențiind textul dorit și făcând clic pe butonul Inserați/Editați link (link) din editor. Aceasta dezvăluie un câmp pop-up, unde puteți face clic pe butonul Opțiuni de legătură (pictograma roată).

textul evidențiat și făcând clic pe fila Opțiuni de legătură
Accesați butonul Opțiuni de legătură
  1. Accesați secțiunea numită „Sau link la conținutul existent”.
  2. Introduceți un cuvânt cheie în bara de căutare, apoi alegeți o pagină sau o postare existentă din rezultate.
  3. Urmăriți cum linkul pentru conținutul existent este plasat automat în câmpul URL.

Asigurați-vă că faceți clic pe butonul Adăugați link când ați terminat.

fereastră pop-up cu secțiunea de căutare
Procesul de găsire a conținutului existent

Aceasta produce o legătură imediată către alt conținut (cunoscut și ca link intern) în editor.

linkul rezultat care este subliniat în editorul clasic
Vederea rezultată a unei legături interne

Link către conținutul existent în Editorul de blocuri WordPress

Evidențiați orice text/imagine pe care doriți să o legați, apoi faceți clic pe butonul Link din bara de instrumente pop-up.

textul evidențiat în WordPress și butonul de link
Faceți clic pe butonul Link

Câmpul furnizat are două funcții: puteți să lipiți o adresă URL sau să o utilizați ca bară de căutare. Prin urmare, introduceți orice cuvânt cheie care se referă la o parte din conținutul dvs. existent pentru a dezvălui rezultate aferente.

După ce vedeți pagina sau postarea dorită, faceți clic pe ea.

introducerea unui cuvânt cheie și vizualizarea rezultatelor pentru conținutul asociat
Căutați conținut anterior

Aceasta creează automat o legătură către conținutul existent în Editorul de blocuri WordPress.

Cum să faci clic pe legături telefonice, SMS și e-mail

Există câteva modalități de a adăuga acțiuni speciale la link-urile pe care se poate face clic prin schimbarea structurii standard a URL-ului și trimiterea către ceva diferit, cum ar fi:

  • Un număr de telefon care deschide aplicația Telefon.
  • Un număr de telefon care deschide aplicația de mesaje text.
  • O adresă de e-mail care deschide automat aplicația de e-mail a utilizatorului.

Cum să faci o legătură telefonică pe care se poate face clic

Un „click pentru a apela” sau o legătură telefonică adaugă automat un anumit număr de telefon în aplicația de telefon a utilizatorului sau chiar o aplicație care acceptă numere de telefon, cum ar fi Skype.

În loc să utilizați o adresă URL, ați introduce codul tel: în HTML, urmat de un număr de telefon, astfel:

 < a href = "tel:555-555-5555" >Click To Call</ a >

Note:

  1. Înlocuiți numărul de telefon cu numărul pe care doriți să îl apeleze utilizatorii.
  2. Înlocuiți textul „Click To Call” cu orice doriți să afișeze textul linkului.
inserarea unui număr de telefon în câmpul URL din WordPress
Un tel: link în editorul vizual

În editorii vizuali precum WordPress Block și WordPress Classic, tastați pur și simplu tel:555-555-5555 (cu numărul de telefon dorit) în câmpul URL pentru un link. Faceți clic pe Enter pentru ca acesta să genereze automat linkul de telefon pentru dvs.

Când cineva face clic pe acel link, fie este trimis direct la cea mai relevantă aplicație (aplicația pentru telefon de pe un smartphone), fie vede o solicitare de a deschide o aplicație precum Skype.

fereastra browserului care îi spune utilizatorului să deschidă o aplicație pentru telefon
Link-ul tel: se deschide în Skype sau în alte aplicații pentru telefon

Cum să faci un link SMS pe care se poate face clic

Linkurile SMS pe care se poate face clic funcționează la fel ca linkurile de telefon, dar optează pentru a deschide automat aplicațiile de mesagerie în loc să apeleze aplicațiile.

Pentru a adăuga o legătură SMS, utilizați sms:555-555-5555 în loc de o adresă URL.

 < a href = "sms:555-555-5555" >Click To Text</ a >

Note:

  1. Înlocuiți „555-555-5555” cu un alt număr de telefon.
  2. Înlocuiți „Click To Text” cu orice text doriți pentru link.

Atât editorii Classic, cât și Block WordPress acceptă linkuri SMS atunci când introduceți valoarea sms:555-555-5555 în câmpul URL pentru linkuri.

După cum am promis, utilizatorii văd aplicații de mesagerie atunci când fac clic pe aceste tipuri de linkuri.

browser cu notificare pentru a deschide numărul de telefon într-o aplicație SMS
Un sms: linkul se deschide în cea mai relevantă aplicație de mesagerie

Cum să faci un link de e-mail pe care se poate da clic

Când se dă clic, hyperlinkurile de e-mail solicită automat dispozitivului utilizatorului să deschidă cea mai relevantă aplicație de e-mail, împreună cu o secțiune Compose care merge la o anumită adresă de e-mail.

Pentru aceasta, adăugați codul mailto:, urmat de o adresă de e-mail, unde de obicei ați pune o adresă URL țintă.

 < a href = "mailto:[email protected]" >Click To Email</ a >

Note:

  1. Înlocuiți adresa de e-mail „[email protected]” cu adresa de e-mail țintă dorită.
  2. Înlocuiți textul „Click To Email” cu orice doriți să arate textul linkului.

Dacă utilizați WordPress Classic sau Block Editors, introduceți pur și simplu valoarea mailto:[email protected] în câmpul URL când faceți un link.

Un mailto: link într-un editor vizual WordPress

După ce publicați linkul, utilizatorii care fac clic pe el sunt redirecționați către aplicația lor de corespondență, cu adresa de e-mail pe care ați specificat-o inclusă în câmpul Către:.

client de e-mail cu adresa de e-mail adăugată în câmpul Către
Mailto: conectează aplicațiile de e-mail deschise cu adresa de e-mail specificată inclusă

Linkurile pe care se poate face clic pot părea un mic detaliu, dar cu siguranță fac foarte mult pentru site-ul tău! Fă-o corect cu acest ghid Click to Tweet

rezumat

Adăugarea de link-uri pe care se poate face clic (cunoscute și ca hyperlink-uri sau doar link-uri) poate îmbunătăți interactivitatea pe site-ul dvs. web, poate conduce oamenii la mai mult din conținutul dvs. și poate face referire la informații importante din altă parte de pe internet. Ca atare, a învăța cum să faci un link pe care se poate face clic este una dintre lecțiile de bază ale designului site-ului web și creării de conținut.

După ce ați citit acest articol, ar trebui să puteți identifica aspectul unui link pe care se poate face clic și să știți exact cum să creați unul, fie că este vorba de adăugarea unui link către text sau imagini. De asemenea, este plăcut să știți că există diverse metode de a face clic pe un link, cum ar fi prin Editorul clasic WordPress, Editorul bloc, HTML sau orice interfață grafică de utilizator disponibilă.

Și, desigur, vă încurajăm să explorați opțiuni de linkuri mai avansate pe care se poate face clic, cum ar fi linkuri pentru numere de telefon, adrese de e-mail și cele cu etichete nofollow.

Dacă mai aveți întrebări despre cum să faceți clic pe un link, împărtășiți întrebările și preocupările dvs. în comentariile de mai jos.