Divi Layout Block راه‌های بسیاری را برای ادغام ویژگی‌های طراحی قدرتمند Divi Builder با ویرایشگر بلوک پیش‌فرض وردپرس (گوتنبرگ) باز می‌کند. این به شما امکان می دهد بیشتر موارد را بنویسید محتویات از پست وبلاگ خود با استفاده از رابط بلوک آشنای گوتنبرگ، سپس طرح بندی های Divi را در جایی که طراحی یا عملکرد سفارشی مورد نیاز است، تزریق کنید. یک بلوک طرح‌بندی Divi می‌تواند شامل هر چیزی باشد که می‌توانید در Divi Builder ایجاد کنید، اما برای گنجاندن چیزی به سادگی و ضروری بودن نیز عالی است. فرم از اشتراک
در این آموزش نحوه اضافه کردن a را خواهیم دید فرم اشتراک در یک پست وبلاگ گوتنبرگ با استفاده از بلوک طرح بندی Divi.
نتیجه احتمالی
وارد کردن بلوک طرح JSON
طرح مورد نظر را در کتابخانه دیوی بارگیری کنید
برای وارد کردن فایل JSON که می توانستید در بالا بارگیری کنید ، به کتابخانه Divi خود در قسمت پشت داشبورد وردپرس خود بروید و بر روی "وارد کردن و صادر کردن" کلیک کنید.
سپس پرونده JSON را در پوشه بارگیری خود انتخاب کنید و روی "Import Divi Builder Layouts" کلیک کنید.
یک Divi Block جدید در داخل پست Gutenberg اضافه کنید
پس از وارد کردن طرح شما ، می توانید به پیام Gutenberg خود دسترسی پیدا کرده و یک بلوک طرح جدید Divi اضافه کنید.
یک فایل JSON را از ارائه های ذخیره شده وارد کنید
سپس ، روی "بارگیری از کتابخانه" کلیک کنید ، به "طرح های ذخیره شده خود" بروید و طرح را برای وارد کردن بلوک طرح Divi CTA به پست وبلاگ خود انتخاب کنید. خودشه !
و این همه!
بیایید سراغ آموزش برویم ، خوب؟
ماژول ایمیل Optin را به پست وبلاگ گوتنبرگ خود اضافه کنید
یک پست وبلاگ ایجاد یا ویرایش کنید
برای شروع، باید یک پست وبلاگ جدید ایجاد کنیم یا یک پست موجود را ویرایش کنیم. برای این مثال، بیایید اضافه کنیم محتویات عنوان و متن مقاله را با استفاده از چند بلوک سرصفحه و پاراگراف ساختگی کنید. در مرحله بعد، یک تصویر ویژه اضافه کنید و "No Sidebar" را برای طرح بندی در تنظیمات صفحه Divi انتخاب کنید.
یک بلوک چیدمان Divi را به صورت آنلاین اضافه کنید
هنگامی که بیشتر پست را ایجاد کردید، تنها کاری که باید انجام دهیم این است که یک بلوک طرح بندی جدید Divi را در هر جایی که می خواهیم در قسمت پست اضافه کنیم. محتویات از انتشار. ممکن است آن را در جایی نزدیک‌تر به انتهای پیام اضافه کنیم تا از یک سرنخ واجد شرایط که آشکارا به محتوای پیام علاقه مند است، جذب کنیم.
برای افزودن آن ، ماوس را روی محلی که می خواهید گزینه ایمیل را اضافه کنید نشان دهید ، سپس روی نماد آبی رنگ کلیک کنید تا بلوک جدیدی اضافه کنید. در لیست بلوک های زمینه ای ، بلوک طرح بندی Divi را انتخاب کنید.
یک طرح جدید در بلوک طرح Divi ایجاد کنید
پس از انتخاب بلوک طرح بندی Divi ، گزینه "ایجاد یک طرح جدید" یا "بارگیری از کتابخانه" را خواهیم داشت. از آنجا که ما باید گزینه ایمیل را از ابتدا ایجاد کنیم ، گزینه "ایجاد طرح جدید" را انتخاب کنید.
طراحی بخش
در ویرایشگر layout ، می توانیم طراحی ایمیل optin را که باید در پست ما قرار گیرد شروع کنیم. هر آنچه را که در این ویرایشگر طراحی می کنیم ، در قسمت Divi Layout Block پست نمایش داده می شود.
برای شروع ، تنظیمات بخش پیش فرض را که قبلاً در آنجا بود باز کنید.
برای چیدمان ، یک طرح دو ستونی را انتخاب خواهیم کرد.
سپس ماژول Email Optin را به یکی از ستون ها اضافه می کنیم ، انتخاب ستون را به شما می سپارم.
بعد ، ما پس زمینه بخش را سفارشی می کنیم. شما همیشه می توانید مقادیر را تغییر دهید تا طراحی خود را منحصر به فرد کنید. با این حال ، ما از مقادیر زیر استفاده کردیم:
- زمینه: # ff6100
- جداکننده بالا و پایین: سیزدهمین شمارش از بالا.
- عرض عنصر تقسیم کننده: 40 پیکسل (بالا و پایین).
اکنون متنی را به ستون مقابل اضافه می کنیم. در اینجا، از متن انگیزشی برای آوردن آن استفاده خواهید کرد بازدید کننده برای اشتراک
سپس باید تغییرات مختلفی را انجام دهید:
- متن قلم: مونتسرات
- رنگ قلم: #FFF
- قلم متن زیرنویس H2: مونتسرات
- متن زیرنویس H2 اندازه: 2.5em
- متن زیرنویس H2 Color: #FFF
به یاد داشته باشید سیستم ایمیل مورد استفاده خود را پیکربندی کنید. باید بدانید که گوتنبرگ با آن سازگار است MailChimp.
آخرین افکار
افزودن یک ایمیل optin به پیام گوتنبرگ با بلوک طرح Divi بسیار آسان شده است. نه تنها می توانید در عرض چند ثانیه گزینه ایمیل کاملاً کاربردی (و کاربرد آسان) را اضافه کنید ، بلکه می توانید از Divi Builder برای افزودن طراحی سفارشی ، جلوه های شناور و انیمیشن استفاده کنید. همه اینها بدون نیاز به استفاده از پلاگین!
