Si të personalizoni CSS të faqes suaj të WordPress? Gjeni në këtë artikull.

Pavarësisht se çfarë teme WordPress zgjidhni për faqen tuaj të internetit, do të ketë faqe të tjera të internetit që do ta përdorin atë. Dhe edhe përkundër shumë opsioneve të personalizimit të ofruara nga shumë Temat e WordPress në ditët e sotme ju mund ta bëni faqen tuaj të internetit edhe më unike.

Derdh vraiment Për të prekur aspektin vizual të temës suaj të WordPress, duhet të shkoni përtej personalizimit standard të ofruar nga opsionet ose cilësimet e një teme WordPress. Përshtatja CSS e blogut tuaj të WordPress do t'ju lejojë të modifikoniparaqitja e faqes suaj të internetit për ta bërë atë vërtet unike.

Ky tutorial do të shikojë shumëllojshmërinë e metodave të disponueshme për ju për të personalizuar faqen tuaj të internetit me CSS, krijimin dhe personalizimin e temave për fëmijë, duke përdorur shtojcat e integruara të WordPress Customizer dhe WordPress plugins të CSS.

Por para se të filloni, merrni kohën për të parë Si për të instaluar një temë WordPress, Sa plugins ju nevojitet për të instaluar në WordPress.

Pastaj zbuloni së bashku listën tonë.

CSS: Bazat dhe si i përdor WordPress ato

Para së gjithash: CSS qëndron për Shefat e stilit Cascading, e cila nuk është më e qartë se shkurtesa. Pra, le ta zbërthejmë.

Një fletë stili është një dokument që përshkruan stilet (të tilla si font, ngjyra etj..) që do të përdoret për prezantimin e një dokumenti tjetër. Në rastin tonë, kemi të bëjmë me një stil të faqeve të internetit.

PjesaCascadingE emrit është pjesë e asaj që e bën atë me të vërtetë të fuqishme. Faqet e internetit mund të dizajnohen me fletë të shumëfishta stili, si një ujëvarë kaskadë, me fletën e poshtme që shton ose zëvendëson stilet nga një nivel më i lartë. Kjo është e rëndësishme sepse mënyra se si shtoni stilet tuaja do të zëvendësojë ndryshimet origjinale.

Sado që tingëllon e thjeshtë, CSS mund të përdoret për të ndryshuar pothuajse gjithçka në një faqe në internet (përfshirë paraqitjen, ngjyrat, shkronjat, madje dhe animacionet).

Mësoni si të menaxhoni njoftimet tuaja duke zbuluar Si për të menaxhuar njoftime email në WordPress

më Temat e WordPress përdorni një kod CSS të disponueshëm në një skedar të quajtur style.css. Nëse e hapni këtë skedar, do të shihni një listë të plotë të rregullave të stilit për temën tuaj të WordPress. Farëdo që të bësh, mos e modifikoni këtë skedar! Përditësimet do të mbishkruajnë ndryshimet tuaja.

Ka disa mënyra për të shtuar një kod CSS personal në temën tuaj të WordPress në mënyrë që ndryshimet tuaja të mbijetojnë me një azhurnim të temës WordPress.

Si të personalizoni faqen tuaj të WordPress me CSS

Tani që kuptoni më mirë se çfarë është CSS dhe si ta bëni Temat e WordPress përdorni ato, ne do t'i hedhim një vështrim opsioneve që mund të përdorni për të personalizuar blogun tuaj të WordPress dhe do të diskutojmë të mirat dhe të këqijat e secilës metodë.

Në fund të punës sonë, ju do të jeni në gjendje të përcaktoni se cila metodë korrespondon me temën tuaj të WordPress.

Opsioni # 1: Rregulloni CSS duke përdorur një temë për fëmijë

Në qoftë se ju përdorni un tema e fëmijës në mënyrë që të personalizoni kodin tuaj CSS, azhurnimet e temave për të cilat kemi folur më parë nuk do të jenë më problem. Një azhurnim i një teme WordPress do të ndikojë në temë "prind», Lënia e paprekur e ndryshimeve në temën e fëmijës suaj. Shumë zhvillues të temave WordPress e kuptojnë dobinë e një teme për fëmijë.

