Doriți să schimbați culorile sau fonturile site-ului dvs. WordPress, dar vă temeți că veți strica ceva? Mulți începători presupun că acest lucru necesită editarea fișierelor temei, unde chiar și o mică greșeală poate cauza probleme mari.
În primele zile ale WordPress, singura modalitate de a adăuga CSS personalizat era prin editarea directă a acestor fișiere. Ne amintim cât de stresant era și cum un singur caracter greșit putea bloca un întreg site.
Din fericire, nu mai este cazul. WordPress oferă acum modalități sigure, prietenoase pentru începători, de a adăuga CSS personalizat folosind Personalizatorul de temă, Editorul complet al site-ului (FSE) sau un plugin precum WPCode.
În acest ghid, vă vom prezenta trei metode simple pentru a adăuga CSS personalizat pe site-ul dvs. WordPress, pas cu pas. 🙌
De ce să adăugați CSS personalizat în WordPress?
Adăugați CSS personalizat în WordPress pentru a obține un control mai mare asupra designului site-ului dvs. decât permit setările temei. De exemplu, puteți ajusta dimensiunile fonturilor, schimba culorile butoanelor sau adăuga spațiu suplimentar anumitor secțiuni.
CSS (Cascading Style Sheets) este limbajul care stilizează site-ul dvs., gestionând lucruri precum culorile, fonturile, spațierea și aspectele. Scriind propriul CSS, puteți ajusta aspectul site-ului dvs. fără a schimba temele sau a instala plugin-uri suplimentare.
Această flexibilitate înseamnă că poți personaliza postări individuale, stiliza categorii de produse în magazinul tău, sau chiar optimiza modul în care site-ul tău arată pe mobil comparativ cu desktopul.
În acest ghid, vă vom arăta diferitele moduri de a adăuga CSS personalizat pe site-ul dvs. WordPress.
Puteți face clic pe linkul de mai jos pentru a sări la orice secțiune care vă interesează:
- Metoda 1: Adăugarea CSS personalizat folosind Personalizatorul temei (Teme clasice)
- Metoda 2: Adăugarea de CSS personalizat folosind pluginul WPCode (Toate temele)
- Metoda 3: Adăugarea CSS suplimentar cu Editorul Complet al Site-ului (Teme Bloc)
- Sfat bonus: Utilizarea unui plugin CSS personalizat vs. Adăugarea CSS în personalizatorul temei
- Întrebări frecvente: Adăugarea CSS personalizat la site-ul dvs. WordPress
- Mai multe sfaturi și trucuri CSS pentru site-ul dvs. WordPress
Gata? Să începem.
Metoda 1: Adăugarea CSS personalizat folosind Personalizatorul temei (Teme clasice)
De la WordPress 4.7, utilizatorii pot adăuga acum CSS personalizat direct din zona de administrare WordPress. Acest lucru este foarte ușor și puteți vedea modificările instantaneu cu o previzualizare live.
Notă: Această metodă este doar pentru temele clasice. Dacă utilizați o temă bloc, atunci va trebui să alegeți una dintre celelalte metode.
Mai întâi, va trebui să accesați pagina Aspect » Personalizare din tabloul de bord WordPress.
Aceasta va lansa interfața personalizator de teme WordPress.
Pe această pagină, puteți vedea previzualizarea live a site-ului dvs. cu o mulțime de opțiuni de personalizare în panoul din stânga. În funcție de tema dvs. WordPress, aspectul acestui meniu poate varia ușor. În exemplul nostru, folosim tema Sydney.
Pur și simplu găsește fila „CSS suplimentar” pentru a începe editarea.
Fila se va glisa pentru a vă afișa o casetă simplă unde puteți adăuga CSS-ul personalizat.
De îndată ce adăugați o regulă CSS validă, veți putea să o vedeți aplicată în panoul de previzualizare live al site-ului dvs.
Puteți continua să adăugați cod CSS personalizat până când sunteți mulțumit de modul în care arată modificările pe site-ul dvs.
Nu uitați să faceți clic pe butonul „Publică” din partea de sus când ați terminat.
ℹ️ Notă: Orice CSS personalizat pe care îl adăugați folosind personalizatorul temei este disponibil doar cu acea temă particulară. Dacă doriți să îl utilizați cu alte teme, va trebui să îl copiați și să îl lipiți în noua temă folosind aceeași metodă.
Metoda 2: Adăugarea de CSS personalizat folosind pluginul WPCode (Toate temele)
Prima metodă vă permite doar să salvați CSS personalizat pentru tema activă în prezent. Dacă schimbați tema, atunci s-ar putea să fie necesar să copiați și să lipiți CSS-ul personalizat în noua temă.
Dacă doriți ca CSS-ul dvs. personalizat să fie aplicat indiferent de tema WordPress pe care o utilizați, această metodă este pentru dvs.
WPCode este cel mai bun plugin pentru fragmente de cod personalizate de pe piață, cu peste 2 milioane de utilizatori. Pe lângă faptul că face adăugarea de cod personalizat în WordPress ușoară, vine cu funcționalități precum o bibliotecă încorporată de fragmente de cod, logică condițională, pixeli de conversie și multe altele.
Folosim WPCode pentru a adăuga și gestiona fragmente de cod pe unele mărci partenere. Pentru o analiză aprofundată a funcționalităților și beneficiilor sale, consultați recenzia noastră completă despre WPCode.
Acum, primul lucru pe care trebuie să-l faceți este să instalați și să activați pluginul WPCode. Dacă aveți nevoie de ajutor, vă rugăm să consultați ghidul nostru despre cum să instalați un plugin WordPress.
ℹ️ Notă: Acest tutorial funcționează cu versiunea gratuită a pluginului WPCode, astfel încât să poți începe imediat. Dacă decizi să faci upgrade la WPCode Pro, vei debloca funcționalități utile, cum ar fi snippet-uri programate, istoricul complet al reviziilor și accesul la biblioteca completă de snippet-uri gata de utilizare, aprobate de dezvoltatori.
După activare, pur și simplu accesați Code Snippets » + Add New din zona de administrare WordPress.
Apoi, puteți trece cu mouse-ul peste opțiunea „Adăugați codul dvs. personalizat (Fragment nou)” din biblioteca de fragmente de cod și faceți clic pe „Utilizați fragmentul”.
Pe ecranul următor, vei selecta tipul de cod pentru fragmentul tău CSS personalizat.
Continuați și faceți clic pe „Fragment CSS” ca tip de cod.
În continuare, în partea de sus a paginii, puteți adăuga un titlu pentru fragmentul dvs. CSS personalizat. Acesta poate fi orice vă ajută să identificați codul.
După ce ați introdus un titlu, puteți scrie sau lipi CSS-ul personalizat în caseta „Previzualizare cod”.
Să derulăm acum în jos la secțiunea „Inserare” și să selectăm metoda „Inserare automată” dacă doriți să executați codul pe întregul dvs. site WordPress.
Dacă doriți să executați codul doar pe anumite pagini sau postări, puteți alege metoda „Shortcode”.
Acum, veți dori să reveniți în partea de sus a paginii.
Apoi, pur și simplu comutați comutatorul la „Activ” și apoi faceți clic pe butonul „Salvează fragmentul”.
Asta e tot! Puteți vizita site-ul dvs. WordPress pentru a vedea CSS-ul personalizat în acțiune.
Metoda 3: Adăugarea CSS suplimentar cu Editorul Complet al Site-ului (Teme Bloc)
Dacă folosiți o temă modernă temă bloc, cel mai bun loc pentru a adăuga CSS-ul personalizat este direct în Editorul Complet al Site-ului. Această metodă păstrează CSS-ul dvs. cu setările de stil ale temei și vă permite să vedeți o previzualizare live.
Mai întâi, trebuie să navigați la Aspect » Editor din tabloul de bord WordPress.
Aceasta va deschide Editorul Complet al Site-ului.
În meniul din stânga, faceți clic pe fila „Stiluri”.
Acum ar trebui să vedeți panoul „Stiluri” pentru site-ul dvs., precum și previzualizarea paginii.
De aici, să facem clic pe previzualizare pentru a deschide editorul de blocuri.
În editorul de conținut, faceți clic pe pictograma „Stiluri”. Arată ca un cerc pe jumătate negru și pe jumătate alb.
După aceea, continuați și selectați „CSS suplimentar”.
În glisorul CSS, veți găsi câmpul „CSS suplimentar”.
Puteți introduce CSS-ul aici și veți vedea modificările instantaneu în previzualizarea live.
Odată ce sunteți mulțumit de tot, nu uitați să faceți clic pe „Salvare” în colțul din dreapta sus pentru a publica modificările.
Sfat bonus: Utilizarea unui plugin CSS personalizat vs. Adăugarea CSS în personalizatorul temei
Toate metodele descrise mai sus sunt recomandate pentru începători. Utilizatorii avansați pot adăuga, de asemenea, CSS personalizat direct în temele lor.
Cu toate acestea, adăugarea de fragmente CSS personalizate la tema părinte nu este recomandată. Modificările dvs. CSS se vor pierde dacă actualizați accidental tema fără a salva modificările personalizate.
Cea mai bună abordare este să folosiți o temă copil în schimb. Cu toate acestea, mulți începători evită crearea unei teme copil, deoarece li se pare intimidant procesul. De asemenea, începătorilor le lipsește adesea înțelegerea modului în care vor folosi tema copil dincolo de simpla adăugare de CSS personalizat.
Utilizarea unui plugin CSS personalizat vă permite să stocați CSS-ul personalizat independent de tema dvs. În acest fel, puteți schimba cu ușurință temele, iar CSS-ul dvs. personalizat va rămâne.
Un alt mod excelent de a adăuga CSS personalizat pe site-ul dvs. WordPress este prin utilizarea pluginului CSS Hero. Acest plugin minunat vă permite să editați aproape fiecare stil CSS de pe site-ul dvs. WordPress fără a scrie o singură linie de cod.
Puteți adăuga, de asemenea, CSS personalizat cu pluginul SeedProd, cel mai bun constructor de pagini WordPress drag-and-drop.
Cu SeedProd, puteți crea teme WordPress personalizate și pagini de destinație pentru site-ul dvs. WordPress. Puteți edita cu ușurință setările globale CSS; nu este necesar cod.
Unele dintre mărcile noastre partenere și-au proiectat întregul site web cu SeedProd. Asigurați-vă că citiți recenzia noastră detaliată despre SeedProd pentru a vedea de ce este o alegere de top pentru crearea de site-uri web uimitoare.
Întrebări frecvente: Adăugarea CSS personalizat la site-ul dvs. WordPress
Vrei să-ți faci site-ul WordPress cu adevărat al tău cu stiluri personalizate? Iată câteva întrebări frecvente despre adăugarea sigură de CSS personalizat și cum să o faci fără a-ți strica site-ul:
Este riscantă adăugarea de CSS personalizat pentru site-ul meu?
Nu dacă o faci corect. Instrumente precum WordPress Theme Customizer, WPCode, sau SeedProd vă permit să previzualizați modificările înainte de a le publica. Acest lucru vă ajută să evitați greșelile și să vă păstrați site-ul în siguranță.
Se vor dispărea modificările mele CSS dacă schimb temele?
Dacă ați adăugat CSS prin personalizatorul temei, modificările dvs. sunt legate de acea temă specifică. În acest caz, da, CSS-ul dvs. suplimentar va dispărea dacă schimbați tema WordPress.
Pentru a menține CSS-ul consecvent pe toate temele, puteți utiliza un plugin de fragmente de cod precum WPCode. Acesta stochează codul dvs. separat, astfel încât acesta rămâne activ chiar dacă schimbați temele.
Pot să anulez modificările dacă ceva nu merge bine?
Da, mai ales dacă folosiți un plugin pentru fragmente de cod precum WPCode. Puteți dezactiva sau șterge cu ușurință orice fragment pe care l-ați adăugat. Este întotdeauna o idee bună să previzualizați mai întâi modificările sau să le testați pe un site de staging dacă nu sunteți sigur.
Ce se întâmplă dacă vreau și mai mult control asupra CSS-ului meu?
Pentru modificări mai avansate, puteți crea o temă copil. Aceasta vă oferă control complet și păstrează modificările dvs. în siguranță în timpul actualizărilor temei. Dar necesită o înțelegere de bază a modului în care funcționează temele WordPress.
Am nevoie de abilități de codare pentru a adăuga CSS personalizat?
Nu trebuie să fii un dezvoltator, dar va trebui să cunoști puțin CSS, cel puțin suficient pentru a copia și lipi codul corect sau pentru a urma un tutorial.
Vestea bună este că există o mulțime de resurse prietenoase pentru începători (cum ar fi WPBeginner!) pentru a te ajuta să înveți ajustări simple de CSS pas cu pas. Cu instrumentele potrivite, adăugarea de CSS poate părea în continuare gestionabilă – mai mult ca rearanjarea mobilei decât reconstruirea casei.
Mai multe sfaturi și trucuri CSS pentru site-ul dvs. WordPress
Sperăm că acest articol v-a ajutat să învățați cum să adăugați CSS personalizat pe site-ul dvs. WordPress. Dacă ați găsit acest lucru util, s-ar putea să doriți să vedeți și ghidurile noastre despre:
- Cum să minimizați fișierele CSS / JavaScript în WordPress
- Cum să optimizați ușor livrarea CSS WordPress
- Cum să aplicați CSS pentru roluri specifice de utilizator în WordPress
- Cum să adăugați primul și ultimul CSS la elementele meniului WordPress
- Cum să eliminați CSS-ul neutilizat în WordPress (Modul corect)
- Cum să remediezi CSS-ul defect în tabloul de bord WordPress
- Fișă de referință CSS generată implicit de WordPress pentru începători
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.
Mrteesurez
Pe baza metodei pe care ați folosit-o la adăugarea CSS personalizat într-un site cu blocuri, observ că site-ul folosește în continuare un element al personalizatorului clasic prin linkul pe care l-ați partajat?
Întreb dacă se poate instala pur și simplu un plugin de widgeturi clasice pe o temă cu blocuri pentru a avea acces ușor la personalizator pentru a adăuga CSS și altele, fără a folosi niciun link personalizat?
Suport WPBeginner
Ar depinde în mare măsură de tema dvs. specifică. Dacă tema dvs. nu are opțiunea în personalizator, vă recomandăm să utilizați una dintre alternativele din acest articol.
Admin
Mrteesurez
Ei bine, majoritatea temelor au opțiunea în personalizator, nu știu despre temele bazate pe blocuri. Mulțumesc.
Dar aș recomanda să folosiți un constructor de pagini în schimb pentru funcționalități complete de personalizare. Odată ce am învățat să folosesc constructorul de pagini, rar folosesc CSS personalizat pe pagini.
Dennis Muthomi
Doar pentru a clarifica – când menționați (în METODA 1) că CSS-ul adăugat prin Customizer este disponibil doar pentru tema respectivă, înseamnă că codul CSS personalizat este de fapt adăugat în fișierele temei curente?
Nu sunt prea priceput la tehnologie, așa că vreau să mă asigur că înțeleg corect înainte de a începe.
Comentarii WPBeginner
În loc să fie adăugat în fișierele temei, Customizer-ul stochează CSS-ul în baza de date și îl asociază cu tema.
Mrteesurez
Nu știu despre asta, mulțumesc. Asta înseamnă că CSS-ul personalizat adăugat nu rămâne în fișierele temei, ci în baza de date, deci de ce trebuie să copiem și să reintroducem codul CSS personalizat la schimbarea temei, când de fapt acesta se află în baza de date?
Suport WPBeginner
Când adăugați codul CSS, acesta este conectat la tema în sine atunci când salvați. Când încărcați o temă nouă, aceasta va încărca orice CSS conectat la acea temă.
Jiří Vaněk
Mulțumesc, mrteesurez, pentru că ai întrebat, pentru că eram la fel de confuz ca și tine, și mulțumită WPBeginner pentru explicația care m-a ajutat să înțeleg cum funcționează CSS-ul adăugat cu tema. De asemenea, am crezut că codurile CSS sunt stocate doar în temă, dar acum înțeleg în sfârșit cum funcționează în fundal.
Qasim Saeed
Salut, dacă vreau să adaug un CSS personalizat pe o anumită pagină fără niciun plugin, atunci cum? Cred că adăugăm asta prin funcție? Puteți să-mi spuneți cum să adaug CSS prin functions.php și care este cea mai bună și sigură modalitate de a adăuga CSS pentru o anumită pagină
Suport WPBeginner
Nu trebuie să folosiți funcții pentru a adăuga CSS la pagini specifice, ați viza pagina specifică în selectorul CSS pentru a o afecta doar o singură pagină de pe site-ul dvs.
Admin
Jiří Vaněk
Este mai bine să-ți inserezi propriul CSS în WordPress folosind un șablon sau folosind WPCode?
Suport WPBeginner
Ambele opțiuni sunt alegeri valide, depinde de preferința personală și dacă tema are opțiunea în editor.
Admin
Jiří Vaněk
Mulțumesc pentru clarificare, nu eram sigur dacă, de exemplu, un fragment care folosește WPCode ar fi mai rapid pentru răspunsul site-ului decât integrarea lui în șablonul în sine. Deci, dacă nu contează, probabil voi respecta cele mai bune practici și îl voi păstra integrat în șablon.
Bavi
Adăugarea de CSS nu mai este disponibilă pentru planul gratuit, există alternative??
Suport WPBeginner
Tutorialele noastre sunt pentru site-urile WordPress.org, nu avem detalii specifice pentru WordPress.com în acest moment. Vă recomandăm să consultați ghidul nostru de mai jos pentru comparația dintre cele două și dacă doriți să vă transferați site-ul de pe WordPress.com pe un site WordPress.org auto-găzduit.
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
Ben
Nu am știut niciodată despre „trucul” example.com/wp-admin/customize.php. Mulțumesc! A funcționat ca prin farmec!
Suport WPBeginner
Glad we could share this trick with you!
Admin
Dani
Salut,
Vreau să adaug CSS personalizat, dar cum îl pot elimina dacă ceva merge prost?
Bogdan
Hei, acest articol este foarte bun. O întrebare totuși: Nu trebuie să văd pagina HTML pentru a adăuga CSS personalizat? Cum adaug CSS personalizat dacă nu cunosc selectorii și toate acestea?
Suport WPBeginner
Avem un ghid despre utilizarea elementului Inspect pe care îl puteți consulta mai jos pentru a găsi selectorii:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Admin
cymon
Sunt un blogger nou. Există o modalitate de a adăuga cod CSS specific paginii?
Suport WPBeginner
Va trebui să adăugați ID-ul paginii ca parte a CSS-ului, dar da, puteți.
Admin
Jitin Mishra
Articol grozav pentru a adăuga CSS personalizat pe un site WordPress. Așteptăm cu nerăbdare astfel de postări mai informative
Suport WPBeginner
Glad you found our guide helpful
Admin
Mohsin
Vreau să-mi schimb meniul WordPress într-un mega meniu cu codare. Pot să-mi convertesc meniul site-ului web într-un mega meniu folosind html, css și js? Nu vreau să folosesc un plugin pentru această lucrare. Dacă adăugăm noi funcționalități la site-ul web WordPress cu codare personalizată, care sunt cele mai bune practici pentru ca această lucrare personalizată să nu fie afectată de actualizarea temei sau a WordPress. Mulțumesc!
Suport WPBeginner
Ați dori să creați o temă copil pentru a vă păstra modificările în siguranță, dar este posibil să aveți nevoie de cunoștințe de programare PHP. Avem un ghid despre crearea unei teme copil pe care îl puteți consulta mai jos:
https://www.wpbeginner.com/wp-themes/how-to-create-a-wordpress-child-theme-video/
Admin
vijay v
putem adăuga un fișier CSS extern (prin mutarea CSS-ului personalizat) pentru a crește viteza paginii (după ce am adăugat CSS personalizat, viteza de încărcare a scăzut), dacă da, cum să o facem?
mulțumesc anticipat
Suport WPBeginner
Dacă am înțeles corect ce căutați, ați dori să consultați articolul nostru de mai jos: https://www.wpbeginner.com/wp-tutorials/how-wordpress-plugins-affect-your-sites-load-time/
Admin
billy king
Este permis CSS „neortodox” în Child Theme sau Custom CSS?
Suport WPBeginner
Atâta timp cât CSS-ul vizează ceea ce se află pe site-ul dvs., puteți folosi orice CSS doriți.
Admin
Latonya Moore
Acest lucru este grozav, dar există o modalitate de a adăuga CSS doar la o singură pagină? Exemplu, vreau doar să afișez sau să ascund prin hover sau mouseover pe un singur text.
Suport WPBeginner
Ar trebui fie să adăugați o clasă CSS la obiectul specific, fie să adăugați ID-ul paginii la CSS-ul dvs. pentru a-l limita la acea pagină specifică. Pentru a afla cum să găsiți acele informații, ar trebui să consultați articolul nostru de mai jos despre cum să utilizați elementul de inspecție:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Admin
shiva
Am făcut câteva modificări pe site-ul meu editând câteva coduri CSS în editorul de temă. Ce se va întâmpla dacă îmi actualizez WordPress-ul la următoarea versiune. Va da eroare sau va reveni la tema de bază sau codul meu va apărea chiar și după actualizarea WordPress-ului, la fel ca înainte de actualizare.
Suport WPBeginner
Dacă ați adăugat CSS-ul în zona Aspect>Customizer>CSS suplimentar, atunci modificările CSS vor rămâne atunci când vă actualizați site-ul.
Admin
Jo
Nu am terminat complet de construit site-ul meu, dar am făcut upgrade de la versiunea gratuită, așa că pot folosi CSS pentru a face modificări. Site-ul meu nu este încă live. Odată cu upgrade-ul la versiunea premium, butonul de actualizare s-a schimbat acum în publicare. Înseamnă asta că atunci când voi face clic pe publicare pentru a salva orice modificări, site-ul meu va deveni live?
De asemenea, nu-mi amintesc ce temă am folosit, cum aflu ce temă folosesc?
Mulțumesc
Suport WPBeginner
Se pare că sunteți pe WordPress.com, dacă publicați o postare, aceasta va fi vizibilă celor care vă pot vedea site-ul. Cu WordPress.com pentru un site privat, sunteți limitat la: https://en.support.wordpress.com/settings/privacy-settings
Ar trebui să puteți vedea tema activă sub Aspect>Teme
Admin
Bruce William Taylor
„Fila va glisa pentru a vă arăta o casetă simplă unde puteți adăuga CSS personalizat. De îndată ce adăugați o regulă CSS validă, o veți putea vedea aplicată în panoul de previzualizare live al site-ului dvs. web.”
Știu deja UNDE să adaug CSS. Cum aflu ce CSS să adaug? Cum aflu care sunt „regulile CSS valide”?
Suport WPBeginner
Salut Bruce,
Pentru asta va trebui să învățați puțin CSS de bază. Există mai multe site-uri web care au tutoriale CSS pas cu pas pentru începători. Vă recomandăm w3schools, deoarece vă permit să exersați CSS cu o casetă de încercare live.
Admin
Ali
Unde este stocarea codului CSS personalizat, deoarece l-am pierdut în timpul unui transfer către un nou găzduitor?
mahaveer
vreau să adaug css extern și să adaug imagini în css…..
Muhammad Adil
Care a fost metoda Bonus?
Este vreun plugin pe care nu l-am înțeles. Mă puteți întreba, vă rog?
Mulțumesc
Aditya Khuteta
Salut! Vreau să schimb dimensiunea textului prețului pe site-ul meu, deoarece textul prețului este prea mic acolo. Vă rog să mă ghidați cum să fac acest lucru.
Mulțumesc
Frank Lurz
2 întrebări:
1. Doar ca să înțeleg, „plugin-urile” sunt substitute pentru scrierea CSS, o sarcină dificilă pentru cei dintre noi care nu știu nimic despre CSS — este corect?
2. Pluginurile listate pentru descărcare pe pagina de pluginuri WP sunt disponibile pentru instalare doar abonaților care au plătit pentru Planul „Buisness”, este corect?
Suport WPBeginner
Salut Frank,
1. Nu, pluginurile nu sunt un substitut pentru scrierea de CSS personalizat. Puteți scrie CSS personalizat fără a instala pluginuri. Vă rugăm să consultați ghidul nostru despre ce sunt pluginurile WordPress și cum funcționează pentru mai multe detalii.
2. DACĂ utilizați WordPress.com, atunci da, va trebui să faceți upgrade la planul de afaceri. Vă rugăm să consultați ghidul nostru despre diferența dintre WordPress.org auto-găzduit vs blog gratuit WordPress.com.
Admin
Annie Mitchell
Salut,
Sunt un novice când vine vorba de construirea și proiectarea site-urilor web și nu am cunoștințe de CSS. Folosesc tema Sydney pe site-ul meu web – și am reușit cumva să fac fontul paragrafului meu alb. Am căutat pe Google și am observat că un domn a avut aceeași problemă. El a rezolvat-o descărcând un plugin și folosind un CSS personalizat, însă eu am încercat și nu am avut succes.
CSS-ul pe care a sfătuit să-l folosească este –
.entry-page p, .entry-post p { color: black !important; margin: 0 !important; padding: 0 !important; }
dar nu sunt sigur de ce nu funcționează pentru mine. Orice ajutor ar fi mult apreciat.
Mulțumesc,
Annie
Suport WPBeginner
Salut Annie,
Mai întâi, vă recomandăm să dezactivați toate pluginurile WordPress. După aceea, vizitați site-ul dvs. pentru a vedea dacă acest lucru v-a rezolvat problema. Dacă da, atunci înseamnă că o setare dintr-unul dintre pluginurile dvs. a cauzat problema. Dacă nu rezolvă problema, atunci încercați să comutați la o temă implicită, cum ar fi Twenty Seventeen. Dacă acest lucru vă rezolvă problema, atunci înseamnă că undeva în tema dvs. ați modificat setările fonturilor.
Dacă nimic nu funcționează, atunci poți încerca acest CSS personalizat:
p { color:#000; }1-click Use in WordPress
Admin
Jose
Unul dintre pluginuri (Simple Custom CSS) nu a mai fost actualizat de 2 ani, ceea ce în lumea pluginurilor Wordpress este foarte mult timp. Acesta reprezintă un risc de securitate, așa că personal aș căuta o alternativă.
Rebecca
Bună ziua
Îmi pare rău, nu știu nimic despre CSS și încerc să rezolv o problemă legată de imposibilitatea de a căuta pluginuri, dar asta e altă poveste! Postez aici acum pentru că primesc acest mesaj când accesez aspect / editează CSS / CSS suplimentar
” Există 1 eroare care trebuie corectată înainte de a putea salva.
Actualizați oricum, chiar dacă ar putea să vă defecteze site-ul?”
Este ceva de care ar trebui să-mi fac griji?
textul din caseta de sub el citește...
și chiar aici este un punct roșu
Sper că cineva mă poate ajuta.
Mulțumesc
Suport WPBeginner
Salut Rebecca,
Puteți copia CSS-ul și să-l lipiți într-un fișier text și să-l salvați ca backup. Acum ștergeți totul din caseta CSS suplimentar și începeți să adăugați CSS-ul personalizat câte o regulă, până când eroarea apare din nou. Acest lucru vă va ajuta să localizați eroarea și să o remediați.
Admin
James
Acest lucru nu mai funcționează pentru conturile gratuite. Opțiunea CSS nu mai există și ai nevoie de un cont business pentru a instala un plugin relevant.
Suport WPBeginner
Salut James,
Probabil folosești WordPress.com. Te rugăm să consulți ghidul nostru despre diferența dintre WordPress.org auto-găzduit vs. blog WordPress.com gratuit.
Admin
scott
Înainte de versiunea WP 4.9, puteam să copiez și să lipesc CSS-ul meu personalizat (din personalizatorul WP) și să-l lipesc în Windows Notepad (și păstra formatarea. Făceam asta des pentru a-l salva ca backup atunci când adăugam CSS personalizat nou - în cazul în care făceam o greșeală.
Acum, când îl lipesc în Notepad, acesta rulează doar tot CSS-ul împreună, fără formatarea linie cu linie în Notepad.
Ai vreo idee de ce sau cum aș putea să o repar? Am deja setat modul „încadrare text” în Notepad.
Mulțumesc.
Suport WPBeginner
Salut Scott,
Puteți încerca să salvați codul în alte editoare de text precum Notepad++. Dacă problema persistă, atunci încercați sfaturi de depanare WordPress.
Admin
Joe MacMillan
Acest site este foarte bun. Site-ul meu nu avea culori pentru linkuri, așa că am folosit acest cod /* link nevizitat albastru */
a:link { Culoare: #196380; }
/* link vizitat verde */
a:visited {
color: #248f24;
}
/* mouse over link orange */
a:hover { color: #ff3300; }
/* link selectat roșu */
a:active { color: #cc0000; }
dar a transformat culorile pentru tot ceea ce este un link, cum ar fi meniurile, într-o culoare.
Vreau doar culorile pentru linkuri.
Aș aprecia orice ajutor cu asta. Mulțumesc
Suport WPBeginner
Salut Joe,
În CSS-ul dvs., nu ați definit ce zone ar trebui să aibă linkuri în aceste culori, ceea ce le face să se aplice întregului corp. Pentru a afla ce zone trebuie să vizați, va trebui să utilizați Instrumentul de Inspecție pentru a afla clasa CSS utilizată de tema dvs. pentru blocul de conținut.
Să presupunem că blocul de conținut din tema dvs. are o clasă CSS site-content, o veți utiliza în CSS-ul dvs. astfel:
.site-content a:link { color: #196380; } .site-content a:visited { color: #248f24; } .site-content a:active { color: #cc0000; } .site-content a:hover { color: #ff3300; }1-click Use in WordPress
Hope this helps
Admin
Rob
Îmi place site-ul tău!
Mulțumesc pentru toate articolele utile.
Am o întrebare legată de planul meu premium WordPress.
Vreau să adaug următorul script pe site-ul meu.
var refTagger = { settings: { bibleVersion: “NKJV” }
Pot să adaug asta la CSS-ul personalizat?
Nu am posibilitatea de a accesa antetul sau subsolul în acest plan
Mulțumesc,
Rob
Suport WPBeginner
Salut Rob,
Nu, nu puteți. Vă rugăm să consultați ghidul nostru despre diferența dintre WordPress.org auto-găzduit vs blog gratuit WordPress.com.
Admin
sammy
Acesta este într-adevăr un articol grozav, va trebui să încep să învăț cum să-mi fac propriul CSS pentru site-ul meu
Thomas
Salut,
această funcționalitate nu este activă pentru administratorul site-ului într-o rețea WordPress multisite.
Credeți că activarea ei pentru administratorul site-ului (cu acest plugin, de exemplu:) ar crea o problemă de securitate?
Mulțumesc!
Suport WPBeginner
Salut Thomas,
Da, puteți folosi un plugin pentru a adăuga CSS personalizat.
Admin
Thomas
Salut,
da știu (am folosit deja pluginul foarte bun Simple Custom CSS), dar aș prefera să folosesc funcția nativă, deoarece este implementată în WordPress.
Cu toate acestea, această funcție este disponibilă doar pentru administratorul de rețea și nu pentru administratorul site-ului într-o instalație multisite.
Drepturile pot fi modificate cu ușurință pentru a permite administratorului site-ului să adauge propriul CSS personalizat în personalizator (cu funcția nativă WP) (vezi acest plugin: http://www.wordpress.org/plugins/multisite-custom-css/), și mă întreb dacă acest lucru ar crea o problemă de securitate (pe baza presupunerii că nu pot avea încredere în administratorul site-ului)?
Suport WPBeginner
Salut Thomas,
Sorry, we totally misunderstood your question
Suntem de acord că aceasta va fi o preocupare, de aceea funcția este dezactivată. Dacă o activați, atunci utilizatorii vor putea adăuga CSS nefiltrat. Ar trebui să o păstrați dezactivată.
Brice
Nu știu multe despre cod, așa că mă întreb dacă fac modificări și apăs „salvează și publică”, există o modalitate de a recupera codul original dacă nu îmi plac modificările sau trebuie să copiez și să salvez codul original în cazul în care vreau să-l restaurez?
Ruth Billheimer
This is probably really naive, I don’t know much about code, so bear with me.. In the customise additional css, can you put in different things? I mean I have already put something in there that will change some of the colours. Now I want to put in something that will change the width of the page. (I am getting these bits of code from very helpful people, I know nothing!)
So will both of these things work? Or can you only change one thing? It doesn’t look like the page width has changed
Jos Schuurmans
Salut,
Era posibil să editați style.css direct din panoul de administrare WP, sub meniul Aspect.
Pe WP multisite, era prin submeniul temelor rețelei. A fost eliminată acea funcționalitate?
Noroc, Jos
Judy
Postare grozavă, mulțumesc!
Cineva mă poate ajuta cu asta? Am făcut o mică personalizare la logo-ul meu folosind CSS Hero. Apoi am copiat aceste 9 șiruri exacte de cod în plugin-ul meu Simple Custom CSS, după dezactivarea CSS Hero. Am crezut că pot reproduce aceeași personalizare CSS Hero la logo-ul meu folosind Simple Custom CSS, dar în schimb nu funcționează.
Am reîmprospătat pagina și am șters cache-ul, dar personalizarea tot nu are efect. De ce?
Mulțumesc,
Judy
Robin
Aceasta este tot ce se află în foaia mea de stil CSS. /* Bun venit la CSS personalizat
Pentru a afla cum funcționează acest lucru, consultați
*/
Îl șterg pe al lui și adaug noul meu cod de font? Ajutor????
Suport WPBeginner
Da. Acestea sunt doar comentarii pentru a ajuta noii utilizatori să înceapă.
Admin
Paul H.
PLUGIN EXCELENT!!!
Am petrecut mult timp încercând să fac editorul WP încorporat să-mi „stilizeze” pagina personalizată, fără succes...
Am căutat un plugin pentru a vedea dacă există unul și l-am găsit pe al tău… în câteva minute am instalat pluginul tău și l-am activat, apoi am introdus CSS-ul meu, am dat clic pe actualizare și apoi am reîmprospătat pagina mea personalizată… este perfect!
A+++
Ian
Salut băieți,
Am instalat plugin-ul Simple custom CSS & l-am activat. Am un tabel creat pe una dintre paginile mele web pe care am vrut să am o bordură în jurul lui.
Ca urmare, am adăugat următorul cod la pluginul meu simplu de CSS personalizat
tabel { bordură: 2px solid negru; }
și am actualizat CSS-ul personalizat, dar nimic nu s-a întâmplat – încă nu am nicio bordură pe tabelul paginii mele web.
Sugestii?
Cu stimă
Ian
Molly Setzer
Salut Ian,
Este probabil că nu îl apelați cu selectorul CSS corect. Folosiți cel mai definit selector pentru a prelua elementul. De exemplu, dacă tabelul dvs. are o clasă „info”, atunci apelarea lui prin mai specificul table.info vă va ajuta să ajungeți la element. Verificați dacă are mai mulți selectori în HTML.
ramneet
Mulțumesc pentru distribuire. este o modalitate minunată de a învăța WordPress, îmi place.
Estee Peter
Cum adaug CSS personalizat prin plugin-ul meu existent specific site-ului web
acesta este următorul cod
.mobileonly { display: none; }
@media screen and (max-width: 480px) { .mobileonly { display: inline; } }
.hidemobileonly { display: inline; }
@media screen and (max-width: 480px) {
.hidemobileonly {
display: none;
}
}
Gary Zielke
Pluginul CSS personalizat funcționează pe pagini individuale.
adică pot adăuga stil unei singure pagini și nu întregului temă?
Mulțumesc
Suport WPBeginner
Nu, nu funcționează pe pagini individuale.
Admin
Tori Tran
mulțumesc ^^
Russell Bruce
Nu ar fi util să explicăm ce face CSS și de ce este util
Joey
Mulțumesc, aș vrea să fi realizat asta mai devreme, pentru că am făcut toate modificările css în fișierul style.css, deoarece fac modificările local, dar spui că dacă din anumite motive Genesis decide să actualizeze tema copil specifică pe care am folosit-o, voi pierde acele modificări? Nu știu dacă am văzut vreodată că și-au actualizat temele copil, deși folosesc Genesis de doar câteva luni, așa că presupun că este complet posibil să actualizeze anumite teme ici și colo. Cred că de acum înainte voi face modificările în plugin, mai ales dacă site-ul este live.
suzie
Folosește tema care îți place și creează o „temă copil”
Tema copil este apoi unică pentru site-ul tău.
Fă orice modificări doar pe tema copil.
Designerul temei își poate actualiza tema, dar modificările tale vor rămâne. (În funcție de actualizarea designerului, s-ar putea să fie nevoie să ajustezi modificările tale, dar acest lucru este puțin probabil).
Rodney
Articol grozav.
Voiam doar să adaug aici. Există multe opțiuni aici, în special pentru site-urile care rulează pe WordPress, construirea/crearea de CSS personalizat este simplă. Majoritatea temelor WordPress suportă de obicei adăugarea de CSS personalizat fără a fi nevoie să creați sau să adăugați plugin-uri suplimentare.
Sunt și eu de acord, iar cea mai bună opțiune aici este să folosiți o temă copil în schimb.
mulțumesc