কাস্টম শর্টকোড ব্যবহার করে একটি Divi ব্লগ নতুন করে তৈরি করা
আমি সম্প্রতি WordPress, Divi এবং Cloudways ব্যবহার করে একটি ফিটনেস প্ল্যাটফর্ম Rev6-এর ব্লগটি নতুনভাবে ডিজাইন করেছি।
আমি স্ট্যান্ডার্ড Divi Blog মডিউলটি ব্যবহার করিনি। কাস্টম URL রাউটিং এবং মেম্বারশিপ ফিচারের জন্য প্রয়োজনীয় কন্ট্রোল এতে নেই। পরিবর্তে, আমি চাইল্ড থিমে (child theme) কাস্টম শর্টকোডের একটি সিস্টেম তৈরি করেছি।
এই পদ্ধতিটি লজিকগুলোকে কোনো পেজ বিল্ডারের ডাটাবেসের ভেতরে লুকিয়ে না রেখে ভার্সনড PHP-তে রাখে।
সেটআপটিতে এই শর্টকোডগুলো ব্যবহার করা হয়েছে:
- [rev6_blog_sidebar] নেভিগেশন এবং সার্চের জন্য
- [rev6_sort_dropdown] সর্টিংয়ের জন্য
- [rev6_post_grid] লেআউটের জন্য
- [rev6_author_bar] বাইলাইনের জন্য
- [rev6_author_bio] লেখকের সেকশনের জন্য
- [rev6_related_posts] আরও পড়ার জন্য
এই কাজের মাধ্যমে আমার প্রাপ্ত কিছু টেকনিক্যাল শিক্ষা নিচে দেওয়া হলো:
অলস CSS grid হ্যাক এড়িয়ে চলুন আমি একবার একটি সাইডবারকে পুরো পেজ জুড়ে দেখানোর জন্য "grid-row: 1 / span 999" ব্যবহার করেছিলাম। এটি হাজার হাজার খালি রো (row) এবং বিশাল হোয়াইটস্পেস তৈরি করেছিল। এর পরিবর্তে 'named grid areas' ব্যবহার করুন। এটি আরও পরিচ্ছন্ন এবং নিরাপদ।
কোড চেক করার আগে ডাটা চেক করুন আমি একটি "related posts" সেকশন ডিবাগ করতে অনেক সময় ব্যয় করেছি যা দেখা যাচ্ছিল না। কোড ছিল একদম নিখুঁত। সমস্যাটি ছিল ডাটাতে। ওই ক্যাটাগরিতে মাত্র একটি পোস্ট ছিল। আমার কোডটি বর্তমান পোস্টটিকে বাদ দিয়ে দিয়েছিল, ফলে কোনো ফলাফলই অবশিষ্ট ছিল না। ফাংশনে বাগ খোঁজার আগে সবসময় আপনার ডাটাবেস কন্টেন্ট যাচাই করে নিন।
ফাইল এবং ডাটাবেসের মধ্যকার পার্থক্য বুঝুন আমি যখন স্টেজিং (staging) থেকে লাইভ (live) সাইটে মাইগ্রেট করলাম, তখন লেআউটটি ভুল দেখাচ্ছিল। আমি CSS দিয়ে এটি ঠিক করার চেষ্টা করেছিলাম, কিন্তু তা ব্যর্থ হয়। সমস্যাটি ছিল যে, ইমপোর্ট করার সময় টেমপ্লেটগুলো মুভ হয়, ডাটাবেস কন্টেন্ট নয়। মডিউল উইডথ (width) এবং পোস্ট অ্যাসাইনমেন্টের মতো বিষয়গুলো ডাটাবেসে থাকে। মাইগ্রেশনের পরে যদি লেআউট ভিন্ন দেখায়, তবে স্টাইলশিট নয়, বরং ডাটাবেস দেখুন।
প্রোডাকশনে কখনোই ফুল ডাটাবেস পুশ করবেন না একটি ফুল সিঙ্ক (full sync) করলে অর্ডার এবং রেজিস্ট্রেশনের মতো আসল ইউজার ডাটা ওভাররাইট হয়ে যেতে পারে। সব কিছু একসাথে পুশ না করে নির্দিষ্ট ডাটা ট্রান্সফার করুন।
ক্যাশ (Cache) হলো প্রথম ধাপ অপ্টিমাইজড সাইটগুলোতে CSS অপ্টিমাইজেশন টুলগুলো প্রায়ই এমন সব স্টাইল বাদ দিয়ে দেয় যেগুলোকে তারা অব্যবহৃত মনে করে। যদি আপনার স্টাইলগুলো অর্ধেক বা অসম্পূর্ণ মনে হয়, তবে প্রথমে আপনার ক্যাশ ক্লিয়ার করুন এবং CSS পুনরায় জেনারেট করুন।
নতুন ডিজাইনটি এখন লাইভ। এতে একটি পরিচ্ছন্ন এডিটোরিয়াল লেআউট এবং একটি কাস্টম অথর সিস্টেম রয়েছে। কোড লেখাটা ছিল সহজ অংশ। আসল শিক্ষাগুলো আমি পেয়েছি কাজের পরিবেশ থেকে।
উৎস: https://dev.to/highcenburg/rebuilding-a-divi-blog-with-custom-shortcodes-a-field-report-141g