வேர்ட்பிரஸ் இல் பயன்படுத்தப்படாத CSS ஐ எவ்வாறு அகற்றுவது

உங்கள் வேர்ட்பிரஸ் தளம் பணம் செலுத்திய வேர்ட்பிரஸ் தீம் அல்லது அதிகாரப்பூர்வ வேர்ட்பிரஸ் தீம்கள் களஞ்சியத்திலிருந்து பிரபலமான ஒன்றைப் பயன்படுத்தினால், பல்வேறு பயன்பாட்டு நிகழ்வுகளுக்காக தீம் உருவாக்கப்படுவதற்கான வாய்ப்புகள் அதிகம். மேலும் தீமில் உள்ள அனைத்து அம்சங்களின் சிறிய தொகுப்பை மட்டுமே நீங்கள் பயன்படுத்திக் கொண்டிருக்கலாம்.

அப்படியானால், உங்கள் தளம் உங்கள் தளத்தின் பக்கங்களை வடிவமைக்கத் தேவையில்லாத பயன்படுத்தப்படாத CSS முழுவதையும் ஏற்றுகிறது. எடுத்துக்காட்டாக, நீங்கள் பயன்படுத்தும் வேர்ட்பிரஸ் தீம் WooCommerce பக்கங்களுக்கான பாணிகளைக் கொண்டிருக்கலாம், ஆனால் நீங்கள் உங்கள் வேர்ட்பிரஸ் தளத்தில் ஒரு வலைப்பதிவை மட்டுமே இயக்குகிறீர்கள் என்றால், நீங்கள் உங்கள் தளத்தில் உள்ள WooCommerce பக்கங்களுக்குச் சேர்க்கப்பட்டுள்ள CSS ஐப் பயன்படுத்தவில்லை, எனவே பயன்படுத்தப்படாத சேவையை வழங்குகிறீர்கள். பயனர்களுக்கு CSS.

Google Pagespeed கருவியில் உங்கள் இணையதளத்தைச் சோதித்திருந்தால், உங்கள் தளத்தில் பயன்படுத்தப்படாத CSS சிக்கல்கள் இருப்பதை நீங்கள் ஏற்கனவே அறிந்திருக்கலாம். இந்த வழிகாட்டியில், முதலில் பயன்படுத்தப்படாத CSS ஐ எவ்வாறு சரிபார்க்கலாம் என்பதைக் காண்பிப்போம், பின்னர் உங்கள் வேர்ட்பிரஸ் தளத்தில் இருந்து பயன்படுத்தப்படாத CSS ஐ அகற்ற இலவச கருவியைப் பயன்படுத்தவும்.

பயன்படுத்தப்படாத CSS ஐ எவ்வாறு சரிபார்க்கலாம்

Google Chrome DevTools (சூழ்நிலை மெனுவில் உள்ள "Inspect" விருப்பத்தை கிளிக் செய்யும் போது நீங்கள் பார்க்கும் கருவி) ஆதாரங்கள் தாவலில் ஒரு கவரேஜ் அம்சத்தைக் கொண்டுள்ளது. உங்கள் இணையதளம் ஏற்றப்படும் பயன்படுத்தப்படாத CSS மற்றும் JSஐக் கண்டறிய கவரேஜ் விருப்பத்தைப் பயன்படுத்தலாம்.

1. டெஸ்க்டாப்பில் Chrome இல் உங்கள் வலைத்தளத்தைத் திறக்கவும்.
2. உங்கள் தளத்தில் உள்ள காலியான வெள்ளை இடத்தில் வலது கிளிக் செய்து, தேர்ந்தெடுக்கவும் ஆய்வு செய் சூழல் மெனுவிலிருந்து.
3. கிளிக் செய்யவும் ஆதாரங்கள் தாவல், அழுத்தவும் Ctrl + Shift + P கட்டளை சாளரத்தைத் திறக்க, பின்னர் தட்டச்சு செய்யவும் கவரேஜ் மற்றும் தேர்ந்தெடுக்கவும் கருவி கவரேஜைத் தொடங்கி பக்கத்தை மீண்டும் ஏற்றவும் கிடைக்கக்கூடிய கட்டளைகளிலிருந்து.
4. கவரேஜ் தாவலின் கீழ், கிளிக் செய்யவும் URL வடிப்பான் அக CSS/JS கோப்புகளை மட்டும் காட்ட, உங்கள் தளத்தின் ரூட் டொமைனை இங்கே உள்ளிடவும்.

   

   └ சரிபார்க்கவும் பயன்படுத்தப்படாத பைட்டுகள் உங்கள் தீமில் இருந்து CSS/JS கோப்பில் தரவின் சதவீதத்தை ஏற்றி பார்க்க நெடுவரிசை.

5. உங்கள் தளத்தில் ஏற்றப்பட்ட பயன்படுத்தப்படாத CSS (சிவப்பு பட்டைகளால் குறிக்கப்பட்டது) பார்க்க CSS கோப்பில் கிளிக் செய்யவும். தற்போதைய பக்கத்தில் பயன்படுத்தப்படும் CSS பச்சைப் பட்டைகளுடன் காட்டப்படும்.

   

