بزرگترین جشنواره پایان سال
BLACK
FRIDAY
آموزش المنتور 2024

قالب Single افزونه المنتور پرو – طراحی قالب برای مقاله های سایت

فهرست مطالب

قالب Single چست ؟

قالب سینگل یا قالب تکی این امکان را به ما می دهد تا برای برگه ها و نوشته های سایت خود یک طرح واحد را خلق کنیم. این ویژگی باعث می شود تا سرعت تولید محتوا در سایت چندین برابر سریع تر و از همه مهم تر اصولی شود.

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

ابزارک های قالب Single

هنگامی که یک قالب Single ایجاد می کنیم. این قالب علاوه بر ابزارک های موجود، 9 ابزارک نیز به ویرایشگر شما اضافه می شود. همانطور که گفتیم وظیفه این ابزارک ها داینامیک کردن محتوای اصلی نوشته ها و برگه های وب سایت می باشد.

  1. Post Title (عنوان نوشته و برگه) – وظیفه این ابزارک نمایش عنوان برگه ها و نوشته های سایت می باشد.
  2. Post Excerpt (خلاصه نوشته) – این ابزارک چکیده و یا خلاصه نوشته ها را نمایش می هد. لازم به توضیح است برگه ها در وردپرس فاقد فیلد چکیده هستند.
  3. Post Content (محتوای نوشته و برگه) – این ابزارک مهم ترین ابزارک در قالب Single می باشد. با استفاده از این ابزارک محتوای تولید شده در برگه ها و نوشته های سایت به نمایش در می آید.
  4. Featured Image (تصویر شاخص) – وظیفه ی این ابزارک نمایش تصویر شاخص نوشته ها و برگه ها می باشد
  5. Table Of Contents (فهرست محتوا) – این ابزارک عناوین اصلی محتوای برگه و یا نوشته را نمایش می دهد. بهتر است که از این ابزارک فقط برای نوشته ها خود استفاده کنید.
  6. Author Box (اطلاعات نویسنده) – نمایش تصویر، بیوگرافی و نام نویسنده تولید کننده محتوا توسط این ابزارک انجام می شود.
  7. Post Comment (نظرات) – نمایش نظرات کاربران با استفاده از این ابزارک صورت می پذرید. توجه کنید برای اینکه این ابزارک در برگه ها قابل استفاده باشد ابتدا باید قابلیت دیدگاه گذاری را در برگه فعال کنید. دیدگاه نوشته ها در وردپرس به صورت پیشفرض فعال می باشند.
  8. Post Navigation (هدایت کننده) – با استفاده از این ابزارک می توانید نوشته قبلی و بعدی مقاله های خود به کاربر نمایش دهید.
  9. Post Info (اطلاعات نوشته و برگه) – تاریخ انتشار، تعداد دیدگاه، نویسنده و ساعت انتشار نوشته و برگه با استفاده از این ابزارک قابل نمایش می باشد.

انتشار و مدیریت نمایش قالب Single

پس از نهایی شدن طراحی قالب ما باید مشخص کنیم که این قالب در کدام بخش ها نمایش داده شوند و در کدام بخش ها نمایش داده نشوند. پس از انتشار قالب صفحه ای همانند تصویر زیر برای شما نمایش داده می شود که شما می توانید مشخص کنید که این قالب در کدام قسمت های سایت درج (INClUDE) و در کدام قسمت ها درج نشود (EXCLUDE)

بیشتر یاد بگیرید ….

برای درک بهتر موارد فوق حتما ویدئو آموزشی این مقاله را مشاهده کنید، برای بهبود تجربه کاربری از کد های CSS نیز استفاده شده است. همچنین علاوه بر ابزارک های موجود قالب Single آموزش درج ویدئو با استفاده از افزونه ACF را نیز می توانید یاد بگیرید.

کد های CSS استفاده شده در آموزش ویدئویی

#fullArticle em {
    font-style: normal;
    background-color: #b7e9ff;
    border-radius: 3px;
    padding: 0px 3px 0 3px;
    color: #000000;
    margin : 0px 2px 0 2px;
    
}

#fullArticle ol {
    list-style: none;
    counter-reset: li;
    padding-right: 0px;
    margin-right: 35px;
    
}
#fullArticle ol li {
    counter-increment: item;
    margin-bottom:5px;
}
#fullArticle ol li:before {
    margin-left: 10px;
    content: counter(item);
    background: #db3157;
    border-radius: 50%;
    color: white;
    width: 22px;
    height: 22px;
    line-height: 25px;
    text-align: center;
    display: block;
    float: right;
    font-weight: 400;
    margin-top: 6px;
    margin-right: -35px;
}

#fullArticle ul li:before {
    content: "\f00c";
    color: #2cce57;
    margin-right: -25px;
    float: right;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900; /* Fix version 5.0.9 */
    font-size: 15px
}

#fullArticle ul li {
    padding-left: 0;
    padding-right: 0px;
    list-style: none !important;
    margin-right:-15px;

 
}

#fullArticle img {
    border: solid 1px #e0e0e0;
    box-shadow: 0 0 20px 0 rgb(70 83 90 / 18%);
    margin-top: 10px;
    margin-bottom: 10px;
}

figure {

    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
#fullArticle pre {
    direction: ltr;
    text-align: left;
    background: #f3fcfe;
    font-size: 12px;
    font-weight: 600;
    font-family: sans-serif;
    line-height: 1.9em;
    border: solid;
    border-color: #cdd6d8;
    border-width: 1px;
    padding: 10px;
    margin-bottom: 20px;
}

نکته : برای اعمال کدهای نوشته شده حتما id (شناسه) – fullArticle را در بخش محتوایی مورد نظر خود درج نمایید.

82 پاسخ

  1. مقاله بسیار عالی بود .
    سوال : چرا مطالبی که با ادیتور المنتور ویرایش شده اند ، قالب روشون اعمال نمیشه ؟؟؟

    1. بسیار ممنون
      به دلیل اینکه قالب بر روی محتوا اعمال می شود نه ویرایشگر

  2. سلام و خسته نباشید
    من 2 تا مشکل داشتم ممنون میشم راهنمایی بفرمایید
    1.میخوام قالب پست رو درست کنم ولی ساید بار پیشفرض رو نمیتونم حذف کنم
    2.هرکاری میکنم فونت یکی از نوشته هام تغییر نمیکنه

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

  3. این کد ها را در بخش گلوبال تنظیمات سایت کپی کردم فقط مشکلی که دارم اینکه فونت اعداد را فارسی نمیتونم تغییر بدم
    یعنی اعداد انگلیسی هست و نمیشه فونت شا عوض کنم البته قبلا فونت اعداد فارسی را وارد کرده ام که و سایر بخش های سایتم اعدادش فارسی هست. ولی دایره های قرمز ک عدد داخلش هست فارسی نیست چکار کنم؟

    1. سلام
      کافیست از ویژگی font-family:font-name و نام فونت در کدمربوط به فهرست های سلسله مراتب استفاده نمایید.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دریافت راهنمای تخصصی برای بهبود کار با المنتور
دریافت راهنمای تخصصی برای بهبود کار با المنتور