কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.

ডায়নামিক পোস্ট ফিচার ইমেজ সহ কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেট কাস্টমাইজ করবেন

যদি আমরা ব্রাউজ করি ওয়ার্ডপ্রেস থিম ডিরেক্টরি, বেশিরভাগ থিম কভার ইমেজ শোকেস করে। এটি জনপ্রিয় চাহিদা একটি বৈশিষ্ট্য. কভার পেজ প্রবণতা এমনকি সত্য ব্লক থিম ডিরেক্টরি পাশাপাশি স্ক্রিনশট।

এর থেকে নিম্নলিখিত উদাহরণ বিবেচনা করা যাক কুড়ি বিশ (একটি ক্লাসিক থিম) যার মধ্যে রয়েছে a কভার টেমপ্লেট যেটি একক পোস্ট এবং পৃষ্ঠা উভয় ক্ষেত্রেই প্রদর্শন করতে ব্যবহার করা যেতে পারে, যেখানে পোস্টের বৈশিষ্ট্যযুক্ত চিত্র শীর্ষে প্রদর্শিত হয় যা ব্রাউজার স্ক্রীন জুড়ে প্রসারিত হয়, পোস্টের শিরোনাম এবং নীচে অন্যান্য পছন্দসই মেটা ডেটা সহ। কভার টেমপ্লেটগুলি এমন সামগ্রী তৈরি করতে দেয় যা সামগ্রী প্রদর্শনের ঐতিহ্যগত সীমাবদ্ধতা থেকে আলাদা।

স্ক্রিনশট টুয়েন্টি টুয়েন্টি কভার টেমপ্লেট সহ একটি একক পোস্ট দেখাচ্ছে৷.

কভার টেমপ্লেট তৈরি করার জন্য বর্তমানে এখানে ক্যাপচার করা PHP কোড লেখার প্রয়োজন টোয়েন্টি টুয়েন্টি ডিফল্ট থিমের কভার টেমপ্লেট. আমরা তাকান যদি template-parts/content-cover.php ফাইল, এটি রয়েছে কোড বিষয়বস্তু প্রদর্শনের জন্য যখন cover-template ব্যবহৃত হয়.

সুতরাং, আপনার পিএইচপি সম্পর্কে গভীর জ্ঞান না থাকলে একটি কাস্টমাইজড কভার পেজ তৈরি করা সম্ভব নয়। অনেক সাধারণ ওয়ার্ডপ্রেস ব্যবহারকারীদের জন্য, একমাত্র বিকল্প হল প্লাগইন ব্যবহার করা Custom Post Type UI হিসাবে বর্ণিত এই সংক্ষিপ্ত ভিডিও.

ব্লক থিম বিভাগ কভার

থেকে ওয়ার্ডপ্রেস 5.8, থিম লেখকরা একটি শীর্ষ নায়ক বিভাগ ব্যবহার করে কাস্টম টেমপ্লেট (যেমন একক পোস্ট, লেখক, বিভাগ এবং অন্যান্য) তৈরি করতে পারে ব্লক সম্পাদক কভার ব্লক এবং ন্যূনতম বা কোন কোড সহ তাদের থিমগুলিতে বান্ডিল।

ব্লক থিম টেমপ্লেটগুলিতে শীর্ষ বড় কভার বিভাগগুলি কীভাবে তৈরি করা হয় তা দেখার আগে, আসুন সংক্ষেপে দুটি ব্লক থিম দেখি বিশ বাইশ এবং ওয়াবি রিচ ট্যাবর দ্বারা (সম্পূর্ণ পর্যালোচনা এখানে).

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
স্ক্রিনশট টোয়েন্টি টোয়েন্টি-টু (বাম) এবং ওয়াবি (ডান) থিমের কভার পৃষ্ঠার থাম্বনেল দেখাচ্ছে৷

পর্দার আড়ালে, টোয়েন্টি টুয়েন্টি-টু একটি বড় হেডার প্রয়োগ করে প্যাটার্ন হিসাবে সংরক্ষিত একটি লুকানো ছবি যোগ করা মধ্যে header-dark-large অংশ যেখানে, ওয়াবি থিমে, একটি একক পোস্টে বড় হেডারের পটভূমির রঙ প্রয়োগ করা হয় অ্যাকসেন্ট পটভূমির রং এবং একটি 50px উচ্চতার স্পেসার ব্লক (লাইন: 5-9)। অ্যাকসেন্ট রং দ্বারা পরিচালিত হয় assets/js/accent-colors.js ফাইল.

