Cum să schimbi culoarea linkului în WordPress (Ghid pentru începători)

„Cum fac linkurile mele să iasă în evidență?” Aceasta este o întrebare pe care o auzim în mod regulat de la cititorii noștri WPBeginner.

Deși ar putea părea un detaliu minor, culorile linkurilor joacă un rol important în utilizabilitatea și ratele de conversie ale site-ului dvs. web. Acesta este motivul pentru care folosim culoarea portocalie pentru linkuri la WPBeginner.

Vestea bună este că schimbarea culorilor linkurilor în WordPress a devenit mult mai ușoară decât era înainte. Nu aveți nevoie să fiți un expert CSS sau să angajați un dezvoltator – există acum soluții simple pe care oricine le poate folosi, indiferent de abilitățile lor tehnice.

În acest ghid, vă vom prezenta pașii exacți pentru a vă schimba culorile linkurilor în WordPress.

De ce să schimbi culoarea linkurilor în WordPress?

Când adăugați un link în WordPress, tema dvs. va determina automat culoarea acelui link. Uneori, culorile implicite ale temei dvs. WordPress vor fi exact ceea ce doriți, dar s-ar putea să aveți nevoie de mai mult control asupra modului în care arată linkurile.

De exemplu, ați putea dori să schimbați culoarea linkului pentru a se potrivi cu marca dvs. sau cu logo-ul personalizat. Sau ați putea dori să creșteți contrastul culorilor pentru a face site-ul dvs. mai accesibil pentru cititorii cu vedere limitată.

Acestea fiind spuse, haideți să vedem cum să schimbați culoarea linkurilor pe site-ul dvs. WordPress, indiferent de tema pe care o folosiți. Pur și simplu folosiți legăturile rapide de mai jos pentru a sări direct la metoda pe care doriți să o utilizați:

• Cum să schimbați culoarea linkului în temele clasice WordPress
• Cum să schimbați culoarea linkurilor în temele bloc WordPress
• Cum să schimbați culorile individuale ale linkurilor în editorul pe blocuri
• Cum să schimbați culoarea linkurilor în WordPress cu cod (toate temele)
• Tutorial video

Cum să schimbați culoarea linkului în temele clasice WordPress

Unele teme clasice au opțiuni încorporate pentru schimbarea culorilor linkurilor, dar va trebui să verificați mai întâi setările temei dvs. specifice.

Pentru a vedea dacă tema dvs. are această opțiune, accesați Aspect » Personalizare. Apoi căutați o setare care spune „Culori” sau ceva similar. În tema Sydney , este etichetată pur și simplu ca „Culori”.

Apoi, găsiți o setare care vă permite să schimbați culorile linkurilor.

Sydney face această operațiune simplă cu opțiuni de „Culoare link” atât pentru stările implicite, cât și pentru cele la hover.

Culoarea la hover a linkului este cea care apare atunci când un vizitator își plasează mouse-ul peste un link, deci este o modalitate excelentă de a le atrage atenția și de a îmbunătăți rata de clic.

Apoi puteți face clic pe „Publicare” pentru a salva modificările.

Rețineți că unele teme, cum ar fi Neve, nu au setări directe pentru culoarea linkurilor. În schimb, culoarea linkului ar putea fi legată global de culorile primare sau secundare ale temei dvs.

Dacă tema dvs. nu oferă personalizarea directă a culorii linkurilor, nu vă faceți griji! Puteți accesa a patra metodă, unde vă vom arăta cum să schimbați culoarea linkurilor folosind cod.

Cum să schimbați culoarea linkurilor în temele bloc WordPress

Dacă folosești o temă de bloc, atunci va trebui să folosești editorul complet al site-ului pentru a-ți personaliza culorile linkurilor.

Accesați Aspect » Editor din tabloul de bord WordPress.

Veți vedea toate meniurile pentru a personaliza aspectul site-ului dvs.

Aici, faceți clic pe „Stiluri”.

Vei vedea stilurile implicite ale temei tale afișate.

Caută și apasă pe butonul de editare cu creionul pentru a începe personalizarea.

Editorul pentru întregul site se va deschide cu o bară laterală pentru editarea stilurilor temei tale.

Faceți clic pe „Culori” în această bară laterală pentru a accesa opțiunile de personalizare a culorilor.

Găsiți opțiunea Link și faceți clic pe ea pentru a afișa setările de culoare atât pentru stările implicite, cât și pentru cele la hover. Asigurați-vă că faceți selecțiile de culori pentru a se potrivi cu designul site-ului dvs.

Odată ce sunteți mulțumit de modificările dvs., pur și simplu faceți clic pe „Salvare” pentru a le face live pe site-ul dvs.

Cum să schimbați culorile individuale ale linkurilor în editorul pe blocuri

Uneori, s-ar putea să doriți să schimbați culoarea linkurilor individuale. De exemplu, ați putea dori să atrageți atenția vizitatorului asupra apelului la acțiune pe o pagină de destinație.

Pentru a face acest lucru, pur și simplu evidențiați linkul pe care doriți să îl personalizați. Apoi, faceți clic pe pictograma săgeată din mini-bara de instrumente și selectați „Evidențiere”.

Acum puteți selecta fie „Background” (Fundal), fie „Text” (Text), în funcție de modificarea pe care doriți să o faceți.

