Custom Shortcodes மூலம் ஒரு Divi Blog-ஐ மறுசீரமைத்தல்
நான் சமீபத்தில் WordPress, Divi மற்றும் Cloudways ஆகியவற்றைப் பயன்படுத்தி, Rev6 என்ற fitness platform-க்கான blog-ஐ மறுவடிவமைப்பு செய்தேன்.
நான் வழக்கமான Divi Blog module-ஐப் பயன்படுத்தவில்லை. தனிப்பயன் URL routing மற்றும் membership அம்சங்களுக்குத் தேவையான கட்டுப்பாடுகள் அதில் இல்லை. அதற்குப் பதிலாக, child theme-இல் custom shortcodes-களின் ஒரு அமைப்பை உருவாக்கினேன்.
இந்த அணுகுமுறை, logic-ஐ ஒரு page builder database-க்குள் மறைப்பதற்குப் பதிலாக, versioned PHP-இல் வைத்திருக்கிறது.
இந்த setup பின்வரும் shortcodes-களைப் பயன்படுத்துகிறது:
- [rev6_blog_sidebar] - navigation மற்றும் search-க்கு
- [rev6_sort_dropdown] - sorting-க்கு
- [rev6_post_grid] - layout-க்கு
- [rev6_author_bar] - byline-க்கு
- [rev6_author_bio] - author section-க்கு
- [rev6_related_posts] - மேலும் வாசிப்பதற்கு
இந்த build-லிருந்து நான் கற்றுக்கொண்ட தொழில்நுட்பக் கருத்துக்கள் இதோ:
சோம்பேறித்தனமான CSS grid hacks-களைத் தவிர்க்கவும் ஒரு sidebar முழுப் பக்கத்தையும் ஆக்கிரமிக்க நான் ஒருமுறை "grid-row: 1 / span 999" என்பதைப் பயன்படுத்தினேன். இது ஆயிரக்கணக்கான காலியான rows மற்றும் அதிகப்படியான whitespace-ஐ உருவாக்கியது. அதற்குப் பதிலாக named grid areas-களைப் பயன்படுத்தவும். இது மிகவும் சுத்தமாகவும் பாதுகாப்பாகவும் இருக்கும்.
உங்கள் code-ஐத் தேடுவதற்கு முன் உங்கள் data-வைச் சரிபார்க்கவும் தெரியாத ஒரு "related posts" பகுதியைத் திருத்த (debugging) நான் அதிக நேரத்தைச் செலவிட்டேன். Code சரியாக இருந்தது. பிரச்சனை data-வில் இருந்தது. அந்த category-யில் ஒரே ஒரு post மட்டுமே இருந்தது. எனது code தற்போதைய post-ஐத் தவிர்த்ததால், முடிவுகள் ஏதுமில்லாமல் போனது. உங்கள் functions-களில் bugs-களைத் தேடுவதற்கு முன், எப்போதும் உங்கள் database உள்ளடக்கத்தைச் சரிபார்க்கவும்.
files மற்றும் database இடையிலான வேறுபாட்டைப் புரிந்துகொள்ளுங்கள் நான் staging-லிருந்து live-க்கு migrate செய்தபோது, layout தவறாகத் தெரிந்தது. அதை CSS மூலம் சரிசெய்ய முயன்றேன், ஆனால் அது தோல்வியடைந்தது. பிரச்சனை என்னவென்றால், imports என்பது templates-களை மட்டுமே மாற்றும், database content-ஐ அல்ல. Module widths மற்றும் post assignments போன்ற விஷயங்கள் database-இல் தான் இருக்கும். ஒரு migration-க்குப் பிறகு layout மாறினால், stylesheet-ஐப் பார்க்காமல் database-ஐப் பார்க்கவும்.
முழுமையான database-ஐ ஒருபோதும் production-க்கு அனுப்பாதீர்கள் முழுமையான sync என்பது orders மற்றும் registrations போன்ற உண்மையான user data-வை overwrite செய்துவிடும். அனைத்தையும் அப்படியே அனுப்புவதற்குப் பதிலாக, targeted transfers முறையைப் பயன்படுத்தவும்.
Cache என்பது முதல் படி Optimized sites-களில், CSS optimization tools பெரும்பாலும் பயன்பாட்டில் இல்லை என்று நினைக்கும் styles-களை நீக்கிவிடும். உங்கள் styles சரியாகத் தெரியவில்லை என்றால், முதலில் உங்கள் cache-ஐ clear செய்துவிட்டு, மீண்டும் CSS-ஐ regenerate செய்யவும்.
இந்த redesign இப்போது live-இல் உள்ளது. இது ஒரு சுத்தமான editorial layout மற்றும் தனிப்பயன் author system-ஐக் கொண்டுள்ளது. Code எழுதுவது எளிதான பகுதி. Environment தான் உண்மையான பாடங்களைக் கற்றுக்கொடுத்தது.
Source: https://dev.to/highcenburg/rebuilding-a-divi-blog-with-custom-shortcodes-a-field-report-141g