మీ WordPress సైట్ చెల్లింపు WordPress థీమ్‌ను లేదా అధికారిక WordPress థీమ్స్ రిపోజిటరీ నుండి జనాదరణ పొందిన థీమ్‌ను ఉపయోగిస్తుంటే, వివిధ రకాల వినియోగ సందర్భాల కోసం థీమ్‌ను అభివృద్ధి చేసే అవకాశాలు ఎక్కువగా ఉంటాయి. మరియు మీరు థీమ్‌లో అందుబాటులో ఉన్న అన్ని లక్షణాల యొక్క చిన్న సెట్‌ను మాత్రమే ఉపయోగిస్తూ ఉండవచ్చు.
అలాంటప్పుడు, మీ సైట్ మీ సైట్ పేజీలను స్టైల్ చేయడానికి అవసరం లేని మొత్తం ఉపయోగించని CSSని లోడ్ చేస్తోంది. ఉదాహరణకు, మీరు ఉపయోగిస్తున్న WordPress థీమ్ WooCommerce పేజీల కోసం కూడా స్టైల్‌లను కలిగి ఉండవచ్చు కానీ మీరు మీ WordPress సైట్‌లో బ్లాగును మాత్రమే నడుపుతున్నట్లయితే, మీరు మీ సైట్‌లోని WooCommerce పేజీల కోసం చేర్చబడిన CSSని ఉపయోగించడం లేదు మరియు తద్వారా ఉపయోగించని సేవలను అందిస్తోంది. వినియోగదారులకు CSS.
మీరు Google Pagespeed సాధనంలో మీ వెబ్‌సైట్‌ను పరీక్షించినట్లయితే, మీ సైట్ ఉపయోగించని CSS సమస్యలను కలిగి ఉందని మీకు ఇప్పటికే తెలిసి ఉండవచ్చు. ఈ గైడ్‌లో, మొదట ఉపయోగించని CSSని ఎలా తనిఖీ చేయాలో మేము మీకు చూపుతాము, ఆపై మీ WordPress సైట్ నుండి ఉపయోగించని CSSని తీసివేయడానికి ఉచిత సాధనాన్ని ఉపయోగించండి.
ఉపయోగించని CSSని ఎలా తనిఖీ చేయాలి
Google Chrome DevTools (మీరు సందర్భ మెనులో “ఇన్‌స్పెక్ట్ చేయి” ఎంపికను క్లిక్ చేసినప్పుడు మీరు చూసేది) సోర్సెస్ ట్యాబ్‌లో కవరేజ్ ఫీచర్‌ను కలిగి ఉంటుంది. మీరు మీ వెబ్‌సైట్ లోడ్ చేసే ఉపయోగించని CSS మరియు JSలను కనుగొనడానికి కవరేజ్ ఎంపికను ఉపయోగించవచ్చు.
- మీ వెబ్‌సైట్‌ను డెస్క్‌టాప్‌లో Chromeలో తెరవండి.
- మీ సైట్‌లోని ఖాళీ ఖాళీ స్థలంపై కుడి-క్లిక్ చేసి, ఎంచుకోండి తనిఖీ చేయండి సందర్భ మెను నుండి.
- పై క్లిక్ చేయండి మూలాలు ట్యాబ్, నొక్కండి Ctrl + Shift + P కమాండ్ విండోను తెరవడానికి, ఆపై టైప్ చేయండి కవరేజ్ మరియు ఎంచుకోండి సాధన కవరేజీని ప్రారంభించండి మరియు పేజీని రీలోడ్ చేయండి అందుబాటులో ఉన్న ఆదేశాల నుండి.
- కవరేజ్ ట్యాబ్ కింద, క్లిక్ చేయండి URL ఫిల్టర్ ఫీల్డ్ చేసి, అంతర్గత CSS/JS ఫైల్‌లను మాత్రమే చూపించడానికి మీ సైట్ యొక్క రూట్ డొమైన్‌ను ఇక్కడ నమోదు చేయండి.
└ తనిఖీ చేయండి ఉపయోగించని బైట్లు మీ థీమ్ నుండి CSS/JS ఫైల్‌లో లోడ్ అవుతున్న డేటా శాతాన్ని చూడటానికి నిలువు వరుస.
- మీ సైట్ ద్వారా లోడ్ చేయబడిన ఉపయోగించని CSS (ఎరుపు పట్టీలతో గుర్తించబడింది) వీక్షించడానికి CSS ఫైల్‌పై క్లిక్ చేయండి. ప్రస్తుత పేజీలో ఉపయోగించబడుతున్న CSS ఆకుపచ్చ బార్‌లతో చూపబడుతుంది.
మీ వెబ్‌సైట్‌లో ఉపయోగించని CSS మొత్తం లోడ్ చేయబడిందని మీరు విశ్లేషించిన తర్వాత, దాన్ని తీసివేయడానికి ఇది సమయం. వెబ్‌పేజీల నుండి ఉపయోగించని CSSని తీసివేయడానికి అనేక ఉచిత సాధనాలు అందుబాటులో ఉన్నాయి. నేను నా స్వంత ప్రాజెక్ట్‌లలో పరీక్షించి, ఉపయోగించిన ప్రసిద్ధ సాధనాల్లో ఒకటి క్రింద ఉంది.
ఉపయోగించని CSSని తొలగించడానికి PurifyCSS ఆన్‌లైన్‌ని ఉపయోగించండి
సాధారణంగా, మీరు WordPressలో దాదాపు ప్రతిదానికీ ప్లగిన్‌ని కనుగొనవచ్చు. కానీ ఉపయోగించని CSSని తీసివేయడానికి, దురదృష్టవశాత్తూ, ఒక్క ప్లగ్ఇన్ కూడా అందుబాటులో లేదు. కాబట్టి మేము మీ సైట్ నుండి ఉపయోగించని CSSని తీసివేయడానికి మాన్యువల్ కాని WordPress-నిర్దిష్ట సాధనాలను ఉపయోగిస్తాము.
PurifyCSS అత్యంత స్నేహపూర్వక నాన్-డెవలపర్ సాధనం ఉపయోగించని CSSతో వ్యవహరించడానికి మీరు కనుగొనవచ్చు. వెబ్‌సైట్ URL లేదా HTML మరియు CSS కోడ్‌ని అందించడానికి వినియోగదారులను అనుమతించడానికి సాధనం సరళమైన UIని కలిగి ఉంది. WordPress కోసం, మేము URL ఎంపికను ఉపయోగిస్తాము మరియు మీ సైట్‌లోని అన్ని రకాల పేజీలకు లింక్‌లను అందజేస్తాము మరియు సాధనం అన్నింటి నుండి CSSని పట్టుకోవడానికి మరియు ఉపయోగించని CSS కోసం ఆప్టిమైజ్ చేయడానికి అనుమతిస్తుంది.
మీరు సాధనంలో ఉంచవలసిన పేజీల శీఘ్ర జాబితా ఇక్కడ ఉంది:
- హోమ్‌పేజీ URL
- మీ సైట్‌లోని ప్రతి వర్గం నుండి బహుళ పోస్ట్ పేజీ URLలు
└ ఇది అన్ని పోస్ట్ ఎలిమెంట్స్ కోసం CSS చేర్చబడిందని నిర్ధారించడం.
- సంప్రదింపులు, పరిచయం, గోప్యత మరియు మీ సైట్‌లో మీరు కలిగి ఉండే అన్ని రకాల విభిన్న పేజీలు.
- ఆర్కైవ్ పేజీ, శోధన పేజీ, రచయిత పేజీలు
- అనుకూల పోస్ట్ రకం పేజీలు
హాట్ చిట్కా: మీరు సాధారణంగా ఉపయోగించే టేబుల్, ఇమేజ్ గ్యాలరీ, కోడ్, ప్రీ, ఆర్డర్ చేసిన జాబితాలు, క్రమం చేయని జాబితాలు, ఫారమ్‌లు, ట్యాబ్‌లు, అకార్డియన్‌లు, గుటెన్‌బర్గ్ బ్లాక్‌లు వంటి మీరు ఉపయోగించే లేదా భవిష్యత్తులో ఉపయోగించగల అన్ని థీమ్ ఎలిమెంట్‌లతో 'ఫీచర్‌ల' పోస్ట్/పేజీని సృష్టించండి , మొదలైనవి
సాధారణంగా ఉపయోగించే మూలకాల కోసం CSS చేర్చబడిందని నిర్ధారించుకోవడానికి PurifyCSS ఆన్‌లైన్ సాధనంలో ఈ 'ఫీచర్స్' పోస్ట్ URLని ఉపయోగించండి.
కొట్టండి CSSని శుభ్రపరచండి మీరు మీ సైట్ నుండి PurifyCSS ఆన్‌లైన్ టూల్‌లో అన్ని సంబంధిత URLల రకాలను జోడించిన తర్వాత బటన్.
సాధనం ద్వారా రూపొందించబడిన కొత్త CSSని కాపీ చేసి, దాన్ని మీ సైట్‌లో ఉపయోగించండి. నిర్ధారించుకోండి, మీరు అసలు style.cssని బ్యాకప్ చేయండి PurifyCSS ద్వారా రూపొందించబడిన కొత్త CSSని భర్తీ చేయడానికి ముందు మరియు మీ థీమ్‌లోని ఇతర CSS ఫైల్‌లు.
చిట్కా: మీరు మీ థీమ్ యొక్క CSS ఫైల్‌లను సవరించడానికి అంతర్నిర్మిత WordPress థీమ్ ఎడిటర్‌ని ఉపయోగించవచ్చు లేదా మీరు సర్వర్‌కి కనెక్ట్ చేయడానికి మరియు నోట్‌ప్యాడ్ ఎడిటర్‌ని ఉపయోగించి ఫైల్‌లను సౌకర్యవంతంగా సవరించడానికి FTP/SFTP ప్రోగ్రామ్‌ని ఉపయోగించవచ్చు.