După ce ați terminat, selectați culoarea pe care doriți să o utilizați.

Pentru a personaliza mai multe linkuri, pur și simplu repetați acești pași.

Când ești mulțumit de cum arată linkurile, apasă pe „Salvează” pentru a face modificările tale publice.

Cum să schimbați culoarea linkurilor în WordPress cu cod (toate temele)

Dacă tema dvs. nu oferă opțiunea de a schimba culoarea linkului, atunci cea mai ușoară metodă este să adăugați CSS personalizat pe site-ul dvs. WordPress.

Adesea, veți găsi fragmente de cod în tutorialele WordPress cu instrucțiuni de a le adăuga în fișierul functions.php al temei dvs.

Cea mai mare problemă este că chiar și o mică greșeală în fragmentul de cod personalizat poate defecta site-ul dvs. WordPress și îl poate face inaccesibil. De asemenea, veți pierde toate personalizările dvs. data viitoare când actualizați tema WordPress.

Aici intervine WPCode.

După testări amănunțite, am ajuns la concluzia că este cea mai sigură și mai ușoară modalitate de a adăuga cod personalizat pe site-ul dvs. web. Pentru detalii, consultați recenzia noastră despre WPCode.

Primul lucru pe care trebuie să îl faceți este să instalați și să activați pluginul gratuit WPCode. Pentru mai multe detalii, consultați ghidul nostru pas cu pas despre cum se instalează un plugin WordPress.

După activare, accesați Fragmente de cod » Adăugare fragment.

Aici, pur și simplu plasați cursorul mouse-ului peste „Add Your Custom Code (New Snippet)”.

Apoi, faceți clic pe butonul „+ Adaugă fragment personalizat” atunci când apare.

Apoi, trebuie să selectați „Fragment de cod CSS” ca tip de cod din lista de opțiuni afișate pe ecran.

După aceea, introduceți un titlu pentru fragmentul de cod personalizat. Acesta poate fi orice ajută la identificarea fragmentului în tabloul de bord WordPress.

Acum puteți adăuga un fragment CSS personalizat în caseta de cod. Să analizăm câteva dintre diferitele fragmente pe care le puteți utiliza.

Schimbă culoarea linkurilor pe întregul site WordPress

Pentru început, s-ar putea să doriți să personalizați culoarea generală a linkurilor. Aceasta este culoarea pe care vizitatorii o vor vedea înainte de a face clic pe un link.

Pentru a face acest lucru, pur și simplu adăugați următorul fragment în caseta de cod WPCode:

a {
     color: #FFA500;
}

În exemplul de mai sus, codul hexazecimal # va schimba culoarea linkului în portocaliu, deci va trebui să schimbați#FFA500 cu culoarea pe care doriți să o utilizați.

Dacă nu sunteți sigur ce cod hexazecimal să folosiți, puteți explora diferite culori și obține codurile lor pe site-ul HTML Color Codes.

Când sunteți mulțumit de cum arată codul dvs., faceți clic pe comutatorul „Inactiv” pentru ca acesta să afișeze „Activ” în schimb. În final, faceți clic pe „Salvare fragment” pentru a face fragmentul CSS live.

Acum, dacă vizitați site-ul dumneavoastră WordPress, veți vedea noua culoare a linkului în acțiune.

Schimbarea culorii linkului la trecerea cu mouse-ul în WordPress

Pentru a schimba culoarea de hover a linkului, pur și simplu lipiți următorul fragment în editorul WPCode:

a:hover {
     color: #FF0000;
     text-decoration: underline;
}

Codul de mai sus va schimba culoarea linkului în roșu și va sublinia textul atunci când vizitatorii trec cu mouse-ul peste el. Ca și înainte, puteți schimba codul hexazecimal #FF0000 cu orice culoare doriți să utilizați.

Când sunteți gata să publicați, puteți publica fragmentul de cod urmând același proces descris mai sus.

Schimbarea culorii linkului după vizitare în WordPress

Apoi, s-ar putea să dorești să schimbi culoarea linkului după ce un utilizator a făcut clic pe el. Acest lucru poate ajuta vizitatorii să se orienteze pe blogul tău WordPress, arătând ce linkuri au fost deja accesate.

Puteți utiliza codul CSS de mai jos pentru a schimba culoarea linkurilor vizitate:

a:visited {
     color: #0000FF;
}

Ca întotdeauna, asigurați-vă că schimbați codul hexazecimal albastru #0000FF cu culoarea pe care doriți să o utilizați în linkurile dvs.

După ce ați terminat, faceți clic pe comutatorul „Inactiv” pentru ca acesta să se schimbe în „Activ”. Apoi, pur și simplu faceți clic pe „Salvare fragment” pentru a face codul activ pe site-ul, blogul sau magazinul dvs. online.

Tutorial video

Dacă nu vă plac instrucțiunile scrise, puteți viziona tutorialul nostru video în schimb:

Sperăm că acest articol v-a ajutat să învățați cum să schimbați culoarea linkurilor în WordPress. De asemenea, ați putea dori să consultați ghidul nostru despre cum să schimbați culoarea textului în WordPress sau ghidul nostru complet despre cele mai eficiente elemente de design WordPress.

Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.