Dëshironi të kompresoni skedarët tuaj CSS, HTML dhe javascript në WordPress?

Kur kompresoni skedarët CSS, HTML dhe Javascript të faqes në internet, mund të kurseni kohë të vlefshme në shpejtësinë e ngarkimit të faqes në faqen tuaj. Tani nuk po flasim për uljen e shpejtësisë së ngarkimit të faqes tuaj në gjysmë ose në ndonjë gjë tjetër, por kur bëhet fjalë për shpejtësinë e faqes suaj të internetit, pak rëndësi ka.

Shpejtësia e ngarkimit të faqes suaj të internetit nuk është e rëndësishme vetëm për vizitorët e rinj, por edhe për renditjen e motorëve të kërkimit.

Termi "minimizojNë gjuhën e programimit përshkruan procesin e heqjes së karaktereve të panevojshëm nga kodi burimor. Këto karaktere përfshijnë hapësira, ndërprerje linjash, komentet dhe bllokojnë delituesit që janë të dobishëm për ne njerëzit por të padobishëm për makinat.

Ne minimizojmë skedarët e një faqe në internet që përmbajnë CSS, HTML dhe kodin JavaScript në mënyrë që shfletuesi juaj të mund t'i lexojë ato më shpejt.

Lexoni gjithashtu artikullin tonë në 10 WordPress plugins për të përmirësuar shpejtësinë e juaj

Këtu është një shembull i CSS minification.

CSS para minifikimit

