Cum să păstrați CSS personalizat atunci când actualizați o temă WordPress
Publicat: 2022-05-05Temele determină aspectul și aspectul site-urilor web WordPress. Indiferent de tema pe care o alegeți, ar putea fi necesar să o personalizați puțin pentru a se potrivi nevoilor dvs. specifice.
O modalitate de a vă personaliza tema este să utilizați Cascading Style Sheets (CSS). Acest limbaj popular pentru foi de stil vă va permite să schimbați aproape orice element al temei. Puteți adăuga CSS personalizat la tema dvs. pentru a specifica culorile de fundal, pentru a modifica dimensiunile fonturilor, pentru a crea spații între conținut, pentru a repoziționa meniurile și multe altele. Cu toate acestea, CSS personalizat poate fi șters data viitoare când vă actualizați tema.
De ce actualizările temei întrerup CSS personalizat
Toate temele au un fișier style.css. Disponibil în folderul cu teme, conține CSS. Când actualizați tema, veți descărca o versiune nouă, diferită a acesteia, cu care să înlocuiți versiunea existentă.
Actualizarea temei va șterge fișierul style.css existent și îl va înlocui cu un fișier style.css nou, proaspăt. Noul fișier style.css nu va conține niciun CSS personalizat pe care l-ați fi adăugat anterior. Puteți oricând să adăugați înapoi CSS-ul personalizat șters, dar a face acest lucru după fiecare actualizare a temei poate fi plictisitor.
Adăugați la Personalizator
Puteți păstra CSS personalizat atunci când vă actualizați tema, adăugându-l la elementul de personalizare. Personalizatorul este un instrument de personalizare a temei în tabloul de bord WordPress. Are un câmp „CSS suplimentar”. În loc să adăugați CSS personalizat direct la style.css al temei, îl puteți adăuga în acest câmp.
Câmpul „CSS suplimentar” a fost introdus în versiunea 4.7 a WordPress pentru a preveni ștergerea CSS personalizat în timpul actualizărilor temei. Nu afectează fișierul style.css și nici alte fișiere din folderul cu teme. Când adăugați CSS personalizat la personalizare prin acest câmp, acesta va fi stocat în baza de date a site-ului dvs. web. Puteți apoi să vă actualizați tema păstrând CSS-ul personalizat.
Pentru a accesa elementul de personalizare, faceți clic pe „Aspect” în tabloul de bord WordPress și alegeți „Personalizați”. Fila „CSS suplimentar” este aproape de jos. Făcând clic pe această filă, se va afișa un câmp în care puteți introduce CSS personalizat. Actualizarea temei va înlocui doar fișierele din folderul cu teme. Nu va înlocui și nici nu va afecta în alt mod baza de date a site-ului dvs. web, astfel încât CSS-ul personalizat va fi păstrat.
Adăugarea CSS personalizat la personalizare vă permite să-l previzualizați. Personalizatorul are o funcție de previzualizare încorporată pentru toate modificările. Indiferent dacă setați widget-uri noi sau adăugați CSS personalizat, elementul de personalizare va dezvălui cum va arăta site-ul dvs. Apoi puteți alege să continuați cu personalizarea făcând clic pe „Publicați”. Dacă site-ul dvs. web nu arată corect, puteți modifica opțiunile de personalizare înainte de a-l activa. Indiferent, personalizarea va afișa o previzualizare a site-ului dvs. web cu CSS personalizat.
Creați o temă pentru copii
O altă soluție este crearea unei teme pentru copil. Temele pentru copii sunt în esență copii ale altor teme pe care le puteți personaliza fără teama de a vă pierde modificările. Nu sunt copii complete. Mai degrabă, majoritatea temelor copil constau din doar câteva fișiere de bază, inclusiv un fișier style.css și un fișier functions.php.
Temele copil sunt concepute pentru a moșteni proprietățile unei teme părinte. Vă puteți folosi tema ca temă părinte. Tema copil va avea propriul folder, care va conține propriul fișier style.css și fișierul functions.php. Tema copil, totuși, nu va conține un fișier index.php, un fișier page.php, un fișier single.php sau alte fișiere tematice standard. Va folosi tema părinte pentru aceste proprietăți.
Deoarece temele copil au propriul fișier style.css, acestea acceptă CSS personalizat. Mai important, temele copil își păstrează toate CSS-urile personalizate atunci când temele lor părinte sunt actualizate. Actualizarea temei părinte nu va afecta fișierul style.css al temei secundare. Pentru instrucțiuni despre cum să creați o temă copil, vizitați developer.wordpress.org/themes/advanced-topics/child-theme. Alternativ, unele teme premium vin cu o temă pentru copii.
Pentru doar câteva rânduri de CSS personalizat, poate doriți să îl adăugați la personalizat. Pentru cantități mai mari de CSS personalizate, crearea unei teme copil merită probabil efortul. O temă copil vă va oferi un fișier style.css separat pe care îl puteți personaliza.
Puteți chiar să lucrați offline la fișierul style.css al temei copil și, deoarece este un fișier separat, veți avea suficient spațiu pentru CSS personalizat. Adăugarea CSS personalizat la personalizare vă va restricționa la un câmp mic care este accesibil doar online. Personalizatorul oferă avantajul unui mod de previzualizare, în timp ce o temă copil oferă beneficiul unui fișier style.css separat.
Utilizați un plugin CSS personalizat
Puteți utiliza un plugin CSS personalizat. Pluginul CSS personalizat simplu, de exemplu, face exact ceea ce sună: vă permite să adăugați cu ușurință CSS personalizat la tema dvs. CSS personalizat adăugat la plugin va suprascrie propriul CSS al temei.
După ce ați activat pluginul CSS personalizat simplu, ar trebui să vedeți o nouă filă „CSS personalizat” sub „Aspect” în tabloul de bord WordPress. Aici puteți adăuga CSS personalizat. Când vă actualizați tema, CSS-ul personalizat va fi păstrat. Actualizarea temei va înlocui fișierul style.css al temei, dar pluginul va înlocui noul fișier style.css cu CSS personalizat.
Există, de asemenea, pluginul Simple Custom CSS și JS, care acceptă atât CSS personalizat, cât și JavaScript personalizat. Îl puteți folosi pentru a crea CSS personalizat care înlocuiește propriul CSS al temei. Dacă nu doriți să vă încurcați cu crearea unei teme secundare, poate doriți să utilizați un plugin CSS personalizat. Descărcarea unui plugin CSS personalizat este o modalitate ușoară de a păstra CSS personalizat în timpul actualizărilor temei.
Concluzie
Este frustrant când pierzi CSS personalizat după actualizarea unei teme. Chiar dacă ați salvat CSS-ul personalizat local pe computer, va trebui să vă întoarceți și să îl adăugați. Puteți păstra CSS-ul personalizat al temei dvs. utilizând elementul de personalizare din tabloul de bord WordPress, creând o temă secundară sau folosind un plugin CSS personalizat.
