راهنمای مبتدیان: نحوه استفاده از الگوهای بلاک وردپرس

راهنمای مبتدیان: نحوه استفاده از الگوهای بلاک وردپرس

آیا می خواهید نحوه استفاده از الگوهای بلوک وردپرس را در وب سایت خود بیاموزید؟

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

در این مقاله، نحوه استفاده از الگوهای بلاک وردپرس و یافتن الگوهای بیشتری برای استفاده در وب سایت خود را به شما نشان خواهیم داد.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 1

موضوعاتی که در این راهنما به آنها خواهیم پرداخت:

الگوهای بلاک وردپرس چیست؟

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

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 2

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

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 3

موضوعات محبوب وردپرس نیز الگوهای خود را ارائه می دهند که می توانید هنگام نوشتن محتوا از آنها استفاده کنید.

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

شما می توانید الگوهای بیشتری را در وب سایت WordPress.org بیابید، و حتی می توانید الگوهای خود را ایجاد کرده و به اشتراک بگذارید.

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

نحوه استفاده از الگوهای بلاک در وردپرس

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

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

در صفحه ویرایش پست، روی دکمه افزودن بلوک [+] کلیک کنید تا درج کننده بلوک باز شود. از اینجا، به برگه «الگوها» بروید تا الگوهای بلوک موجود را مشاهده کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 4

برای دیدن الگوهای بلوک موجود می توانید به پایین پیمایش کنید.

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

همچنین می‌توانید روی دکمه «کاوش همه الگوها» برای مشاهده الگوهای بلوک کلیک کنید.

در اینجا، می‌توانید پیش‌نمایش‌های بزرگ‌تر را در یک پنجره بازشو ببینید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 5

هنگامی که الگویی را پیدا کردید که می‌خواهید امتحان کنید، کافی است روی آن کلیک کنید تا آن را در قسمت محتوای پست یا صفحه خود وارد کنید.

الگو در ویرایشگر محتوا با محتوای نگهدارنده ظاهر می شود که می توانید آن را ویرایش کرده و با محتوای خود جایگزین کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 6

برای ویرایش و تغییر محتویات آن با توجه به نیاز خود کافی است هر بلوکی را در داخل الگو قرار دهید و روی آن کلیک کنید.

هنوز همه گزینه‌هایی را که معمولاً برای هر بلوک دارید، خواهید داشت. برای مثال، اگر یک بلوک پوششی است، می‌توانید رنگ جلد را تغییر دهید یا تصویر پس زمینه.

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 7

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

در نهایت، الگوهای بلوک به شما کمک می‌کنند تا زمانی را که در غیر این صورت هر بار که نیاز به اضافه کردن سرصفحه، گالری، دکمه‌ها و موارد دیگر به صورت دستی برای چیدمان بلوک‌ها صرف می‌کنید، صرفه‌جویی کنید.

نحوه ایجاد الگوها در ویرایشگر بلاک

WordPress ایجاد الگوهایی در ویرایشگر بلوک را بسیار آسان می کند که می توانید بعداً دوباره از آنها استفاده کنید.

هنگام ویرایش یک پست یا صفحه، به سادگی بلوک هایی را که می خواهید در الگوی خود قرار دهید انتخاب کنید و روی “ایجاد الگو” کلیک کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 8

می‌توانید با فشار دادن کلید shift روی صفحه‌کلید و کلیک کردن روی آن‌ها، چندین بلوک را انتخاب کنید.

با این حال، اگر بلوک‌های شما به‌گونه‌ای مرتب شده‌اند که انتخاب آنها را سخت‌تر می‌کند، می‌توانید از نمای فهرست در برگه نمای کلی سند استفاده کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 9

با ایجاد یک الگو، یک پنجره بازشو ظاهر می شود.

شما باید یک نام برای الگوی خود ارائه دهید و یک دسته را انتخاب کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 10

در زیر آن، یک کلید برای حفظ الگوی Synced یا Unsynced خواهید دید.

الگوهای همگام‌سازی شده: وقتی شما یا سایر کاربران الگو را ویرایش می‌کنید، دفعه بعد که از آن الگو استفاده می‌شود، این تغییرات ذخیره می‌شوند.

الگوهای همگام‌نشده: تغییراتی که در آن الگوها پس از درج آن‌ها در یک پست یا صفحه ایجاد می‌شود، بر الگوی اصلی تأثیر نمی‌گذارد.

برای ذخیره الگوی خود روی دکمه “ایجاد” کلیک کنید.

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 11

نحوه ایجاد الگوها در ویرایشگر سایت

اگر از مسدود کردن تم با پشتیبانی کامل از ویرایشگر سایت، سپس می توانید الگوهایی را در ویرایشگر سایت ایجاد کنید.

ویرایشگر سایت را با بازدید از صفحه ظاهر » ویرایشگر باز کنید.