/ * Një shembull skedar CSS ---------------------------------- * / .user-profile-card { diferencë: 0px; background: #33E43}. përdoruesi-profile-description {border: 0; pozita: absolute; gjerësia: auto; margjinat e sipërme: 20px; }

CSS pas minimit

.user-profile-card{margin:0;background:#33e43}.user-profile-description{border:0;position:absolute;width:auto;margin-top:20px}

Padyshim, ky është vetëm një shembull i vogël duke përdorur një copë CSS, por ju mund të imagjinoni se sa hapësirë ​​do të kursente kjo kur tkurrja e mijëra linjave të kodit. 

Si ta rritni kohën e kaluar në blogun tuaj në WordPress? Gjeni duke u konsultuar me këtë artikull.

Pra, nëse doni ta bëni manualisht, teknikisht mundeni. Por ju do të keni një rrezik të lartë gabimi dhe do të humbni kohën tuaj të çmuar pa nevojë!

Ndiqni këto këshilla dhe përdorni mjetet në dispozicionin tuaj.

Disa mjete për të kryer compression

Për fat të mirë, ju nuk keni nevojë të jeni domosdoshmërisht një zhvillues ose të dini ndonjë nga gjuhët e programimit për të zvogëluar madhësitë e skedarëve të faqes suaj të internetit. Minifikimi është bërë një praktikë e zakonshme në botën e krijimit të uebit. Kështu që nuk duhet të habiteni kur të mësoni se ka shumë mjete të mrekullueshme (dhe falas) atje për të bërë punën për ju.

Shihni edhe tonë 6 shtojca WordPress për t'u dhënë frymëzim artikujve tuaj

Këtu është një listë e mjeteve të dobishme për të filluar. Meqenëse shumë nga këto mund të minimizojnë shumë lloje të kodeve, unë kam përfshirë opsionet e llojit të kodit në kllapa.

    • cssminifier.com et javascript-minifier.com (CSS dhe JS) - Këto dy minifierë nga Andrew Chilton janë të lehta për t’u përdorur. Thjesht duhet të ngjitni kodin tuaj, pastaj klikoni në butonin Minimizoj për të shfaqur kodin e kompresuar. Ju mund të shkarkoni edhe kodin e daljes si një skedar për lehtësi.
    • htmlcompressor.com (HTML, CSS & JS) - Ky mjet i kompresimit / minimizimit në internet mbështet llojet e kodit HTML, CSS dhe JS. Ai madje mbështet kombinime të ndryshme të llojeve të kodeve si CSS + PHP dhe JavaScript + PHP. Dhe madje mund të kontrolloni kodin e kompresuar për gabime.
    • csscompressor.net (Vetëm CSS) - Ky kompresor online CSS është i shpejtë, i lehtë dhe pa përdorim.
    • jscompress.com (Vetëm JS) - Ky mjet i kompresimit JavaScript ju lejon të kompresoni kodin JavaScript duke kopjuar dhe ngjitur, por gjithashtu mund të shkarkoni shumë skedarë JavaScript në të njëjtën kohë. Ky është ideal për të kombinuar skedarët JavaScript në një skedar të vetëm për një shpejtësi më të mirë të ngarkimit të faqes.
    • Mjetet e Danit - Mjetet e Danit propozojë un minify CSS dhe a minify JavaScript . Të dy mjetet kanë një ndërfaqe përdorimi me të vërtetë të pastër, të lehtë për t’u përdorur. Ata nuk ofrojnë ndonjë opsion të përparuar, por ato janë të shkëlqyera për qëllime të zakonshme minimizimi.
    • refresh-sf.com (HTML, CSS dhe JS) - Ky kompresor do të zvogëlojë llojet e kodeve JavaScript, CSS dhe HTML. Ai gjithashtu përfshin të gjitha opsionet e kompresimit për secilin lloj kodi nëse keni nevojë për to.
    • Përfundimi i Mbylljes (Vetëm JS) - Përpiluesi i Mbylljes është pjesë e Mjetet e Mbylljes , një grup mjetesh nga Google Developers. Kjo ju lejon të minimizoni JavaScript-in tuaj së bashku me optimizime të tjera të dobishme. Ju mund të përdorni kodin tuaj Javascript duke futur URL-në e vendndodhjes së skedarit js dhe më pas zgjidhni se si dëshironi që kodi të optimizohet dhe formatohet. 

Për shembull, ju zgjidhni të zgjedhni kodin tuaj për të hequr vetëm boshllëqet nëse dëshironi. Pasi të keni klikuar në butonin e përpilimit, ai do të zvogëlojë kodin (ose do ta përpilojë) për ju.

    • minifycode.com (HTML, CSS dhe JS) - Kjo faqe në internet ofron minifiers për JavaScript , CSS et HTML me një ndërfaqe të thjeshtë dhe të pastër të përdoruesit që kompreson kodin tuaj me një klik të vetëm. Ajo gjithashtu ofron një mjet "zbukurues" për të dekompresuar kodin e minifikuar në mënyrë që ta bëjë atë më të lexueshëm (e kundërta e minifikimit).

Nëse jeni duke kërkuar mjete jashtë linje për të minimizuar HTML-në tuaj të CSS ose JavaScript në nivel lokal, këtu janë disa opsione:

Si të zvogëloni madhësinë e HTML, CSS dhe JavaScript tuaj duke përdorur një mjet në internet

Shumë nga këto mjete në internet kanë një proces të ngjashëm që përfshin hapat e mëposhtëm:

  • Ngjitni kodin tuaj burimor ose shkarkoni skedarin e burimit. 
  • Optimizoni cilësimet për një dalje specifike (nëse opsionet janë të disponueshme)
  • Klikoni një buton për të kompresuar kodin.
  • Kopjoni rezultatin e kodit të minifikuar ose shkarkoni skedarin e kodit të minifikuar.

Për këtë shembull, unë do të përdor mjetet e minifikimit nga minifycode.com.

Shih gjithashtu: Si të shtoni kodin CSS në mënyrë të sigurt në WordPress duke u konsultuar me këtë lidhje.

Së pari, lokalizoni skedarin CSS (zakonisht të quajtur stil.css) në skedarët tuaj të internetit dhe hapeni atë duke përdorur një redaktues faqesh. Pastaj kopjoni të gjithë kodin CSS në klipin tuaj.

kompresoni skedarët tuaj CSS, HTML dhe javascript në WordPress

shkoni në minifycode.com dhe klikoni në skedën CSS minifier. Pastaj ngjisni kodin CSS në kutinë e hyrjes dhe klikoni në butonin Minimizoni CSS.

minification css.jpg

Pasi të krijohet kodi i ri i minifikuar, kopjoni.

kopjoni një kod të kompresuar.jpg

Pastaj kthehuni përsëri në skedarin CSS të faqes suaj të internetit dhe zëvendësoni kodin me versionin e ri të thjeshtuar.

Kjo është e gjitha!

Përsëriteni të njëjtin proces për të ulur gjithashtu skedarët JavaScript dhe HTML të faqes tuaj të internetit.

Si të minimizoni HTML, CSS dhe JavaScript në WordPress duke përdorur Shtojcat

Mënyra më e lehtë për të minimizuar HTML, CSS dhe JavaScript në WordPress është të përdorni një shtojcë. Kjo ju lejon të optimizoni automatikisht skedarët tuaj të faqes në WordPress për të zvogëluar kohën e ngarkimit të faqes me vetëm disa klikime butonash.

Ka shumë shtojca që do ta kryejnë punën, por shkurtimisht do të përmend disa shembuj.

Autoptimizo (FALAS)

autooptimize wp.png
Autoptimize është ndoshta plugin WordPress nga minify më të njohura. Është popullor sepse është i lehtë për t'u përdorur dhe i mbushur me veçori të fuqishme. Mund të grumbullojë (kombinojë skriptet), të minimizojë dhe të ruajë kodin tuaj në memorie. Si bonus, ju keni opsione shtesë për të optimizuar fontet e Google, imazhet, etj.

Për të përdorur Autoptimize, mund të shkarkoni, instaloni dhe aktivizoni shtojcën nga pulti i WordPress nën Shtojcë> Shto të re.

Për më shumë informacion, shihni udhëzuesin tonë për:  Si të instaloni një plugin në WordPress

autoptimize.jpg

Pasi të aktivizohet shtojca, shkoni te Cilësimet> Optimizimi automatik. Pastaj, nën skedën Parametrat Kryesorë, kontrolloni kodin që dëshironi të optimizoni (HTML, CSS dhe / ose JavaScript) dhe klikoni në Eruaj ndryshimet.

optimizim css.jpg

Ju gjithashtu mund të klikoni në butonin Trego cilësimet e përparuara në krye të faqes për të personalizuar më tej optimizimin e kodit tuaj.

opsione css të përparuara.jpg

Moreshtë pak a shumë kjo! Krejt e thjeshtë dhe e fuqishme.

W3 Gjithsej Cache (FALAS)

v3 total cache.png
W3 Total Cache është një shtojcë e shkëlqyer e caching që ofron mundësinë për të minimizuar skedarët tuaj HTML, JS dhe CSS.

kompresoni skedarët CSS, HTML dhe javascript

Cache më e shpejtë WP (FALAS)

wp shpejtë cache.png
Cache më të shpejtë WP - Kjo shtojcë WordPress caching është jashtëzakonisht popullor me vlerësime të larta. Kryen optimizime të ndryshme të performancës, duke përfshirë kombinimin dhe zvogëlimin e HTML CSS dhe JavaScript tuaj për një performancë më të mirë.

Lexoni gjithashtu artikullin tonë në 8 WordPress plugins për të shtuar një bisedë të drejtpërdrejtë në blogun tuaj

Pasi të instalohet shtojca, thjesht kliko në skedë Cache më të shpejtë WP në shiritin anësor të panelit të kontrollit WordPress. Nën skedinë Cilësimet, do të gjeni mundësi për kombinimin dhe zvogëlimin e skedarëve HTML dhe CSS. Megjithëse minifikimi i JavaScript është i disponueshëm vetëm në versionin pro.

kompresoni skedarët CSS, HTML dhe javascript

Për ta përmbledhur

Nëse doni ta bëni blogun tuaj më të shpejtë dhe të keni performancë më të mirë, duhet të zvogëloni madhësinë e skedarëve tuaj HTML, CSS dhe JavaScript. Me të gjitha mjetet në dispozicion në internet, ju lehtë mund të zvogëloni kodin e çdo faqe në internet. 

9 WordPress plugins për të fshehur përmbajtjen e Blog-it tuaj për të zbuluar absolutisht

Për ata që përdorin WordPress, ju keni në dispozicion plugins të fuqishëm për të minimizuar këto skedarë automatikisht me disa klikime.

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. Faqja 404 Error Page Redirect në Homepage ose Custom Page

Këtu është një nga mënyrat më të mira për të shtuar me lehtësi një faqe gabimi 404 i cili do të ridrejtojë vizitorin në faqen kryesore ose faqen e personalizuar, pas aktivizimit të kësaj shtojce. Premium i WordPress.

404 faqe gabimi ridrejtuar në faqen kryesore ose faqen e personalizuar. shtojcë wordpress

Të gjitha faqet e gabimeve 404 do të ridrejtohen tek faqja kryesore ose te një URL me porosi. Duke përdorur këtë plugin WordPress, ju do të lejoni Google të zvogëlojë renditjen e faqeve të faqes tuaj nëse ka shumë faqe gabimi 404.

Zbuloni gjithashtu Si të rregulloni gabimin 413 në WordPress

Ce plugin WordPress nuk bën thjesht ridrejtim, por mund të jetë gjithashtu një zgjidhje e përshtatshme për të përmirësuar renditjen e faqes suaj të internetit në rezultatet e motorëve të kërkimit.

Shkarko | DEMO | web hosting

2. Borlabs Cache

WordPress është një platformë e mundësuar nga një bazë të dhënash që gjeneron përmbajtje dinamike. Sa më shumë përmbajtje dhe shtesa të keni, aq më shumë kërkesa të bazës së të dhënave ekzekutohen. Kjo mund të ngadalësojë performancën e faqes suaj të internetit, veçanërisht kur baza e të dhënave tuaja është e vendosur në një server të ndryshëm.

Shtojca e memorjes memorie të wordpress të Borlabs

Shtesa e WordPress Borlabs Cache kursen përmbajtje të gjeneruar dinamike si skedar statik në kujtesën e serverit tuaj. Kur kërkohet faqja, ky skedar statik ngarkohet dhe i dërgohet vizitorit, i cili është dukshëm më i shpejtë se pyetjet e zakonshme të bazës së të dhënave. Por nuk janë të gjitha.

Shihni edhe tonë 5 WordPress plugins për të pastruar bazën e të dhënave të faqes suaj të internetit

Faqet tuaja përmbajnë shumë hapësira të panevojshme të bardha ose komente HTML, gjë që rrit madhësinë e përgjithshme të faqes. Borlabs Cache i heq të gjitha dhe përdor GZIP për të ngjeshur faqet tuaja.

Zbuloj Si të shfaqni të gjitha postimet e WordPress në një faqe

Shumë shtojca kanë skedarët e tyre JavaScript dhe CSS, gjë që rezulton në më shumë kërkesa në serverin tuaj. Borlabs Cache kombinon të gjitha këto skedarë JavaScript dhe CSS në mënyrë që, në rastin më të mirë, vizitori juaj të ketë nevojë vetëm për të ngarkuar një skedar JavaScript dhe një skedar CSS.

Shkarko DEMO | web hosting

3. Shtypi shumëgjuhësh

Multilingual Press punon me një instalim në shumë faqe të WordPress dhe ju lejon të lidhni përkthimet. Shtojca vjen me 174 gjuhë të integruara në menaxherin e gjuhëve dhe mbështet faqe interneti të pakufizuara, kështu që ju mund të krijoni dhe lidhni sa më shumë përkthime që dëshironi.

Shtojcë shumëgjuhëshe e shtypit për përkthim shtojcë wordpress

Kjo është e mirë për SEO sepse kjo do t'ju lejojë të mbani gjuhët tuaja në postime dhe faqe të veçanta, dhe nëse ndonjëherë vendosni të përdorni një përkthim tjetër të shtojcës përmbajtja juaj mbetet e paprekur (edhe pas çaktivizimit ose heqjes së shtesës Multilingual Press). Përveç kësaj, mund të shtoni një widget përkthimi për të kaluar në mes të përkthimeve lehtë.

Zbuloj Si të shtoni një copë kodi duke përdorur Gutenberg në WordPress

Multilingual Press është një opsion i shkëlqyeshëm falas për të shtuar përkthime në faqen tuaj të WordPress nëpërmjet multisite. Përveç kësaj, nëse ndonjëherë zbuloni se keni nevojë për më shumë opsione, mund të zgjidhni versionin pro i cili kushton 75 dollarë.

Shkarko DEMO web hosting

Burime të tjera të rekomanduara

Ne gjithashtu ju ftojmë të konsultoheni me burimet më poshtë për të vazhduar më tej në kontrollin dhe kontrollin e faqes dhe blogut tuaj.

Përfundim