Želite li komprimirati svoje CSS, HTML i javascript datoteke na WordPressu?

Kada komprimirate CSS, HTML i Javascript datoteke svoje web lokacije, možete uštedjeti dragocjeno vrijeme na brzini učitavanja stranice vašeg web mjesta. Sada ne govorimo o smanjenju brzine učitavanja stranice na pola ili o nečemu drugom, no kad je riječ o brzini web stranice, bilo što malo je važno.

Brzina učitavanja vaše web stranice nije važna samo za nove posjetitelje, već i za rangiranje na tražilicama.

Pojam "umanjitiU programskom jeziku opisuje postupak uklanjanja nepotrebnih znakova iz izvornog koda. Ovi znakovi uključuju razmake, prijelome redaka, komentari i blokirati razlučivače koji su korisni za nas ljude, ali beskorisni za strojeve.

Umanjujemo datoteke web mjesta koje sadrže CSS, HTML i Javascript kôd kako bi ih vaš web preglednik mogao brže čitati.

Pročitajte i naš članak o 10 WordPress čep za poboljšanje brzine vašeg bloga

Evo primjera minifikacije CSS-a.

CSS prije minifikacije

/ * Primjer CSS datoteke ---------------------------------- * / .user-profile-card { margin: 0px; pozadina: #33E43} .user-profile-description {granica: 0; položaj: apsolutni; širina: auto; margina-top: 20px; }

CSS nakon minifikacije

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

Očito je ovo samo mali primjer korištenja CSS isječka, ali možete zamisliti koliko bi prostora uštedio kad bi smanjio tisuće redaka koda. 

Kako povećati vrijeme provedeno na svom WordPress blogu? Doznajte savjetujući ovaj članak.

Dakle, ako to želite ručno, tehnički možete. Ali riskirat ćete visok rizik i nepotrebno izgubiti dragocjeno vrijeme svog života!

Slijedite ove savjete i koristite alate koji su vam na raspolaganju.

Neki alati za izvođenje kompresije

Srećom, ne morate nužno biti programer ili znati bilo koji programski jezik da biste smanjili veličine datoteka svoje web stranice. Minifikacija je postala uobičajena praksa u svijetu web dizajna. Stoga se ne biste trebali iznenaditi kad saznate da postoji mnogo prekrasnih (i besplatnih) alata koji će posao obaviti umjesto vas.

Vidi i naše 6 WordPress dodataka koji će udahnuti novi život vašim člancima

Evo popisa korisnih alata za početak. Budući da mnoge od njih mogu minimizirati više vrsta koda, u zagrade sam uključio opcije vrste koda.

    • cssminifier.com et javascript-minifier.com (CSS i JS) - Ova dva minifirera Andrewa Chiltona jednostavna su za upotrebu. Samo trebate zalijepiti svoj kôd, a zatim kliknite gumb Umanjiti za prikaz komprimiranog koda. Možete čak i preuzeti izlazni kôd kao datoteku radi praktičnosti.
    • htmlcompressor.com (HTML, CSS i JS) - Ovaj mrežni alat za kompresiju / minifikaciju podržava vrste HTML, CSS i JS kodova. Čak podržava različite kombinacije vrsta koda kao što su CSS + PHP i JavaScript + PHP. Možete čak i provjeriti ima li komprimiranog koda pogrešaka.
    • csscompressor.net (Samo CSS) - Ovaj mrežni CSS kompresor je brz, jednostavan i besplatan za upotrebu.
    • jscompress.com (Samo JS) - Ovaj JavaScript alat za kompresiju omogućuje komprimiranje JavaScript koda kopiranjem i lijepljenjem, ali istovremeno možete preuzeti i više JavaScript datoteka. Ovo je idealno za kombiniranje JavaScript datoteka u jednu datoteku radi veće brzine učitavanja stranice.
    • Dan's Tools - Danovi alati predlaže un umanjite CSS i umanji JavaScript . Oba alata imaju stvarno čisto, jednostavno za korištenje korisničko sučelje. Ne nude napredne opcije, ali izvrsne su za uobičajene svrhe minifikacije.
    • refresh-sf.com (HTML, CSS i JS) - Ovaj kompresor smanjit će vrste JavaScript, CSS i HTML koda. Također uključuje sve mogućnosti kompresije za svaku vrstu koda ako su vam potrebne.
    • Zatvarač sastavljač (Samo JS) - Kompilator zatvaranja je dio Alati za zatvaranje , skup alata tvrtke Google Developers. Omogućuje vam smanjivanje JavaScripta zajedno s drugim korisnim optimizacijama. Možete koristiti svoj Javascript kod tako da unesete URL lokacije js datoteke, a zatim odaberete kako želite da kôd bude optimiziran i formatiran. 

Na primjer, optimizirate kôd kako biste uklonili samo praznine ako želite. Jednom kada kliknete gumb za sastavljanje, on će vam smanjiti kod (ili ga sastaviti).

    • minifycode.com (HTML, CSS i JS) - Ova web stranica nudi minifiere za JavaScript , CSS et HTML s jednostavnim i čistim korisničkim sučeljem koje komprimira kôd jednim klikom. Također nudi alat za uljepšavanje kako bi se dekomprimirao kôd kako bi se učinio čitljivijim (suprotno od smanjenja).

Ako tražite izvanmrežne alate za smanjivanje lokalnog CSS-a ili JavaScript HTML-a, evo nekoliko opcija:

Kako smanjiti veličinu HTML-a, CSS-a i JavaScript-a pomoću mrežnog alata

Mnogi od ovih mrežnih alata imaju sličan postupak koji uključuje sljedeće korake:

  • Zalijepite svoj izvorni kôd ili preuzmite datoteku izvornog koda. 
  • Optimizirajte postavke za određeni izlaz (ako su dostupne opcije)
  • Kliknite gumb za komprimiranje koda.
  • Kopirajte rezultat minificiranog koda ili preuzmite datoteku s izmijenjenim kodom.

Za ovaj primjer, upotrijebit ću alate Minify iz minifycode.com.

Otkrijte također: Kako dodati CSS kod sigurno na WordPress savjetujući ovu vezu.

Prvo pronađite CSS datoteku (uobičajeno zvanu style.css) u datotekama vaše web stranice i otvorite je pomoću uređivača stranica. Zatim kopirajte sav CSS kôd u međuspremnik.

komprimirajte svoje CSS, HTML i javascript datoteke na WordPressu

ići minifycode.com i kliknite karticu CSS minifier. Zatim zalijepite CSS kôd u okvir za unos i kliknite gumb Umanjite CSS.

minifikacija css.jpg

Jednom kada se generira novi minificirani kôd, kopirajte ga.

kopirajte komprimirani kod.jpg

Zatim se vratite na CSS datoteku vaše web stranice i zamijenite kôd s novom pojednostavljenom verzijom.

To je sve!

Ponovite isti postupak da biste umanjili i JavaScript i HTML datoteke na vašem web mjestu.

Kako minimizirati HTML, CSS i JavaScript u WordPressu pomoću dodataka

Najlakši način da umanjite HTML, CSS i JavaScript u WordPressu je upotreba dodatka. To vam omogućuje automatsku optimizaciju datoteka web stranica WordPress kako biste smanjili vrijeme učitavanja stranice sa samo nekoliko klikova na gumb.

Puno je dodataka koji će odraditi posao, ali ukratko ću spomenuti nekoliko primjera.

Automatski optimizirajte (BESPLATNO)

autooptimize wp.png
Autoptimize je vjerojatno WordPress plugin od najpopularnijih minify. Popularan je jer je jednostavan za korištenje i prepun moćnih značajki. Može grupirati (kombinirati skripte), smanjiti i predmemorirati vaš kod. Kao bonus, imate dodatne opcije za optimizaciju Google fontova, slika itd.

Za upotrebu automatske optimizacije možete preuzeti, instalirati i aktivirati dodatak s nadzorne ploče WordPressa ispod Dodatak> Dodaj novi.

Za više informacija pogledajte naš vodič na:  Kako instalirati dodatak u WordPress

autoptimize.jpg

Nakon što se dodatak aktivira, idite na Postavke> Automatska optimizacija. Zatim na kartici Glavni parametri označite kod koji želite optimizirati (HTML, CSS i / ili JavaScript) i kliknite na Espremite promjene.

optimizacija css.jpg

Možete kliknuti i na gumb Pokaži napredne postavke na vrhu stranice kako biste dodatno prilagodili optimizaciju koda.

css opcije advanced.jpg

To je više-manje to! Sasvim jednostavno i moćno.

W3 Ukupni predmemorija (BESPLATNO)

v3 total cache.png
W3 Ukupno Cache izvrstan je dodatak za predmemoriranje koji nudi mogućnost minimiziranja vaših HTML, JS i CSS datoteka.

komprimirati CSS, HTML i javascript datoteke

WP najbrži predmemorija (BESPLATNO)

wp najbrži cache.png
Najbrži Cache WP-a - Ovaj dodatak WordPress predmemoriranje je izuzetno popularno s visokim ocjenama. Izvodi različite optimizacije performansi, uključujući kombiniranje i smanjenje HTML CSS-a i JavaScript-a za bolje performanse.

Pročitajte i naš članak o 8 WordPress plugins dodati live chat na svoj blog

Jednom kada je dodatak instaliran, jednostavno kliknite karticu Najbrži Cache WP-a na bočnoj traci nadzorne ploče WordPressa. Ispod kartice Postavke, naći ćete mogućnosti za kombiniranje i smanjenje HTML i CSS datoteka. Iako je minimiziranje JavaScript dostupno samo u pro verziji.

komprimirati CSS, HTML i javascript datoteke

Da sumiram

Ako svoj blog želite ubrzati i imati bolje performanse, morate smanjiti veličinu HTML, CSS i JavaScript datoteka. Pomoću svih dostupnih mrežnih alata možete lako smanjiti kod bilo kojeg web mjesta. 

9 WordPress dodataka za skrivanje sadržaja vašeg bloga otkriti apsolutno

Za one koji koriste WordPress, na raspolaganju su vam snažni dodaci za automatsko minimiziranje ovih datoteka s nekoliko klikova.

Otkrijte i neke premium WordPress dodatke  

Možete koristiti druge WordPress plugins dati moderan izgled i optimizirati rukovanje vašim blogom ili web stranicom.

Ovdje vam nudimo nekoliko premium WordPress dodataka koji će vam pomoći u tome.

1. Stranica pogreške 404 preusmjerava na početnu stranicu ili prilagođenu stranicu

Evo jednog od najboljih načina za lako dodavanje stranice s pogreškom 404 koja će posjetitelja preusmjeriti na početnu stranicu ili personaliziranu stranicu nakon aktiviranja ovog dodatka. WordPress premium.

Stranica s pogreškom 404 preusmjerava na početnu stranicu ili prilagođenu stranicu. wordpress dodatak

Sve 404 stranice pogreške bit će preusmjerene na početnu stranicu ili na prilagođeni URL. Korištenjem ovoga WordPress plugin, omogućit ćete Googleu da smanji rang stranice vaše web stranice ako ima mnogo stranica s pogreškom 404.

Otkrijte i vi Kako popraviti pogrešku 413 na WordPressu

Ce WordPress plugin ne radi samo preusmjeravanje, već može biti i prikladno rješenje za poboljšanje rangiranja vaše web stranice u rezultatima tražilice.

Preuzmite | demo | Web hosting

2. Borlabs Cache

WordPress je platforma koju pokreće baza podataka koja dinamički generira sadržaj. Što više sadržaja i dodataka imate, to se veći broj upita baze podataka izvršava. To može usporiti performanse vaše web stranice, posebno ako se vaša baza podataka nalazi na drugom poslužitelju.

Borlabs cache dodatak za predmemoriranje wordpress-a

Dodatak WordPress Borlabs Cache sprema dinamički generirani sadržaj kao statičku datoteku u memoriji vašeg poslužitelja. Kada se zatraži stranica, ova se statička datoteka učitava i šalje posjetitelju, što je znatno brže od uobičajenih upita baze podataka. Ali to nije sve.

Vidi i naše 5 WordPress plugins za čišćenje baze podataka vaše web stranice

Vaše stranice sadrže puno nepotrebnog bijelog prostora ili HTML komentara, što povećava ukupnu veličinu stranice. Borlabs cache uklanja ih sve i koristi GZIP za komprimiranje vaših stranica.

Otkrijte Kako prikazati sve Vaše WordPress publikacije na jednoj stranici

Mnogi dodaci imaju vlastite JavaScript i CSS datoteke, što rezultira s više zahtjeva na vašem poslužitelju. Borlabs Cache kombinira sve te JavaScript i CSS datoteke tako da, u najboljim slučajevima, vaš posjetitelj mora učitati samo jednu JavaScript datoteku i jednu CSS datoteku.

Preuzmite demo | Web hosting

3. Višejezični tisak

Multilingual Press radi s instalacijom WordPressa na više stranica i omogućuje vam povezivanje prijevoda. Dodatak dolazi sa 174 jezika ugrađena u upravitelj jezika i podržava neograničen broj web stranica, tako da možete kreirati i povezati koliko god želite prijevoda.

Višejezični dodatak za prijevod za tisak wordpress dodatak

Ovo je dobro za SEO jer će vam to omogućiti da zadržite svoje jezike na odvojenim postovima i stranicama, a ako ikada odlučite koristiti drugačiji prijevod dodatka, vaš sadržaj ostaje netaknut (čak i nakon onemogućavanja ili uklanjanja dodatka Multilingual Press). Osim toga, možete dodati widget za prijevod da biste lakše prebacivali između prijevoda.

Otkrijte Kako dodati isječak koda pomoću Gutenberga na WordPressu

Višejezični tisak odlična je besplatna opcija za dodavanje prijevoda na vašu WordPress stranicu putem višestranično, Pored toga, ako ikad ustanovite da vam trebaju dodatne mogućnosti, možete se odlučiti za pro verziju koja košta 75 dolara.

Preuzmite demo Web hosting

Ostali preporučeni resursi

Također vas pozivamo da se savjetujete sa donjim izvorima kako biste poboljšali i kontrolirali svoju web stranicu i blog.

Zaključak