অন্য অনেকে ব্যবহার করে একটি শীর্ষ কভার বিভাগ তৈরি করতে বেছে নিয়েছে কভার ব্লক, যা ব্যবহারকারীদের পটভূমির রঙ পরিবর্তন করতে এবং মিডিয়া লাইব্রেরি থেকে একটি স্ট্যাটিক ইমেজ যোগ করতে বা মিডিয়া ডিভাইস থেকে আপলোড করার অনুমতি দেয় – কোনো কোড না লিখে। এই পদ্ধতির সঙ্গে, থেকে ইমেজ পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ ব্লক আপনি যদি একক পোস্টে ব্যাকগ্রাউন্ড ইমেজ হিসাবে পোস্টটি বৈশিষ্ট্যযুক্ত চিত্র পেতে চান তবে প্রতিটি একক পোস্টে ম্যানুয়ালি যোগ করতে হবে।

গতিশীল পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ সঙ্গে কভার ব্লক

ওয়ার্ডপ্রেস 6.0 আরেকটি দুর্দান্ত উপলব্ধ করেছে বৈশিষ্ট্যযুক্ত ছবি কভার ব্লক বৈশিষ্ট্য, যা কভার ব্লকে ব্যাকগ্রাউন্ড ইমেজ হিসাবে যেকোনো পোস্ট বা পৃষ্ঠার বৈশিষ্ট্যযুক্ত চিত্র ব্যবহারের অনুমতি দেয়।

নিম্নলিখিত সংক্ষিপ্ত ভিডিও, স্বয়ংক্রিয় প্রকৌশলীরা একটি উদাহরণ সহ ব্লক কভারে বৈশিষ্ট্যযুক্ত ছবি যুক্ত করার বিষয়ে আলোচনা করেন আর্কিও থিম:

[এম্বেড করা সামগ্রী]

পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ ব্লক সহ ইমেজ ব্লক ব্যবহার করে আরও কাস্টমাইজ করা যেতে পারে duotone রঙিন theme.json এই সংক্ষিপ্ত আলোচনা হিসাবে বিন্দুগুলো মিলাও ইউটিউব ভিডিও (অটোমেটিক এর অ্যান ম্যাকার্থি)।

কেস উদাহরণ ব্যবহার করুন (ওয়েই, উজ্জ্বল মোড)

আমরা যদি থাম্বনেইল ইমেজ ব্রাউজ করি ব্লক থিম ডিরেক্টরি, আমরা তাদের অধিকাংশই বড় কভার হেডার বিভাগ অন্তর্ভুক্ত দেখতে. যদি আমরা তাদের টেমপ্লেট ফাইলগুলি খনন করি, তারা স্ট্যাটিক ইমেজ ব্যাকগ্রাউন্ড সহ কভার ব্লক ব্যবহার করে।

কিছু সম্প্রতি উন্নত থিম ডায়নামিক পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ ব্যাকগ্রাউন্ডের সাথে কভার ব্লক ব্যবহার করছে (যেমন, আর্কিও, ওয়েই, ফ্রস্ট, ব্রাইট মোড, ইত্যাদি)। নতুন বৈশিষ্ট্যের একটি সংক্ষিপ্ত বিবরণ পাওয়া যায় এই ছোট গিটহাব ভিডিও.

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
স্ক্রিনশট ওয়েই (বাম) এবং ব্রাইট-মোড (ডান) থিমের কভার পৃষ্ঠা থাম্বনেল দেখাচ্ছে৷

ডায়নামিক অ্যাকসেন্ট রং বৈশিষ্ট্য সমন্বয় ওয়াবি কভার এবং পোস্ট ফিচারড ইমেজ ব্লক সহ থিম, রিচ ট্যাবর তার নতুন সৃজনশীলতাকে আরও প্রসারিত করে উই থিম (সম্পূর্ণ পর্যালোচনা উপলব্ধ এখানে) একটি একক পোস্ট থেকে গতিশীল কভার ছবি প্রদর্শন করতে।