Zbuloj Kur dhe si për të instaluar WordPress në një subdirectory

Krijimi i një teme për fëmijë është shumë i thjeshtë. Ai konsiston në krijimin e një dosje në web hosting që përfshin një skedar style.css i cili rendit temën e prindërve si një shabllon, dhe skedari i importeve style.css të temës prindërore (e mbani mend kuptimin e fletëve të stilit 'kaskadë'?).

Kodi i WordPress ka më shumë informacion mbi krijimin e temave për fëmijë.

Pasi të keni krijuar temën e fëmijës tuaj dhe ta aktivizoni siç duhet, mund të filloni të personalizoni temën tuaj WordPress. Mënyra më e shpejtë do të jetë redaktimi i skedarit tuaj style.css, të cilat mund të arrihen në dy mënyra.

Shikoni këtë artikull për të zbuluar Si të compress CSS tuaj, HTML dhe Javascript files

E para është përdorimi i redaktorit të përfshirë në panelin e WordPress, duke klikuar mbi Pamja> Redaktuesi. L 'botues shfaq një listë të skedarëve në të djathtë të disponueshëm në temë (Shfaqen vetëm skedarët e njohur). Dosja juaj style.css do të jetë në fund të listës, dhe duke klikuar mbi opsionin Fletë stilesh dosjen tënde style.css do të ngarkojë.

Ju mund të shtoni ndryshimet tuaja në këtë vend dhe të ruani ndryshimin.

Mënyra tjetër për të hyrë në skedarin tuaj style.css (atë që ne rekomandojmë) është të shfletoni skedarët në web hosting tuaj përmes një Klienti FTP ose një menaxher skedarësh. Dosja e temës fëmijë që keni krijuar do të jetë në " temat e përmbajtjes wp« . Ju do të jeni në gjendje të përdorni një redaktues teksti për të modifikuar skedarin style.css.

Opsioni n ° 2: Përshtatni CSS nga Përshtatësi

Që nga WordPress 4.7, përdoruesit mund të shtojnë CSS të personalizuar direkt nga zona e administratorit WordPress. Supershtë jashtëzakonisht e lehtë dhe do të ishit në gjendje të shihni ndryshimet tuaja me pamje në kohë reale.

Së pari, duhet të drejtoheni te faqja Temat »Personalizo.

Kjo do të nisë ndërfaqen e personalizimit të temës WordPress.

Ju do të shihni pamjen në kohë reale të faqes suaj të internetit në të djathtë me një bandë opsionesh në panelin e majtë. Klikoni në skedë CSS shtesë në panelin e majtë.

Skeda do të rrëshqasë për t'ju treguar një zonë të thjeshtë ku mund të shtoni CSS tuaj të personalizuar. Sapo të shtoni një rregull të vlefshëm CSS, do të jeni në gjendje ta shihni atë të aplikuar në panelin e shikimit në kohë reale të faqes tuaj të internetit.

Mund të vazhdoni të shtoni kod të personalizuar CSS, derisa të jeni të kënaqur me mënyrën se si duket në faqen tuaj të internetit. Mos harroni të klikoni në " Ruaj dhe publiko Në krye kur të keni mbaruar.

Shënim: Çdo CSS e personalizuar që shtoni duke përdorur Customizer është në dispozicion vetëm me atë temë të veçantë WordPress. Nëse dëshironi ta përdorni me tema të tjera, do t'ju duhet të kopjoni dhe ngjisni në temën tuaj të re duke përdorur të njëjtën metodë.

Opsioni # 3: Rregulloje CSS duke përdorur një shtojcë

Avantazhi i përdorimit të një shtojce për personalizimin e CSS është se ju e mbani shtojcën edhe nëse bëni një ndryshim të temës WordPress. Kjo ka shkëmbime, pasi stilet nuk mund të shfaqen mirë në të gjitha temat e WordPress.

Këtu janë disa shtojca:

1. Custom CSS në Jetpack (Falas)

Plugin WordPress Jetpack  është instaluar në mbi një milion faqe në WordPress, dhe ndoshta edhe tuajat. Ai sjell veçori të disponueshme në WordPress.com për faqet e internetit të vetë-pritura, dhe gjithashtu ofron një modul për customization CSS.

Sapo moduli të aktivizohet në panelin e Jetpack, do të jetë i disponueshëm një redaktues i personalizuar i CSS, duke ju lejuar të personalizoni temën tuaj WordPress pa krijuar një temë për fëmijë. Ju hyni tek redaktori duke ndjekur këtë rrugë " Pamja> Redakto CSS« .

2. CSS e thjeshtë e personalizuar (falas)

Nëse në vend të kësaj ju doni një opsion të pavarur, Simple Custom CSS është një zgjedhje e mirë. Kjo shtojcë falas, e përdorur në më shumë se faqet e internetit 200.000 me një vlerësim të yjeve 4,9, patjetër do t'ju ndihmojë të personalizoni blogun tuaj CSS WordPress.

Kjo shtojcë nuk kërkon ndonjë konfigurim, thjesht duhet të instaloni dhe aktivizoni shtojcën. Për të modifikuar kodin tuaj CSS, shkoni te " Pamja> CSS e personalizuar«  në panelin e WordPress. Zbatoni ndryshimet tuaja CSS në kutinë e tekstit dhe pasi të keni mbaruar ruani cilësimet tuaja.

3. Hero i CSS (nga 14 dollarë në vit)

Opsioni përfundimtar i shtojcës WordPress që po shohim sot është një shtojcë premium WordPress e quajtur CSS Hero. Nga 14 $ në vit për një faqe në internet, kjo shtojcë ju lejon të rregulloni temën tuaj të WordPress duke përdorur një ndërfaqe intuitive.

Projektuar për të punuar më mirë me dhjetëra tema të përputhshme të WordPress , CSS Hero ju jep kontroll të plotë mbi të gjithë elementët e temës suaj WordPress. Për temat që nuk janë në listën e tyre, mund të përdorni Modaliteti i raketave për të mundësuar personalizimin e CSS Hero.

CSS Hero heq nevojën për të kuptuar sintaksën CSS duke thjeshtuar ndërveprimin me kodin përmes një ndërfaqeje, dhe kjo vlen për animacionet dhe tranzicionet. Ju gjithashtu mund të shikoni paraprakisht ndryshimet tuaja në kohë reale dhe të ktheheni në një version të mëparshëm.

zbuloni Si të lëvizni komentet nga një artikull në tjetrin në WordPress

Nëse dëshironi të modifikoni plotësisht CSS-në e blogut tuaj të WordPress, por nuk dëshironi të mësoni CSS, CSS Hero është një opsion i shkëlqyeshëm për personalizimin e faqes tuaj të internetit, veçanërisht nëse jeni duke përdorur një nga temat e tyre të WordPress.

Ndërsa e dini që përmbajtja është e rëndësishme, megjithatë, do të dëshironi që faqja juaj e internetit të dalë nga turma, edhe nëse jeni duke përdorur një temë të njohur WordPress. Me CSS, ju mund të personalizoni modelimin e faqes tuaj në mënyrë që të jetë plotësisht unike.

Shkoni më tej duke zbuluar Si t'i lejoni përdoruesit të redaktojnë disa faqe

Pra, ka disa mënyra për të rregulluar CSS të temës suaj të WordPress:

1. një temë për fëmijë.
2. Customizer.
3. një shtojcë CSS.

Zbuloni gjithashtu disa shtesa premium WordPress  

Mund të përdorni të tjera WordPress plugins për të dhënë një pamje moderne dhe për të optimizuar trajtimin e blogut ose faqes tuaj të internetit.

Ne ju ofrojmë këtu disa shtesa premium WordPress që do t'ju ndihmojnë ta bëni atë.

1. Adning Reklamim