اکنون وارد رابط ویرایشگر سایت خواهید شد.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 12

برای ادامه روی “Patterns” از نوار کناری سمت چپ کلیک کنید.

همه الگوها و دسته‌های موجود را خواهید دید.

برای ایجاد یک الگوی جدید، روی دکمه افزودن [+] کلیک کنید و سپس «ایجاد الگو» را انتخاب کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 13

با این کار یک پنجره بازشو ظاهر می‌شود که در آن باید یک نام برای الگوی خود ارائه دهید، یک دسته را انتخاب کنید و تصمیم بگیرید که آیا می‌خواهید الگو همگام‌سازی شود یا غیرهمگام‌سازی شود.

برای ادامه روی “ایجاد” کلیک کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 14

WordPress یک بوم خالی برای شما ایجاد می کند تا الگوی خود را ایجاد کنید.

از اینجا می‌توانید بلوک‌هایی را برای طراحی الگوی خود اضافه کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 15

پس از پایان کار، فراموش نکنید که روی دکمه “ذخیره” کلیک کنید تا الگوی خود ذخیره شود.

مدیریت الگوها در وردپرس

اگر از یک تم بلوک با ویرایشگر کامل سایت پشتیبانی می کند، سپس می توانید الگوها را در ویرایشگر سایت مدیریت کنید.

ویرایشگر سایت را با بازدید از صفحه ظاهر » ویرایشگر باز کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 16

در صفحه الگوها، می‌توانید روی یک الگو کلیک کنید تا آن را ویرایش کنید. همچنین می‌توانید روی منوی سه نقطه در کنار یک الگو کلیک کنید تا آن را کپی، صادر یا حذف کنید.

برای مدیریت همه الگوهای خود، روی برگه “مدیریت همه الگوهای من” در نوار کناری کلیک کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 17

این لیستی از تمام الگوهای شما را به شما نشان می دهد.

اکنون، می‌توانید آنها را ویرایش، صادر یا حذف کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 18

اگر از طرح زمینه کلاسیک استفاده می‌کنید (مضامین وردپرسی که از ویرایشگر کامل سایت پشتیبانی کنید)، سپس می توانید با مراجعه به صفحه ظاهر » الگوها الگوها را مدیریت کنید.

از اینجا می‌توانید الگوهای بلوک خود را اضافه، حذف و صادر کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 19

پیدا کردن الگوهای بلوک بیشتر برای استفاده در وب سایت شما

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

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

به سادگی به دایرکتوری الگوهای WordPress بروید وب سایت برای مشاهده بسیاری از الگوهای بلوک بیشتر.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 20

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

برای استفاده از یکی از این الگوهای بلوک، به سادگی برای مشاهده الگو کلیک کنید و سپس روی دکمه “کپی الگو” کلیک کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 21

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

در صفحه ویرایش، به سادگی کلیک راست کرده و “Paste” را در منوی مرورگر انتخاب کنید یا CTRL+V (Command + V در Mac) را فشار دهید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 22

چگونه الگوهای بلوک خود را ایجاد و به اشتراک بگذارید

می‌خواهید الگوهای بلاک وردپرس خود را ایجاد کنید و آنها را با جهان به اشتراک بگذارید؟

WordPress ایجاد الگوهای بلوک و استفاده از آنها در وب سایت های خود یا اشتراک گذاری آنها با همه کاربران وردپرس در سراسر جهان را بسیار آسان می کند.

به سادگی از وب سایت دایرکتوری الگوهای وردپرس دیدن کنید و روی پیوند “الگوی جدید” کلیک کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 23

توجه: برای ذخیره الگوهای خود باید وارد سیستم شوید یا یک حساب رایگان WordPress.org ایجاد کنید.

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 24

برای ایجاد طرح بندی الگوی خود کافی است بلوک ها را اضافه کنید.

می‌توانید از بلوک‌های طرح‌بندی مانند گروه، جلد، گالری و موارد دیگر برای سازماندهی چیدمان.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 25

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

وقتی از الگوی بلوک خود راضی شدید، می توانید آن را به عنوان پیش نویس ذخیره کنید یا به فهرست الگو ارسال کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 26

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

می‌توانید با کلیک کردن روی پیوند «الگوهای من» همه الگوهای بلوک خود را مدیریت کنید. تمام الگوهای بلوکی که به اشتراک گذاشته اید، الگوهای پیش نویس و الگوهایی که مورد علاقه شماست را نشان می دهد.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 27

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

ایجاد الگوهای بلاک وردپرس به صورت دستی

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

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

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 28

پس از آن، به حالت ویرایشگر کد بروید.

از اینجا، باید تمام محتوایی را که در ویرایشگر کد می‌بینید کپی کنید.

راهنمای مبتدیان نحوه استفاده از الگوهای بلاک وردپرس 29