তার ওয়েই ঘোষণা পোস্টে, ধনী তাবর লিখেছেন: "পর্দার আড়ালে, single.html টেমপ্লেটটি একটি কভার ব্লক ব্যবহার করছে যা পোস্টের বৈশিষ্ট্যযুক্ত চিত্রটি ব্যবহার করে। তারপর ডুওটোনটি পোস্টে নির্ধারিত রঙের স্কিম দ্বারা প্রয়োগ করা হয়। এইভাবে, প্রায় যে কোনও চিত্র সুন্দর দেখাবে”।

আপনি যদি ওয়েই থিমের হেডার কভার ব্লকের গভীরে খনন করতে চান এবং কীভাবে নিজের তৈরি করবেন তা শিখতে চান, এখানে একটি সংক্ষিপ্ত ভিডিও থেকে ফ্রাঙ্ক ক্লেইন (WP ডেভেলপমেন্ট কোর্স) যারা ধাপে ধাপে ব্যাখ্যা করে কিভাবে এটি তৈরি করা হয়েছে।

ওয়েই থিমের অনুরূপ, ব্রায়ান গার্ডনার এছাড়াও তার সাম্প্রতিক পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ ব্লক সঙ্গে কভার ব্লক ব্যবহার করে ব্রাইট মোড স্ট্যান্ডআউট বিষয়বস্তু প্রদর্শন করার জন্য থিম স্পন্দনশীল রং.

ব্রায়ান WPTavern কে বলেছেন: “তিনি থিম সম্পর্কে সবচেয়ে পছন্দ করেন যেভাবে কভার ব্লক ব্যবহার করা হয়৷ একক পৃষ্ঠা. এটি বৈশিষ্ট্যযুক্ত চিত্রটিকে কভার ব্লকে টেনে আনে এবং ছায়া এবং পূর্ণ-উচ্চতার বিকল্পগুলির জন্য কাস্টম ব্লক শৈলীও অফার করে। [...] আমি মনে করি যে এটি সত্যিই উপস্থাপন করে যা আধুনিক ওয়ার্ডপ্রেসের সাথে সম্ভব।"

আরো বিস্তারিত জানার জন্য, এখানে তার ডেমো সাইট এবং ব্রায়ানের ব্রাইট মোড থিমের সম্পূর্ণ পর্যালোচনা.

ব্লক এডিটর দিয়ে জটিল লেআউট ডিজাইন করা

সম্প্রতি, ওয়ার্ডপ্রেস ডিজাইন করা একটি নতুন ব্লক এডিটর চালু করেছে অবতরণ হোমপেজ এবং একটি ডাউনলোড পাতা. ঘোষণাটি মিশ্র প্রতিক্রিয়া আকৃষ্ট এর পাঠকদের কাছ থেকে, সহ ম্যাট মুলেনওয়েগ (স্বয়ংক্রিয়) যারা এই ধরনের একটি "সাধারণ পৃষ্ঠা" ডিজাইন এবং চালু করতে 33-দিন ধরে মন্তব্য করেছেন। তুমি খুজেঁ পাবে এখানে পর্দার পিছনে অতিরিক্ত আলোচনা.

জবাবে তৈরি করেন পুটলপ্রেসের জেমি মার্সল্যান্ড এই YouTube ভিডিও যেখানে তিনি প্রায় 20 মিনিটের মধ্যে একটি প্রায় অভিন্ন হোমপেজ পুনরুত্পাদন করেন।

মার্সল্যান্ড ভিডিওতে মন্তব্য করছেন, WP Travern-এর সারাহ গুডিং লিখেছেন: “ব্লক এডিটরের সাথে একজন পাওয়ার ব্যবহারকারী হিসেবে বর্ণনা করতে পারে তাকেই। তিনি দ্রুত সারি, কলাম এবং গোষ্ঠীগুলিকে আশেপাশে পরিবর্তন করতে পারেন, প্রয়োজন অনুসারে প্যাডিং এবং মার্জিন সামঞ্জস্য করতে পারেন এবং প্রতিটি বিভাগকে নকশার জন্য সংশ্লিষ্ট রঙ নির্ধারণ করতে পারেন। এই মুহুর্তে, এটি এমন কিছু নয় যা বেশিরভাগ গড় ওয়ার্ডপ্রেস ব্যবহারকারীরা করতে পারে।"