உங்கள் இணையதளத்தில் ஏற்றப்பட்ட பயன்படுத்தப்படாத அனைத்து CSSகளையும் நீங்கள் பகுப்பாய்வு செய்தவுடன், அதை அகற்றுவதற்கான நேரம் இது. வலைப்பக்கங்களில் இருந்து பயன்படுத்தப்படாத CSS ஐ அகற்ற பல இலவச கருவிகள் உள்ளன. எனது சொந்த திட்டங்களில் நான் சோதித்து பயன்படுத்திய பிரபலமான கருவிகளில் ஒன்று கீழே உள்ளது.

பயன்படுத்தப்படாத CSS ஐ அகற்ற PurifyCSS ஆன்லைனில் பயன்படுத்தவும்

பொதுவாக, WordPress இல் கிட்டத்தட்ட எல்லாவற்றுக்கும் ஒரு செருகுநிரலை நீங்கள் காணலாம். ஆனால் பயன்படுத்தப்படாத CSS ஐ அகற்ற, துரதிர்ஷ்டவசமாக, ஒரு செருகுநிரல் கூட கிடைக்கவில்லை. எனவே உங்கள் தளத்தில் இருந்து பயன்படுத்தப்படாத CSS ஐ அகற்ற, வேர்ட்பிரஸ் அல்லாத குறிப்பிட்ட கருவிகளைப் பயன்படுத்துவோம்.

PurifyCSS மிகவும் அதிகமாக உள்ளது நட்பு அல்லாத டெவலப்பர் கருவி பயன்படுத்தப்படாத CSS ஐ சமாளிக்க நீங்கள் காணலாம். இணையத்தள URL அல்லது HTML மற்றும் CSS குறியீட்டை வழங்க பயனர்களை அனுமதிக்கும் எளிய UI கருவியில் உள்ளது. WordPress ஐப் பொறுத்தவரை, நாங்கள் URL விருப்பத்தைப் பயன்படுத்துவோம், மேலும் உங்கள் தளத்தில் உள்ள அனைத்து வகையான பக்கங்களுக்கும் இணைப்புகளை வழங்குவோம், இதன் மூலம் கருவியானது CSSஐ அனைத்திலிருந்தும் கைப்பற்றி, பயன்படுத்தப்படாத CSSக்கு மேம்படுத்தலாம்.

நீங்கள் கருவியில் சேர்க்க வேண்டிய பக்கங்களின் விரைவான பட்டியல் இங்கே:

• முகப்புப் பக்க URL
• உங்கள் தளத்தில் உள்ள ஒவ்வொரு வகையிலிருந்தும் பல இடுகைப் பக்க URLகள்

  └ இது அனைத்து இடுகை கூறுகளுக்கும் CSS சேர்க்கப்பட்டுள்ளதை உறுதிசெய்வதாகும்.

• தொடர்பு, அறிமுகம், தனியுரிமை மற்றும் உங்கள் தளத்தில் நீங்கள் வைத்திருக்கும் பல்வேறு பக்கங்கள்.
• காப்பகப் பக்கம், தேடல் பக்கம், ஆசிரியர் பக்கங்கள்
• தனிப்பயன் இடுகை வகை பக்கங்கள்

சூடான உதவிக்குறிப்பு: நீங்கள் பொதுவாகப் பயன்படுத்தும் அட்டவணை, படத்தொகுப்பு, குறியீடு, முன், வரிசைப்படுத்தப்பட்ட பட்டியல்கள், வரிசைப்படுத்தப்படாத பட்டியல்கள், படிவங்கள், தாவல்கள், துருத்திகள், குட்டன்பெர்க் பிளாக்ஸ் போன்ற அனைத்து தீம் கூறுகளுடன் நீங்கள் பயன்படுத்தும் அல்லது எதிர்காலத்தில் பயன்படுத்தக்கூடிய 'அம்சங்கள்' இடுகை/பக்கத்தை உருவாக்கவும் , முதலியன

PurifyCSS ஆன்லைன் கருவியில் இந்த 'அம்சங்கள்' இடுகை URL ஐப் பயன்படுத்தி, பொதுவாகப் பயன்படுத்தப்படும் உறுப்புகளுக்கான CSS சேர்க்கப்பட்டுள்ளது.

ஹிட் CSS ஐ சுத்தம் செய்யவும் உங்கள் தளத்தில் இருந்து PurifyCSS ஆன்லைன் கருவியில் தொடர்புடைய அனைத்து URL வகைகளையும் சேர்த்தவுடன் பொத்தான்.

கருவி மூலம் உருவாக்கப்பட்ட புதிய CSS ஐ நகலெடுத்து உங்கள் தளத்தில் பயன்படுத்தவும். உறுதி செய்து கொள்ளுங்கள் அசல் style.css ஐ காப்புப் பிரதி எடுக்கவும் PurifyCSS ஆல் உருவாக்கப்பட்ட புதிய CSS ஐ மாற்றுவதற்கு முன் உங்கள் தீமில் உள்ள பிற CSS கோப்புகள்.

உதவிக்குறிப்பு: உங்கள் தீமின் CSS கோப்புகளைத் திருத்த உள்ளமைக்கப்பட்ட வேர்ட்பிரஸ் தீம் எடிட்டரைப் பயன்படுத்தலாம் அல்லது சேவையகத்துடன் இணைக்க FTP/SFTP நிரலைப் பயன்படுத்தலாம் மற்றும் நோட்பேட் எடிட்டரைப் பயன்படுத்தி கோப்புகளை வசதியாகத் திருத்தலாம்.