Kaip pašalinti nenaudojamą CSS iš „WordPress“.

Jei jūsų „WordPress“ svetainėje naudojama mokama „WordPress“ tema arba populiari tema iš oficialios „WordPress“ temų saugyklos, tikėtina, kad tema bus sukurta įvairiems naudojimo atvejams. Galbūt naudojate tik nedidelį visų temos funkcijų rinkinį.

Tokiu atveju į jūsų svetainę įkeliama daug nenaudojamo CSS, kurio nereikia norint sukurti svetainės puslapių stilių. Pavyzdžiui, jūsų naudojama „WordPress“ tema taip pat gali turėti „WooCommerce“ puslapių stilių, tačiau jei „WordPress“ svetainėje tvarkote tik tinklaraštį, nenaudojate CSS, įtraukto į savo svetainės „WooCommerce“ puslapius, todėl nenaudojate. CSS vartotojams.

Jei išbandėte savo svetainę naudodami „Google Pagespeed“ įrankį, tikriausiai jau žinote, kad svetainėje yra nenaudojamų CSS problemų. Šiame vadove parodysime, kaip pirmiausia patikrinti, ar nėra nenaudojamo CSS, tada naudokite nemokamą įrankį, kad pašalintumėte nenaudojamą CSS iš savo „WordPress“ svetainės.

Kaip patikrinti nenaudojamą CSS

„Google Chrome DevTools“ (tas, kurį matote kontekstiniame meniu spustelėję parinktį „Tikrinti“) turi aprėpties funkciją skirtuke Šaltiniai. Galite naudoti parinktį Aprėptis, kad surastumėte nenaudojamus CSS ir JS, kuriuos įkelia jūsų svetainė.

  1. Atidarykite svetainę darbalaukio naršyklėje „Chrome“.
  2. Dešiniuoju pelės mygtuku spustelėkite tuščią baltą vietą svetainėje ir pasirinkite Apžiūrėti iš kontekstinio meniu.
  3. Spustelėkite ant Šaltiniai skirtuką, paspauskite Ctrl + Shift + P kad atidarytumėte komandų langą, tada įveskite aprėptis ir pasirinkite Pradėkite tikrinti aprėptį ir iš naujo įkelkite puslapį iš galimų komandų.
  4. Skirtuke Aprėptis spustelėkite URL filtras lauką ir čia įveskite savo svetainės šakninį domeną, kad būtų rodomi tik vidiniai CSS/JS failai.

    „Chrome“ šaltinio aprėpties skirtuko URL filtras

    └ Patikrinkite Nepanaudoti baitai stulpelyje, kad pamatytumėte, kiek procentų duomenų įkeliama į CSS / JS failą iš jūsų temos.

  5. Spustelėkite CSS failą, kad peržiūrėtumėte nenaudojamą CSS (pažymėtą raudonomis juostomis), įkeltą jūsų svetainėje. CSS, kuris naudojamas dabartiniame puslapyje, bus rodomas žaliomis juostomis.

    Nenaudojamas CSS rodinys „Chrome“.

Kai išanalizuosite visą nenaudojamą CSS, įkeliamą į jūsų svetainę, laikas jį pašalinti. Yra keletas nemokamų įrankių, skirtų pašalinti nenaudojamą CSS iš tinklalapių. Žemiau yra vienas iš populiariausių įrankių, kurį išbandžiau ir naudojau savo projektuose.

Norėdami pašalinti nenaudojamą CSS, naudokite „PurifyCSS Online“.

Paprastai „WordPress“ galite rasti papildinį beveik viskam. Deja, norint pašalinti nenaudojamą CSS, nėra nė vieno papildinio. Taigi, norėdami pašalinti nenaudojamą CSS iš jūsų svetainės, naudosime rankinius ne „WordPress“ įrankius.

PurifyCSS yra labiausiai draugiškas ne kūrėjas įrankis galite rasti susidoroti su nenaudojamu CSS. Įrankis turi paprastą vartotojo sąsają, leidžiančią vartotojams pateikti svetainės URL ARBA HTML ir CSS kodus. „WordPress“ naudosime URL parinktį ir pateiksime nuorodas į visų tipų jūsų svetainės puslapius, kad įrankis gautų visų CSS ir optimizuotų nenaudojamą CSS.

Pašalinti-nenaudojamą-CSS-PurifyCSS-Online-įrankį

Štai trumpas puslapių, kuriuos turėtumėte įdėti į įrankį, sąrašas:

  • Pagrindinio puslapio URL
  • Keli skelbimo puslapių URL iš kiekvienos svetainės kategorijos

    └ Taip siekiama užtikrinti, kad CSS būtų įtrauktas į visus įrašo elementus.

  • Kontaktai, Apie, Privatumas ir įvairūs puslapiai, kuriuos galite turėti savo svetainėje.
  • Archyvo puslapis, Paieškos puslapis, Autoriaus puslapiai
  • Pasirinktinio įrašo tipo puslapiai

Karštas patarimas: Sukurkite „funkcijų“ įrašą / puslapį su visais teminiais elementais, kuriuos naudojate arba galite naudoti ateityje, pvz., lentelę, vaizdų galeriją, kodą, išankstinius, sutvarkytus sąrašus, nerūšiuotus sąrašus, formas, skirtukus, akordeonus, Gutenbergo blokus, kuriuos paprastai naudojate. ir kt.

Naudokite šį „funkcijų“ skelbimo URL „PurifyCSS Online“ įrankyje, kad įsitikintumėte, jog yra įtrauktas dažniausiai naudojamų elementų CSS.

Pataikykite Išvalykite CSS mygtuką, kai į PurifyCSS Online įrankį įtraukėte visus atitinkamus URL tipus iš savo svetainės.

Nukopijuokite naują įrankio sugeneruotą CSS ir naudokite jį savo svetainėje. Įsitikinkite, kad jums sukurkite atsarginę originalaus stiliaus.css atsarginę kopiją ir kitus CSS failus temoje prieš pakeisdami naują CSS, sukurtą PurifyCSS.

Patarimas: Galite naudoti integruotą „WordPress“ temų rengyklę, norėdami redaguoti temos CSS failus, arba galite naudoti FTP / SFTP programą, kad galėtumėte prisijungti prie serverio ir patogiai redaguoti failus naudodami „Notepad“ rengyklę.