Sistemi i Reklamimit WP PRO është një shtojcë e menaxhimit të reklamave WordPress, e cila ofron vende strategjike 18 për t'ju ndihmuar të shfaqni reklama në faqen tuaj të internetit. Ai gjithashtu ka një seksion të detajuar të statistikave nga i cili do të shihni performancën e secilës reklamë.

Kjo veçori është thelbësore sepse do t'ju ndihmojë të përmirësoni fushatën tuaj dhe të maksimizoni fitimet tuaja. Kjo shtojcë WordPress Adsense gjithashtu vjen me një veçori unike të quajtur reklama në sfond. Kjo ju lejon të shfaqni reklama si sfond i përmbajtjes tuaj.

Plus, pasi është në përputhje me shtojcat si psh WPBakery et Slider Revolution, ju mund të shfaqni reklamat tuaja në formën e rrëshqitësve ose t'i vendosni ato kudo në faqen tuaj të internetit.

Shkarko | DEMO | web hosting

2. WP Media File Manager

WP Media File Manager është një shtesë WordPress që e bën të lehtë organizimin e bibliotekës mediatike në një formë hierarkie, duke përdorur funksionalitetin Drag and Drop. Shtë një nga WordPress plugins menaxheri më i fuqishëm i skedarëve në CodeCanyon. Nuk do t'ju duhet as të krijoni dosje me dorë.

Kjo shtojcë WordPress ju lejon të ngarkoni mijëra skedarë nga menaxheri i skedarëve të PC tuaj në faqen e internetit duke kopjuar automatikisht hierarkinë e dosjes burimore. Nëse dëshironi të keni të njëjtën skedar në dosje të ndryshme, dijeni se tani keni një bibliotekë të vërtetë mediatike që ofron këtë funksionalitet.

Mirupafshoni problemeve me shkarkimin e llojeve specifike të skedarëve, tani ju vetëm duhet të instaloni këtë shtojcë WordPress dhe ta lejoni t'ju ndihmojë të menaxhoni skedarët tuaj.

Shkarko | DEMO | web hosting

3. Menyja e Heroit

Hero Menu është një mega menu WordPress plugin. Dhe ndërsa nuk bën shumë heroike, ai ka të gjitha tiparet e nevojshme për vetëm 19 dollarë. Pak si Mega Main Menu, është një shtojcë që gjithashtu përmban produkte të paraqitura në CodeCanyon dhe ka gati 4500 shitje për kreditë e saj për momentin.

Në seksionin e tipareve, shpejt do të kuptoni se është mjaft e lehtë të krijosh një megamenu. Procesi merr vetëm disa hapa. Por përveç kësaj, do të vëreni që shtojca është e përputhshme me të WooCommerce, ofron një dizajn të përgjegjshëm dhe një ndërfaqe "tërheq dhe lësho" për të krijuar menutë.

Ndërtuesi i menusë përmirëson përdorimin e shtojcës dhe thjeshton shumë punën e blerësit. Integrimi i UI është gjithashtu një punë e shkëlqyeshme dhe UI sillet në mënyrë të përsosur me shtojcat e tjera.

Shkarko | DEMO | web hosting

Burimet e rekomanduara

Mësoni rreth burimeve të tjera të rekomanduara për t'ju ndihmuar të ndërtoni dhe menaxhoni uebfaqen tuaj.

• Si të mbroni një formular me fjalëkalim në WordPress
• Si të krijoni tranzicione të bukura të faqeve në WordPress
• Si të përdorni API-në e WordPress REST
• Si ta lidhni faqen tuaj në WordPress me Telegram
• Si të pastroni WordPress në disa hapa

Përfundim

Kjo është ajo! Kjo është ajo për këtë tutorial. Shpresojmë që ky mësim t'ju ketë treguar se si të personalizoni CSS të faqes suaj të internetit WordPress. Mos hezitoni të ndajeni me miqtë tuaj në rrjetet tuaja të preferuara sociale. 

Megjithatë, gjithashtu do të jeni në gjendje të konsultoheni me ne RESSOURCES, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress.

Nëse keni sugjerime ose vërejtje, lërini ato në seksionin tonë komente.

...