Slik redigerer du CSS / JavaScript-filer i WordPress

Slik redigerer du CSS / JavaScript-filer i WordPress / WordPress Plugins

Vil du redusere filer på WordPress-siden din? Ved å redusere WordPress CSS og Javascript-filene kan du laste dem raskere og øke hastigheten på WordPress-siden din. I denne veiledningen vil vi vise deg hvordan du kan redusere CSS / Javascript-filer i WordPress for å forbedre ytelse og hastighet.

Hva er Minify og Når trenger du det?

Begrepet "Minify" brukes til å beskrive en metode som gjør at nettstedet ditt blir mindre. Det oppnår dette målet ved å fjerne hvite mellomrom, linjer og unødvendige tegn fra kildekoden.

Vanligvis anbefales det å bare brukes til filer som sendes til brukerens nettlesere. Dette inkluderer HTML, CSS og JavaScript-filer. Du kan også redusere PHP-filer, men PHP er et programmeringsspråk på serversiden og redusere det, og det vil ikke forbedre sidens lasthastighet for brukerne dine..

Den åpenbare fordelen med å redusere filer er forbedret WordPress-hastighet og ytelse. Kompakte filer er raskere å laste og forbedre nettstedets hastighet.

Noen eksperter mener imidlertid at ytelsesforbedringen er svært liten for de fleste nettsteder og ikke verdt trøbbel. Minifiseringen reduserer bare få kilobytes data på de fleste WordPress-nettsteder. Du kan redusere mer pageload-tid ved bare å optimalisere bilder for web.

Her er et eksempel på vanlig CSS-kode:

kropp
margin: 20 piksler;
padding: 20 piksler;
color: # 333333;
bakgrunn: # f7f7f7;

h1
font-size: 32 piksler;
farge # 222222;
margin-bottom: 10px;

Etter å ha kalkulert koden vil det se slik ut:

body margin: 20 piksler, padding: 20 piksler, farge: # 333; bakgrunn: # f7f7f7 h1 font-size: 32 piksler; margin-bottom: 10px

Hvis du prøver å oppnå 100/100 poengsum på Google Pagespeed eller GTMetrix-verktøyet, vil minifisering av CSS og JavaScript betydelig forbedre poengsummen din..

Når det er sagt, la oss ta en titt på hvordan du enkelt kan redusere CSS / JavaScript på WordPress-siden din.

Minimer CSS / Javascript i WordPress

Første du må gjøre er å installere og aktivere pluginet for bedre WordPress Minify. For mer informasjon, se vår trinnvise veiledning om hvordan du installerer et WordPress-plugin.

Ved aktivering vil pluginet legge til et nytt menyelement merket "BWP Minify" til WordPress admin bar. Ved å klikke på det, tar du deg til innstillingssiden for plugin.

På innstillingssiden må du sjekke de to første alternativene for automatisk å redusere JavaScript- og CSS-filer på WordPress-siden din.

Du kan nå klikke på Lagre endringer-knappen for å lagre innstillingene dine.

Det finnes mange andre avanserte alternativer på denne siden. Standardinnstillingene vil fungere for de fleste nettsteder, men du kan gjennomgå og endre disse alternativene i hvert enkelt tilfelle.

Deretter må du gå over til nettstedet ditt. Høyreklikk hvor som helst og velg deretter Vis kildekode fra nettlesermenyen.

Du vil nå se HTML kilden koden generert av ditt WordPress nettsted. Hvis du ser nøye ut, vil du legge merke til at dette pluginet vil laste CSS / JavaScript-filer fra pluginens egen mappe i stedet for WordPress-temaene og pluginene.

Dette er de minifiserte versjoner av originale CSS- og JavaScript-filene. Bedre WordPress Minify-plugin vil holde dem hurtigbufrede og vise de minifiserte versjonene til nettlesere.

Det er alt, vi håper denne artikkelen hjalp deg med å lære å redusere ditt WordPress-nettsted. Du vil kanskje også se vår ultimate guide på hvordan du kan øke WordPress for nybegynnere.

Hvis du likte denne artikkelen, vennligst abonner på vår YouTube Channel for WordPress-videoopplæringsprogrammer. Du kan også finne oss på Twitter og Facebook.