ایجاد و طراحی قالب نوشته با المنتور
- ۱۴۰۱/۰۵/۰۳
- ۲۳:۳۹
- بدون دیدگاه
ایجاد صفحه نوشته برای بلاگ سایت با اضافه‌کردن ویژگی‌های خاص و داینامیک به کمک المنتور و بدون نیاز به یک خط کد، پس این آموزش رو از دست ندهید و تا آخر این مطلب همراه ما باشید.
ایجاد قالب نوشته برای بلاگ
در ابتدا همانند جلسات قبل یک قالب از نوع نوشته تکی ایجاد کنید. (پیشخوان –> قالب‌ها –> افزودن جدید).
در ابتدا یک ستون با ارتفاع ۲۵۰ پیکسل اضافه و برای آن یک پس زمینه انتخاب کنید. شما می‌توانید از تنظیماتی که در تب استایل وجود دارد استفاده کنید، مثلاً تصویر، رنگ، گرادینت و اسلاید شو. اما یک سایت معرفی می‌کنم که پس‌زمینه‌های مختلف را با فرمت svg در اختیار ما قرار می‌دهد که می‌توانید به کمک این تصاویر سایت خود را زیباتر کنید.
وارد این سایت شوید و طرح موردنظر خود را انتخاب و بر روی آن کلیک کنید تا وارد صفحه تنظیمات آن شوید. در این صفحه شما می‌توانید اندازه، رنگ و طرح بک‌گراند را شخصی‌سازی کنید. در انتها هم می‌توان به دو صورت از این پس‌زمینه خروجی تهیه کرد.
طراحی صفحه نوشته
بعد از انتخاب پس‌زمینه نوبت به بارگذاری آن می‌رسد. همان‌طور که گفتم دو روش برای بارگذاری وجود دارد، اگر این پس‌زمینه را به‌صورت فرمت svgدانلود کرده‌اید کافی است تا فایل را به‌صورت روش‌های قبلی بارگذاری کنید و از بخش استایل ستون، تصویر موردنظر را اضافه کنید.
اما ما می‌خواهیم از کد css استفاده کنیم، پس برای خروجی گرفتن بر روی get code کلیک و کدهای بخش CSS Background Image را کپی کنید. حال وارد تب پیشرفته ستون خود شوید و css سفارشی را باز و کد کپی شده را به‌صورت زیر وارد کنید.
selector {
Your background code
}در مرحله بعد باتوجه‌به طرحی که انتخاب کرده‌اید یک روکش هم برای این پس‌زمینه انتخاب کنید تا متن‌ها به‌درستی خوانده شوند.
اضافه‌کردن ویجت‌های ضروری به اینترو نوشته
بعد از طراحی این بخش، نوبت اضافه‌کردن ویجت‌های ضروری هست. در ابتدا از ویجت مسیر راهنما استفاده می‌کنیم (این ویجت در هنگام نصب بودن افزونه‌های سئو اضافه می‌شود) بعد از آن از ویجت عنوان نوشته استفاده می‌کنیم تا به‌صورت داینامیک عنوان هر نوشته در این قالب قرار بگیرد و در آخر از ویجت اطلاعات نوشته.
فعال‌کردن مسیر راهنما
ما در این جلسه از افزونه یاهست سئو استفاده کرده‌ایم. از پیشخوان وردپرس و زیر منوی این افزونه، ظاهر جستجو را انتخاب کنید و وارد تب مسیر راهنما شوید. در اینجا جداکننده و متن را طبق نیاز شخصی‌سازی کنید و در انتهای این صفحه این ویژگی را فعال و تنظیمات را ذخیره کنید.
حالا وارد صفحه نوشته شوید و ویجت بردکرامب (breadcrumbs) را اضافه کنید.
ایجاد جایگاه برای محتوای نوشته
باتوجه‌به نوع وبسایت می‌توانید این بخش را طراحی کنید. برای مثال می‌توانید از دو سایدبار برای سمت چپ و راست صفحه و کانتنت برای وسط استفاده کنید و یا می‌توانید فقط از یک سایدبار استفاده کنید. همچنین ممکن است کسب کار شما نیاز به سایدبار در صفحه نوشته نداشته باشد.
در این جلسه ما می‌خواهیم یک سایدبار در سمت چپ صفحه قرار دهیم. پس برای این کار یک کانتینر دو ستونه با اندازه ۷۰% برای ستون سمت راست و ۳۰% برای ستون سمت چپ ایجاد کنید.
طراحی سایدبار را در جلسه بعد توضیح خواهیم داد و فقط در این جلسه جایگاه او را مشخص می‌کنیم.
طرحی کانتنت اصلی
در ابتدا از ویجت تصویر شاخص استفاده کنید تا تصاویر شاخص هر محتوا در ابتدای این کانتنت قرار بگیرد.در مرحله بعد می‌توانید از لیست فهرست برای راهنمایی بهتر کاربر و سئو بهتر سایت استفاده کنید (در ادامه به‌صورت کامل درباره آن صحبت می‌کنیم)
حال باید نوشته اصلی را قرار دهیم که برای این کار از ویجت ارسال مطالب استفاده کنید. ویجت‌های نام‌برده‌شده تنظیماتی خاصی ندارند و با یک استایل دهی ساده کار تمام است.
طراحی لیست فهرست
بعد از اضافه‌کردن این ویجت نوبت به پیکربندی آن می‌رسد
عنوان: در این قسمت می‌توانید متن عنوان این ویجت را مشخص کنید که در ابتدای این فهرست قرار می‌گیرد.
تگ html: تگ فهرست را می‌توان در این قسمت مشخص کرد.
شامل & به‌غیراز: از طریق این تنظیمات فهرست خود را فیلتر کنید. برای مثال می‌توانید مشخص کنید که فقط عنوان‌های h2 , h3 محتوا نمایش داده شود.
کانتینر: ممکن است در یک صفحه عنوان‌های مختلفی قرار گرفته باشد برای مثال در سایدبار و یا در انتهای سایت، ولی شما می‌خواهید فقط عنوان‌های بخش نوشته در فهرست، نمایش داده شود پس برای این کار ستون اصلی، که ویجت ارسال نوشته در آن قرار دارد را انتخاب کنید.
در تب پیشرفته و از بخش کلاس، یک کلاس با نام دلخواه وارد کنید (مثال content). حال وارد تنظیمات فهرست شوید و در باکس کانتینر نامی را که در مرحله قبل وارد کرده‌اید را به همراه یک نقطه اضافه کنید (.content)
نمای نشانگر: می‌توانید مشخص کنید که فهرست شما به‌صورت عددی باشد یا نقطه‌ای، حتی می‌توان نشانگر را حذف کنید.
در تب استایل این فهرست را شخصی‌سازی کنید. در آموزش ویدئویی کامل توضیح داده شده است.
بیشتر بخوانید:
دوره رایگان طراح شو
اضافه‌کردن بخش نظرات
برای اضافه‌کردن بخش نظرات یک ستون جداگانه ایجاد کنید تا قسمت دیدگاه به‌صورت تمام عرض باشد و بعد از ایجاد ستون، از ویجت ارسال نظرات استفاده کنید.
این ویجت تنظیمات خاصی ندارد و فقط مطمئن شوید که در تب محتوا، منبع بر روی نوشته فعلی تنظیم شده باشد.
ایجاد ویژگی اشتراک‌گذاری نوشته
برای اضافه‌کردن ویژگی اشتراک‌گذاری محتوا از ویجت دکمه‌های اشتراک‌گذاری استفاده نمایید.
در تب محتوای این ویجت شبکه‌های اجتماعی موردنظر را انتخاب کنید و در قسمت پایین‌تر نوع نمایش آیکون و متن را شخصی‌سازی کنید. بخش مهم این قسمت هم تارگت لینک هست که باید بر روی صفحه فعلی تنظیم شده باشد.
ما در این جلسه می‌خواهید این ویجت را در گوشه صفحه قرار دهیم پس برای این کار از تب محتوای ویجت، تعداد ستون را بر روی یک تنظیم می‌کنیم و از تب پیشرفته، جایگاه را بر روی ابسولوت قرار می‌دهیم تا باتوجه‌به تنظیمات، آیکون‌ها در گوشه سایت قرار بگیرند.
انتقال بین نوشته‌ها
در المنتور یک ویژگی به نام صفحه‌بندی نوشته اضافه شده است تا بتوانیم بین نوشته‌های بلاگ حرکت کنیم. برای این کار یک ستون اضافه کنید و ویجت صفحه‌بندی نوشته را در آن قرار دهید.
این ویجت پیکربندی ساده‌ای دارد برای مثال می‌توانید برچسب را فعال یا غیرفعال کنید، نوشته‌ها و نشانه گر را تغییر دهید، عنوان و حاشیه‌ها را فعال کنید. همچنین از بخش { در همین حال } منبع محتوای نمایش‌داده‌شده را تنظیم کنید.
ذخیره کردن قالب
بعد از طراحی این صفحه نوبت به ذخیره و انتشار قالب می‌رسد. برای این کار بر روی انتشار کلید کنید –> Add Condition –> و شمال را بر روی نوشته‌ها تنظیم و در انتها تنظیمات را ذخیره کنید.
جلسات دوره
فهرست مطالب
مدرس:
علیرضا محسن پور
- وضعیت دوره: درحال ضبط
- تعداد جلسات: ؟؟
- مدت زمان دوره: ؟؟
- سطح دوره: متوسط