بعد، یک ویرایشگر متن ساده مانند Notepad باز کنید و آن کد را جایگذاری کنید. در مرحله بعدی به آن نیاز خواهید داشت.

اکنون، شما آماده هستید تا بلوک های خود را به عنوان الگو ثبت کنید.

برای انجام این کار، به سادگی کد زیر را کپی کرده و در توابع زمینه خود جایگذاری کنید. فایل .php یا یک افزونه قطعه کد مانند افزونه WPCode رایگان (توصیه می شود).

برای اطلاعات بیشتر ، در اینجا راهنمای کامل اضافه کردن کد سفارشی در وردپرس .

تابع wpb_my_block_patterns () {
    Register_Block_Pattern (
        "منو-پلاجین/من-با کیفیت" ،
        آرایه(
            "عنوان" => __ ("طرح مجله دو ستون" ، "My-theme") ،
            "توضیحات" => _x ("یک طرح ساده به سبک مجله ای دو ستونی با تصویر بزرگ و متن سبک" ، "Theme-Theme") ،
            "دسته ها" => آرایه ("ستون") ،
            "محتوا" => "کد محتوای بلوک شما به اینجا می رود"
            )
    )
}
add_action ('init' ، 'wpb_my_block_patterns') ؛

اکنون ، داده های بلوک خام را که قبلاً کپی کرده اید به عنوان مقدار پارامتر محتوا کپی و چسباندن کنید. به عبارت دیگر ، شما باید متن را جایگزین کنید که می گوید: “کد محتوای بلوک شما به اینجا می رود” با کد بلوک خود. حتماً نقل قول های واحد اطراف متن را در جای خود بگذارید.

در آخر ، فراموش نکنید که عنوان و توضیحات را به خودتان تغییر دهید و تغییرات خود را ذخیره کنید.

اکنون می توانید به وب سایت خود مراجعه کرده و یک پست یا صفحه را ویرایش کنید. الگوی بلوک تازه ثبت شده شما در Inserter Block ظاهر می شود.

<شکل کلاس = "wp-block-image size-full">

نحوه حذف یک الگوی بلوک در وردپرس

می توانید به راحتی هر الگوی بلوک را در وردپرس حذف یا ثبت نام کنید. بیایید بگوییم که می خواهید الگوی بلوک ایجاد شده را در مثال بالا حذف کنید.

تمام کاری که

شما باید انجام دهید این است که کد زیر را در پرونده های موضوع خود کپی و جایگذاری کنید. “rel =” noopener “> wpcode :

تابع wpb_unregister_my_patterns () {
  unregister_block_pattern ('my-plugin/my-asese-pattern') ؛
}
add_action ('init' ، 'wpb_unregister_my_patterns') ؛

در این مثال ، "my-plugin/my-awesome-pattern ' نام الگویی است که هنگام ثبت نام از آن استفاده کردیم.

می توانید از این کد برای ثبت نام الگوی بلوک ایجاد شده توسط موضوع یا افزونه خود استفاده کنید. تنها چیزی که باید بدانید نامی است که برای ثبت الگوی استفاده می شود.

الگوهای اصلی وردپرس را حذف کنید

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

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

برای حذف تمام الگوهای اصلی وردپرس ، باید کد زیر را به پرونده توابع موضوع خود یا wpcode اضافه کنید:

remove_theme_support ('core-block-patterns') ؛

چه اتفاقی برای بلوک های قابل استفاده مجدد افتاد؟

الگوهای بلوک و بلوک های قابل استفاده مجدد هر دو با هدف حل یک مشکل مشابه: گزینه هایی را در اختیار کاربران قرار دهید تا به راحتی بلوک های متداول را اضافه کنند.

برای رفع این مشکل ، تیم اصلی وردپرس بلوک های قابل استفاده مجدد را در الگوهای ادغام کرد.

برای داشتن عملکرد مشابه بلوک های قابل استفاده مجدد ، اکنون می توانید از الگوهای همگام سازی استفاده کنید. هنگامی که شما یا سایر کاربران الگوی را ویرایش می کنید ، دفعه بعد که از آن الگوی استفاده می شود ، این تغییرات ذخیره می شود.

<شکل کلاس = "wp-block-image size-full">

امیدواریم این راهنما به شما کمک کند یاد بگیرید که چگونه از الگوهای بلوک وردپرس در وب سایت خود استفاده کنید. شما همچنین ممکن است بخواهید راهنمای ما را در تسلط بر ویرایشگر بلوک وردپرس یا نگاهی به این میانبر های مفید وردپرس برای تولید بیشتر.

اگر این مقاله را دوست داشتید، لطفاً در کانال یوتیوب برای آموزش های ویدیویی وردپرس. همچنین می‌توانید ما را در تویتر و فیس بوک.

خروج از نسخه موبایل