যদিও ব্লক এডিটর অনেক দূর এগিয়েছে, তবুও এটির সাথে জটিল লেআউট তৈরি এবং ডিজাইন করার জন্য বেশিরভাগ থিম ডেভেলপার এবং সাধারণ ব্যবহারকারীদের কাছে ক্রমবর্ধমান ব্যথার পয়েন্ট রয়েছে।

TT2 গোফার ব্লকে বর্ধন যোগ করা হচ্ছে

এই বিভাগে, আমি কীভাবে বর্ধিতকরণগুলি যোগ করেছি সে সম্পর্কে আমি আপনাকে হেঁটে দেব TT2 গোফার ব্লক থিম যেটা আমি আমার আগের প্রবন্ধে উল্লেখ করেছি। আমি আগে বর্ণিত থিম থেকে কভার ব্লক দ্বারা অনুপ্রাণিত হয়ে, আমি থিমে তিনটি কভার টেমপ্লেট (লেখক, বিভাগ এবং একক-কভার) যোগ করতে চেয়েছিলাম।

ওয়েবসাইট ব্রাউজ করার সময়, আমরা দুই ধরনের কভার হেডার লক্ষ্য করি। সর্বাধিক পর্যবেক্ষণ করা শিরোনাম হল কভার ব্লকে সাইটের শিরোনাম (সাইট শিরোনাম এবং শীর্ষ নেভিগেশন) এর সাথে মিশ্রিত কভার বিভাগ (যেমন, টোয়েন্টি টোয়েন্টি, টোয়েন্টি টোয়েন্টি-টু, ওয়েই, ওয়াবি, ফ্রস্ট, ব্রাইট মোড, ইত্যাদি)। আমরা হেডার কভার বিভাগও খুঁজে পাই যা সাইটের শিরোলেখের সাথে মিশ্রিত নয় এবং ঠিক নীচে অবস্থান করা হয়েছে, যেমন এটি বিবিসি ফিউচার ওয়েবসাইট TT2 গোফার ব্লক থিমের জন্য, আমি পরবর্তীটি বেছে নিয়েছি।

কভার হেডার প্যাটার্ন তৈরি করা হচ্ছে

প্রথমে, কভার ব্লক ব্যবহার করে লেখক, একক এবং অন্যান্য (বিভাগ, ট্যাগ) টেমপ্লেটের জন্য কভার হেডার প্যাটার্ন তৈরি করা যাক। তারপরে আমরা তাদের প্যাটার্নে রূপান্তর করব (যেমন বর্ণনা করা হয়েছে এখানে আগে) এবং টেমপ্লেটগুলিতে সংশ্লিষ্ট হেডার কভার প্যাটার্নগুলিকে কল করুন।

আপনি যদি ব্লক এডিটরের সাথে কাজ করতে পরিচিত হন, তাহলে সাইট এডিটরে কভার ব্লক ব্যবহার করে আপনার হেডার সেকশন ডিজাইন করুন এবং তারপর কভার হেডার কোডটিকে প্যাটার্নে রূপান্তর করুন। যাইহোক, আপনি যদি FSE সম্পাদকের সাথে পরিচিত না হন, তাহলে সবচেয়ে সহজ উপায় হল থেকে প্যাটার্ন কপি করা নিদর্শন ডিরেক্টরি একটি পোস্টে, প্রয়োজনীয় পরিবর্তন করুন এবং একটি প্যাটার্নে রূপান্তর করুন।

আমার মধ্যে আগের CSS-ট্রিকস নিবন্ধ, আমি ব্লক প্যাটার্ন তৈরি এবং ব্যবহার সম্পর্কে বিস্তারিত আলোচনা করেছি। এখানে কর্মপ্রবাহের একটি সংক্ষিপ্ত বিবরণ দেওয়া হল যা আমি একক পোস্ট কভার হেডার প্যাটার্ন তৈরি করতে ব্যবহার করছি:

একক পোস্ট কভার হেডার প্যাটার্ন

ধাপ 1: FSE ইন্টারফেস ব্যবহার করে, আসুন একটি নতুন ফাঁকা ফাইল তৈরি করি এবং বাম প্যানেলে দেখানো ব্লক কাঠামো তৈরি করা শুরু করি।

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
সম্পূর্ণ সাইট সম্পাদক সহ ওয়ার্ডপ্রেস UI এর স্ক্রিনশট। পোস্টের তারিখ, বিভাগ এবং পোস্টের শিরোনাম সহ একটি ব্লক একত্রিত করা হচ্ছে।

