موضوع بیست و بیست و پنج وردپرس: مروری بر یک توسعه دهنده

الگوها و قطعات قالب

بیست بیست و پنج تعدادی الگوی بلوک و قطعات قالب را ارائه می دهد که به کاربران وردپرس کمک می کند تا پست ها و صفحات خود را در عرض چند دقیقه بسازند. این الگوها و بخش های الگو برای چندین هدف طراحی شده اند، مانند صفحات فرود، محصولات و خدمات، رویدادها، فراخوان ها، درباره صفحات و موارد دیگر.

در پوشه تم، فایل های مربوطه را در دایرکتوری ها پیدا خواهید کرد parts و patterns. وقتی هر فایل قسمت قالب را باز می کنید، می بینید که هر قسمت الگو فقط شامل یک پیوند به یک الگوی بلوک است. در اینجا کد این است header.html بخش قالب:

قطعات قالب نیز باید ثبت شوند، بنابراین آنها را در لیست Twenty Twenty-Five خواهید یافت. theme.json زیر templateParts دارایی:

{
"templateParts": (
{
"area": "header",
"name": "header",
"title": "Header"
},
{
"area": "footer",
"name": "footer",
"title": "Footer"
},
{
"area": "footer",
"name": "footer-newsletter",
"title": "Footer Newsletter"
},
{
"area": "uncategorized",
"name": "right-aligned-sidebar",
"title": "Right Aligned Sidebar"
},
{
"area": "uncategorized",
"name": "sidebar",
"title": "Sidebar"
}
)
}

را area prop بخش صفحه را که در آن قسمت الگو قرار می گیرد و دسته مربوطه را تعیین می کند. name قالب راب بخش است، و title رشته متنی است که برای ایجاد برچسبی که قسمت الگو را روی صفحه مشخص می کند استفاده می شود.

را patterns پوشه تم بیست و بیست و پنج شامل تعداد خوبی از .php فایل ها می توانید هر یک از این فایل ها را باز کنید و کد را بررسی کنید تا نحوه ساخت الگوی بلوک را بدانید.

این الگوها نمونه های عالی از ویژگی های قدرتمند وردپرس را ارائه می دهند که اخیراً به هسته اضافه شده است. به عنوان مثال، copyright.php فایل شامل کد زیر است:

در یک نگاه می توانید ببینید که این الگو از ویژگی Block Bindings معرفی شده با WordPress 6.5 برای تولید پویا محتوای متنی کپی رایت استفاده می کند.

اینجا، content ویژگی الگوی حق چاپ به منبع تعریف شده در موضوع بیست و بیست و پنج متصل است.

اگر نمی دانید که این رشته متنی کجا تعریف شده است، آن را بررسی کنید functions.php فایل Twenty Twenty-Five و کد زیر را پیدا کنید:

/**
 * Register block binding sources.
 */
if ( ! function_exists( \'twentytwentyfive_register_block_bindings\' ) ) :
/**
 * Register the copyright block binding source.
 *
 * @since Twenty Twenty-Five 1.0
 * @return void
 */
function twentytwentyfive_register_block_bindings() {
register_block_bindings_source(
\'twentytwentyfive/copyright\',
array(
\'label\'=> _x( \'© YEAR\', \'Label for the copyright placeholder in the editor\', \'twentytwentyfive\' ),
\'get_value_callback\'=> \'twentytwentyfive_copyright_binding\',
)
);
}
endif;
add_action( \'init\', \'twentytwentyfive_register_block_bindings\' );

\'© YEAR\' رشته متن نمایش داده شده در صفحه را تولید می کند، در حالی که twentytwentyfive_copyright_binding callback رشته متن فرمت شده را ارائه می دهد:

/**
 * Register block binding callback function for the copyright.
 */
if ( ! function_exists( \'twentytwentyfive_copyright_binding\' ) ) :
/**
 * Callback function for the copyright block binding source.
 *
 * @since Twenty Twenty-Five 1.0
 * @return string Copyright text.
 */
function twentytwentyfive_copyright_binding() {
$copyright_text = sprintf(
/* translators: 1: Copyright symbol or word, 2: Year */
esc_html__( \'%1$s %2$s\', \'twentytwentyfive\' ),
\'©\',
wp_date( \'Y\' ),
);

return $copyright_text;
}
endif;

اگر همه اینها کمی پیچیده به نظر می رسد، به این فکر کنید که چقدر آسان است که کاربر بتواند طرح بندی های پیچیده را به سادگی با استفاده از عناصر موجود خارج از جعبه ایجاد کند.

و همچنین به این فکر کنید که چقدر آسان است که یک توسعه دهنده با تولید کد خود مستقیماً در ویرایشگر سایت، الگوها را ایجاد کند و الگوها را مسدود کند. و ادغام با Block Bindings API دری را به روی امکانات بی پایانی برای ادغام با منابع داده خارجی باز می کند.

Twenty Twenty-Fi نمونه های خوب دیگری از استفاده از الگوهای بلوک را ارائه می دهد. برای مثال، می توانید طرح بندی های پیشرفته را به سادگی با کنار هم قرار دادن الگوهای موجود در الگوهای دیگر بسازید.

هنگامی که الگوها را در ویرایشگر سایت مرور می کنید، می توانید چندین طرح بندی صفحه فرود را در آن مشاهده کنید صفحات دسته الگو

این الگوها طرح بندی های از پیش ساخته شده اند و برای استفاده در صفحات خود آماده هستند. هنگامی که یک صفحه جدید ایجاد می کنید، ویرایشگر یک پوشش را نشان می دهد که در آن می توانید یک الگوی بلوک را انتخاب کنید. ممکن است بخواهید با الگوی صفحه فرود شروع کنید و آن را بر اساس نیاز خود سفارشی کنید.

همچنین می توانید قالب صفحه پیش فرض را تغییر دهید و از قالبی استفاده کنید که با پروژه شما مطابقت دارد.

حالا بیایید به کد آن بپردازیم صفحه فرود برای کتاب الگوی سر به patterns پوشه Twenty Twenty-Five را باز کنید page-landing-book.php. باید کد زیر را ببینید:

این فقط مجموعه ای از الگوهای بلوک است. این باید نشان دهد که ساخت طرح بندی های پیچیده برای توسعه دهندگان و کاربران چقدر آسان است. توسعه دهندگان می توانند قطعات قالب پیچیده را ایجاد کنند و الگوهای را به سادگی و با چند کلیک، الگوهای از پیش ساخته شده را در الگوهای دیگر تودرتو بسازند. ساختن یک صفحه فرود هرگز به این آسانی نبوده است.