Slik fjerner du ubrukt CSS og JS i WordPress (Veldig enkelt)

Å ha mye ubrukt CSS og JS på nettstedet ditt kan skade nettstedets lastetid. Hvis du driver nettstedet ditt gjennom en verktøy for hastighetstesting slik som Google PageSpeed Insight, kan det hende du får en advarsel om å fjerne ubrukt CSS.

Heldigvis er det en veldig enkel måte å gjøre det på. Du trenger ikke ha noen spesiell teknisk kunnskap for å kunne fjerne ubrukt CSS og JS fra WordPress-siden din.

Dette er på grunn av en fantastisk plugin kjent som Asset CleanUp: Page Speed Booster. Med denne plugin er det like enkelt å fjerne ubrukt CSS som å klikke på noen få knapper. Alternativt, hvis du ikke har noe imot å bruke noen få dollar i året, med WP Rocket, det er en fjernet ubrukt CSS-knapp, bare aktiver den og plugin-en vil fjerne all ubrukt CSS automatisk.

Checkout: Topp 7 administrerte Google Cloud WordPress-vertstjenester

Innholdsfortegnelse skjule

Hva er ubrukt CSS?

Hvordan identifisere ubrukt CSS

Hvordan fjerne ubrukt CSS

Fjern ubrukte CSS WordPress-plugins

Konklusjon

Hva er ubrukt CSS?

Ubrukt CSS er en CSS-fil som finnes på en side, men som stort sett ikke er nødvendig for at siden skal lastes. Når en besøkende åpner et nettsted, må nettleseren vanligvis laste ned, analysere og behandle alle eksterne stilark på den besøkte siden før den kan vise sideinnholdet til den besøkende. Hvis det finnes en CSS på en slik side som ikke brukes på siden, vil nettleseren kaste bort tiden sin på den.

Et klassisk eksempel på dette er de fleste kontaktskjemapluginene som brukes. Selv om disse pluginene for det meste bare brukes på Kontakt oss-siden, laster du inn CSS på hele nettstedet. Det spiller ingen rolle om det er hjemmesiden der den ikke brukes, CSS vil lastes.

Hvis det er for mange CSS som ikke er nødvendig, men som laster inn og senker nettleserens tid til å lese og vise en side, kan det bli et problem.

Bortsett fra plugins, skriver temautviklere mange ting inn i style.css som stort sett ikke er nødvendig. Men uansett om det er nødvendig eller ikke, de laster inn når nettstedet ditt er lastet!

En ubrukt CSS er kanskje ikke et problem, men mye ubrukt CSS kan påvirke lastetiden til nettstedet ditt.

Checkout: Topp 10 raskeste og beste WordPress-temaer

Hvordan identifisere ubrukt CSS

Å finne ubrukt CSS og JS er en veldig enkel ting å gjøre. Det er to tilnærminger jeg vil anbefale.

Den ene er å analysere nettstedet ditt gjennom Google PageSpeed Insight. Sjekk om nettstedet ditt har et problem med fjern ubrukt CSS. Klikk på den og du vil kunne identifisere komponenten på nettstedet ditt som er ansvarlig for det.

Du kan se ovenfra at det er registrert ett tilfelle av ubrukt CSS. Jeg kan se plugin-en og plasseringen til den ubrukte CSS-en ved å se på dette.

Det andre alternativet er å få en mer detaljert analyse. Du kan oppnå dette ved å bruke Chrome Dev-verktøy.

Åpne Chrome Dev-verktøy i Chrome-nettleseren og gå til dekning. Klikk deretter på reload-knappen inne i dekningsområdet. Du kan finne en omfattende veiledning om hvordan du gjør dette i Google Developers-verktøyet.

Det andre alternativet er å bruke jitbit for å skanne etter ubrukte CSS-velgere. Du kan også bruke PurifyCSS for å finne ubrukt CSS

Hvordan fjerne ubrukt CSS

Følg disse trinnene for å fjerne ubrukt CSS fra WordPress:

1. Installer Asset CleanUp

Gå til plugin og deretter Legg til ny. Deretter skriver du "Asset CleanUp" i søkeboksen på siden Legg til ny plugin. Installer og aktiver plugin-en.

2. Gå til plugin-innstillinger

For å få tilgang til plugin-innstillinger, klikk på innstillinger fra WordPress-dashbordet og klikk deretter på Asset CleanUp.

3. Last av uønsket CSS og JS

På plugin-innstillingene må du kanskje godta at du vet hvordan plugin-en fungerer under stripping-fettkranen før du begynner.

For å laste ned CSS og JS klikk på CSS og JSS manager. Derfra kan du fjerne CSS og JS som du ikke trenger. Du kan fjerne det bare for hjemmesiden, for hele nettstedet eller for en bestemt URL. Du kan også fjerne for innlegg, sider eller kategorier.

Et eksempel er å fjerne ethvert kontaktskjema fra lasting for hele nettstedet bortsett fra kontakt oss-siden

Ta deg god tid og last ut hver CSS og JS som du vet ikke er nødvendig. Pass på at du tester nettstedet ditt etter at du er ferdig for å sikre at alt er i orden.

Fjern ubrukte CSS WordPress-plugins

Her er noen plugins du kan bruke for å fjerne ubrukt CSS i WordpPress:

1. Asset CleanUp: Page Speed Booster

Asset CleanUp: Page Speed Booster gjør det enkelt å fjerne ubrukt CSS og JSin WordPress selv for nybegynnere. Alt du trenger å gjøre er å deaktivere en bestemt CSS som ikke er nødvendig for en bestemt side.

Du kan også deaktivere for enkeltinnlegg alene. Med premiumversjonen kan du deaktivere ubrukt CSS/JS med plugins.

Denne plugin er en komplett ytelse plugin med mange andre alternativer for å øke hastigheten på WordPress. Å fjerne ubrukt CSS/JS er bare en del av det.

I dette innlegget brukte jeg denne plugin-en har en guide.

2. WP Rocket

WP Rocket er WordPress premium ytelse plugin nummer én. Hvis du er en noob, mener jeg at hvis du ikke er erfaren eller komfortabel med WordPress, så er WP Rocket den enkleste måten å fjerne ubrukt CSS for.

Du må kjøpe plugin, når du har gjort det, kan du laste den ned fra kontoen din eller sjekke e-posten din for en nedlastingslenke.

Installer programtillegget via Dashboard>plugins>Add new>Last opp.

Bare naviger til WP Rocket-innstillingene og klikk deretter på fanen "Filoptimalisering". Rull deretter ned og du vil se "Fjern ubrukt CSS", merk av i boksen, lagre og tøm hurtigbufferen.

3. Perfmatters

Perfmatters er en premium plugin utviklet av Brian Jackson og broren hans, Brett Jackson. Denne plugin-en kan hjelpe med å fjerne ubrukt CSS veldig enkelt.

Først må du kjøpe plugin. Installer den deretter. Aktiver lisens. Når du navigerer til innstillinger, slår du på skriptbehandling.

Bare gå til en hvilken som helst side eller post på nettstedet ditt, du vil se skriptbehandlerikonet på dashbordmenyen, klikk på det. Du vil kunne fjerne ubrukte CSS og JS fra siden eller globalt.

Denne plugin-en er en ytelses-plugin, kommer med mange andre alternativer for å øke hastigheten på WordPress. Å fjerne ubrukt CSS/JS er en del av det.