বিকল্পভাবে, এটি প্রথমে একটি পোস্ট বা পৃষ্ঠায় করা যেতে পারে, এবং তারপরে একটি প্যাটার্ন ফাইলে মার্কআপটি অনুলিপি করে পেস্ট করুন, পরে।

ধাপ 2: এরপর, উপরের মার্কআপটিকে একটি প্যাটার্নে ঢেকে রাখতে, প্রথমে আমাদের এটির কোড মার্কআপ কপি করে একটি নতুন মার্কআপে পেস্ট করতে হবে /patterns/header-single-cover.php আমাদের কোড এডিটরে। আমাদের প্রয়োজনীয় প্যাটার্ন ফাইল হেডার মার্কআপও যোগ করা উচিত (যেমন, শিরোনাম, স্লাগ, বিভাগ, সন্নিবেশকারী, ইত্যাদি)।

এখানে সম্পূর্ণ কোড আছে /patterns/header-single-cover.php ফাইল:


    
    
How To Customize WordPress Block Theme Cover Templates with Dynamic Post Feature Images PlatoBlockchain Data Intelligence. Vertical Search. Ai.

ধাপ 3: এই ডেমো জন্য, আমি ব্যবহার করেছি ফটো ডিরেক্টরি থেকে এই ইমেজ একটি ফিলার ব্যাকগ্রাউন্ড ইমেজ হিসাবে, এবং প্রয়োগ মধ্যরাত্রি duotone রঙ। পোস্ট বৈশিষ্ট্যযুক্ত চিত্র গতিশীলভাবে ব্যবহার করতে, আমাদের যোগ করা উচিত "useFeaturedImage":true কভার ব্লকের ঠিক আগে উপরের ফিলার ইমেজ লিঙ্কটি প্রতিস্থাপন করে "dimRatio":50 যেমন লাইন 10 নিম্নলিখিত মত হওয়া উচিত:

বিকল্পভাবে, ফিলার চিত্রটি ক্লিক করেও পরিবর্তন করা যেতে পারে প্রতিস্থাপন করা এবং নির্বাচন বৈশিষ্ট্যযুক্ত ছবি ব্যবহার করুন বিকল্প:

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
ওয়ার্ডপ্রেস UI-এর স্ক্রিনশট 'প্রতিস্থাপন' এবং 'ব্যবহার বৈশিষ্ট্যযুক্ত ছবি' নির্বাচন করা হয়েছে।

এখন, টেমপ্লেট, পোস্ট এবং পৃষ্ঠাগুলির যে কোনও জায়গায় ব্যবহারের জন্য হেডার কভার প্যাটার্নগুলি প্যাটার্ন ইনসার্টার প্যানেলে দৃশ্যমান হওয়া উচিত।

সংরক্ষণাগার কভার শিরোনাম

দ্বারা অনুপ্রাণিত এই WP Tavern পোস্ট এবং একটি লেখক টেমপ্লেট হেডার তৈরি করার জন্য ধাপে ধাপে ওয়াকথ্রু, আমি একটি অনুরূপ কভার হেডার তৈরি করতে এবং TT2 গোফার থিমেও যোগ করতে চেয়েছিলাম।

প্রথমে, এর জন্য আর্কাইভ কভার হেডার প্যাটার্ন তৈরি করা যাক author.html টেমপ্লেটটিও, উপরের ওয়ার্কফ্লো অনুসরণ করে। এই ক্ষেত্রে, আমি ব্লক যোগ করে এটি একটি নতুন ফাঁকা পৃষ্ঠায় তৈরি করছি (লিস্ট ভিউতে নীচে দেখানো হয়েছে):

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
একটি একক পোস্ট হেডার কভার ব্যবহার করে লেখক পৃষ্ঠার জন্য WordPress UI এর স্ক্রিনশট।

কভারের পটভূমিতে, আমি একক পোস্ট হেডার কভারে ব্যবহৃত একই চিত্র ব্যবহার করেছি।

যেহেতু আমরা লেখক ব্লকে একটি সংক্ষিপ্ত লেখকের জীবনী প্রদর্শন করতে চাই, তাই ব্যবহারকারীর প্রোফাইল পৃষ্ঠায় একটি জীবনী বিবৃতিও যোগ করা উচিত, অন্যথায় সামনের প্রান্তে একটি ফাঁকা স্থান প্রদর্শিত হবে।

নিম্নলিখিত মার্কআপ কোড header-author-cover, যে আমরা প্যাটার্ন ব্যবহার করব, পরবর্তী ধাপে:

    
    
How To Customize WordPress Block Theme Cover Templates with Dynamic Post Feature Images PlatoBlockchain Data Intelligence. Vertical Search. Ai.How To Customize WordPress Block Theme Cover Templates with Dynamic Post Feature Images PlatoBlockchain Data Intelligence. Vertical Search. Ai.
Republished By Plato

Published by:


একটি মধ্যে মার্কআপ গোপন করতে header-author-cover প্যাটার্ন, পূর্বে বর্ণিত হিসাবে আমাদের প্রয়োজনীয় প্যাটার্ন ফাইল হেডার মার্কআপ যোগ করা উচিত। সম্পাদনা করে header-author-cover.php প্যাটার্ন, আমরা ট্যাগ, শ্রেণীবিন্যাস এবং অন্যান্য কাস্টম টেমপ্লেটের জন্য অনুরূপ হেডার কভার তৈরি করতে পারি।

সার্জারির header-category-cover.php আমার জন্য প্যাটার্ন category.html টেমপ্লেট GitHub এ উপলব্ধ.

হেডার কভার ব্লক সহ টেমপ্লেট তৈরি করা

ওয়ার্ডপ্রেস 6.0 এবং সাম্প্রতিক গুটেনবার্গ 13.7 বর্ধিত টেমপ্লেট ব্লক সম্পাদকে বৈশিষ্ট্য তৈরি করে, এইভাবে অনেক ওয়ার্ডপ্রেস ব্যবহারকারীর পক্ষে কোডিং সম্পর্কে গভীর জ্ঞান ছাড়াই তাদের কাস্টমাইজড টেমপ্লেট তৈরি করা সম্ভব হয়।

আরো বিস্তারিত তথ্য এবং ব্যবহারের ক্ষেত্রে, এখানে একটি জাস্টিন Tadlock দ্বারা পুঙ্খানুপুঙ্খ কাস্টমাইজেশন নোট.

ব্লক সম্পাদক কভার টেমপ্লেট সহ বিভিন্ন ধরনের টেমপ্লেট তৈরি করতে দেয়। চলুন সংক্ষিপ্তভাবে ওভারভিউ কিভাবে সমন্বয় কভার ব্লক এবং পোস্ট বৈশিষ্ট্যযুক্ত ইমেজ ব্লক নতুন টেমপ্লেট UI সহ বিভিন্ন ধরনের কভার কাস্টম টেমপ্লেট তৈরি করা সহজ করে দেয় এমনকি কোন বা কম কোডিং দক্ষতা ছাড়াই।

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
ওয়ার্ডপ্রেস UI-এর স্ক্রিনশট TT2 গোফার ব্লক-এর দ্বারা উপলব্ধ টেমপ্লেটগুলি প্রদর্শন করছে - একক, পৃষ্ঠা, সূচক, হোম, 404, ফাঁকা, এবং সংরক্ষণাগার৷

গুটেনবার্গ 13.7 দিয়ে টেমপ্লেট তৈরি করা অনেক সহজ করা হয়েছে। কীভাবে ব্লক টেমপ্লেট তৈরি করবেন কোড সহ এবং সাইট সম্পাদকে বর্ণনা করা হয় থিম হ্যান্ডবুক এবং ইন আমার পূর্ববর্তী নিবন্ধ.

কভার ব্লক সহ লেখক টেমপ্লেট

শীর্ষ (হেডার বিভাগ) এর মার্কআপ author.html টেমপ্লেট নীচে দেখানো হয়েছে (লাইন 6):

    
    
    
    
... ... ... ...

এখানে এর জন্য কভার হেডারগুলির স্ক্রিনশট রয়েছে৷ author.html এবং category.html টেমপ্লেট:

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
লেখকের নাম, অবতার এবং জীবনী সহ লেখক পৃষ্ঠার শিরোনাম (বাম) এর স্ক্রিনশট। এবং ক্যাটাগরি পেজ হেডারের স্ক্রিনশট (ডানদিকে)।

সমগ্র উভয় টেমপ্লেটের জন্য কোড GitHub এ উপলব্ধ.

কভার ব্লক সহ একক পোস্ট

আমাদের একক পোস্টে কভার ব্লক প্রদর্শন করতে, আমাদের কল করতে হবে header-cover-single pattern শিরোনাম বিভাগের নীচে (লাইন 3):

    
    
     
    
    
    
    
    ....
    ....
    ....

এখানে একটি স্ক্রীন ক্যাপচার রয়েছে যা হেডার কভার বিভাগের সাথে একক পোস্টের সামনের প্রান্তের দৃশ্য দেখায়:

কিভাবে ওয়ার্ডপ্রেস ব্লক থিম কভার টেমপ্লেটগুলি ডায়নামিক পোস্ট ফিচার ইমেজ প্লাটোব্লকচেন ডেটা ইন্টেলিজেন্স সহ কাস্টমাইজ করবেন। উল্লম্ব অনুসন্ধান. আ.
TT2 গোফারের স্ক্রিনশট হেডার কভার সেকশন প্যাটার্ন সহ একক পোস্ট ব্লক করে।

সমগ্র single-cover.html টেমপ্লেট GitHub এ উপলব্ধ.

আপনি একটি তৈরির বিষয়ে অতিরিক্ত ধাপে ধাপে ওয়াকথ্রু টিউটোরিয়াল পেতে পারেন নায়ক হেডার পোস্ট বিভাগ এবং পোস্ট বৈশিষ্ট্যযুক্ত ছবি ব্যাকগ্রাউন্ড কভার ব্লক ব্যবহার করে on ডব্লিউপি ট্যাভার এবং সম্পূর্ণ সাইট সম্পাদনা ওয়েবসাইট.

সেখানে আপনি আছে!

সহায়ক রিসোর্স

ব্লগ এর লেখাগুলো


যদিও ব্লক থিম, সাধারণভাবে, হয় ওয়ার্ডপ্রেস সম্প্রদায়ের সদস্যদের কাছ থেকে প্রচুর পুশব্যাক পাচ্ছেন, আমার মতে, তারাই ওয়ার্ডপ্রেসের ভবিষ্যৎ, খুব. ব্লক থিমগুলির সাথে, অপেশাদার থিম লেখকরা, গভীর কোডিং দক্ষতা এবং PHP এবং জাভাস্ক্রিপ্ট ভাষার আয়ত্ত ছাড়াই, এখন এই নিবন্ধে বর্ণিত হিরো কভার সেকশন সহ জটিল লেআউট সহ থিম তৈরি করতে পারেন। নিদর্শন এবং শৈলী বৈচিত্র.

একজন প্রথম দিকের গুটেনবার্গ ব্যবহারকারী হিসাবে, আমি নতুন থিমিং সরঞ্জামগুলির মতো আরও উত্তেজিত হতে পারি না ব্লক থিম তৈরি করুন প্লাগইন এবং অন্যান্য যা থিম লেখকদের ব্লক সম্পাদক UI থেকে সরাসরি নিম্নলিখিতগুলি অর্জন করতে দেয় কোন কোড না লিখে:

  • (ঝ) সৃষ্টি
  • (ii) থিম ফাইল ওভাররাইট এবং এক্সপোর্ট
  • (iii) ফাঁকা বা একটি চাইল্ড থিম তৈরি করুন, এবং
  • (iv) বর্তমান থিমের শৈলীর বৈচিত্র পরিবর্তন এবং সংরক্ষণ করুন

অতিরিক্তভাবে, গুটেনবার্গ প্লাগইনের সাম্প্রতিক পুনরাবৃত্তিগুলি সক্ষম করার অনুমতি দেয় তরল টাইপোগ্রাফি এবং বিন্যাস প্রান্তিককরণ এবং অন্যান্য শৈলীগত নিয়ন্ত্রণ শুধুমাত্র ব্যবহার করে theme.json জাভাস্ক্রিপ্ট ছাড়া ফাইল এবং CSS নিয়মের একটি লাইন।

পড়ার জন্য আপনাকে ধন্যবাদ এবং নীচে আপনার মন্তব্য এবং চিন্তা শেয়ার করুন!

সময় স্ট্যাম্প:

থেকে আরো সিএসএস কৌশল