نمایش نظرات بلاگفا با شکل متفاوت! بخش نظردهی بلاگفا را برای خود شخصی سازی کنید. امکان ویرایش قالب، حالت‌های نمایش مختلف و امکان حذف بخش‌های ارسال نظر خصوصی، آدرس و ایمیل!
چند وقت پیش کد تغییر نظرات بلاگفا ۱ را به شکل ساده کدنویسی و به اشتراک گذاشتم، کد مورد استقبال بلاگفایی‌های عزیز قرار گرفت. بعد از مدتی متوجه شدم که کدها نیاز به تغییراتی دارد تا عملکرد بهتری داشته باشد. پس کدها را بروزرسانی و چند بخش کاربردی به آن اضافه کردم.
امکانات
- امکان نمایش نظر در زیر پست
inline - امکان نمایش نظر به صورت شناور
float - امکان نمایش نظر فقط در صفحه مطلب
post - امکان حذف بخش ارسال نظر خصوصی
- امکان حذف بخش آدرس وبلاگ
- امکان حذف بخش ایمیل
- امکان ویرایش قالب
- امکان ویرایش فونت
کد تغییر نظرات
آموزش استفاده از کد
کد شامل دو بخش دکمه نظر و تنظیمات نظر است،
دکمه نظر: باید جایگزین بلاک مقابل شود.
<BlogComment>...</BlogComment>
تنظیمات نظر:
باید قبل از
</body>
درانتهای کدها اضافه شود.
کلیپ آموزش کار با کد
در کلیپ بالا با استفاده از کد تغییر نظرات، بخش نظرات قالب پیشفرض بلاگفا تغییر داده می‌شود.
تغییر حالت نمایش
برای تغییر حالت نمایش در
تنظیمات نظر مقدار
const commentMode = `inline`; را به یکی از سه حالت
inline یا
float یا
post
تغییر بدهید.
حالت نمایش inline
به صورت پیشفرض، نمایش نظرات به همین حالت تنظیم شده است. هنگام کلیک بر دکمه نظر در زیر دکمه، بخش نظرات نمایش داده می‌شود و با زدن بر روی همان دکمه بخش نظرات مخفی خواهد شد. const commentMode = `inline`;
حالت نمایش float
در این حالت هنگام کلیک بر روی دکمه نظر، بخش نظرات تمام صفحه را خواهد پوشاند و با دکمه قرمز رنگ بخش نظرات مخفی خواهد شد. const commentMode = `float`;
حالت نمایش post
هنگام کلیک بر روی دکمه نظر، صفحه مطلب باز شده و در زیر مطلب، بخش نظرات نمایش داده می‌شود.const commentMode = `post`;
در حالت نمایش post اگر مطلب رمزدار باشد، فقط کسانی که رمز مطلب را داشته باشند قادر به دیدن بخش نظرات خواهند بود.
حذف بخش ارسال نظر خصوصی، آدرس وبلاگ و ایمیل
اگر مقدار هرکدام از فیلدها در تنظیمات نظر را از
true به
false
تغییر بدهید، آن قسمت غیرفعال خواهد شد.
// فیلدها
const privateComment = true; // نظر خصوصی
const userUrl = true; // آدرس
const userMail = true; // ایمیل
ویرایش قالب
اگر با CSS آشنا باشید می‌توانید قالب نظرات را ویرایش کنید.
کدهای خود را قبل از
</style>
در انتهای ویرایش قالب در تنظیمات نظر
قرار بدهید.
// ویرایش قالب
...
**کدهای جدید**
</style>`;
ویرایش فونت
در این بخش می‌توانید فونت دلخواه خود را به بخش نظرات اضافه کنید. برای اضافه کردن فونت باید لینک فونت و نام فونت را مشخص کنید.
// ویرایش فونت
const fontLink = ``; // لینک فونت
const fontName = `tahoma, system-ui`; // نام فونت
می‌توانید از فونت‌های گوگل و یا سایر فونت‌های آپلود شده استفاده کنید. من لیستی از فونت‌های آقای صابر راستی‌کردار آماده کردم که می‌توانید استفاده کنید.
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/sahel-font@v3.4.0/dist/font-face.css">
نام فونت: Sahel
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@33.003/Vazirmatn-font-face.css">
نام فونت: Vazirmatn
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/samim-font@v4.0.5/dist/font-face.css">
نام فونت: Samim
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/shabnam-font@v5.0.1/dist/font-face.css">
نام فونت: Shabnam
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/tanha-font@v0.10/dist/font-face.css">
نام فونت: Tanha
لینک فونت: <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/nahid-font@v0.3.0/dist/font-face.css">
نام فونت: Nahid
به عنوان مثال فونت ساحل را انتخاب می‌کنم پس بخش ویرایش فونت در تنظیمات نظر را به این شکل تغییر میدهم.
// ویرایش فونت
const fontLink = `<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/sahel-font@v3.4.0/dist/font-face.css">`; // لینک فونت
const fontName = `Sahel, system-ui`; // نام فونت
بهینه‌سازی قالب و کدها
اگر از کد تغییر نظرات بلاگفا استفاده می‌کنید دیگر نیازی به بخش‌های قدیمی نظرات نیست، لینک‌ها و کدهای اسکریپت مربوط را حذف کنید تا بر روی سرعت لود صفحه شما تاثیر منفی نداشته باشند.
بهتر است بدانید!
با اینترنت‌های ضعیف و کم سرعت، لودینگ بخش نظرات ممکن است طولانی‌تر باشد!
کد تغییر نظرات بلاگفا براساس
iframe
نوشته و تنظیم شده است، سرعت اینترنت در عملکرد مهم است!
اینترنت ضعیف و فیلترهای عجیب و غریب، باعث شده‌اند که بخش نظرات در حالت معمولی خود
بلاگفا
هم با مشکلاتی مواجه شود.
سوالات متداول
این کد برای کدام وبلاگ‌ها مناسب است؟ وبلاگ‌هایی که قالب واکنشگرا دارند.
دکمه نظر را کجا قرار بدهیم؟ بهتر است دکمه نظر به تنهایی در یک div در انتهای مطلب قرار بگیرد.
دکمه نظر قابل ویرایش است؟ بله می‌توانید استایل آن را تغییر بدهید و به شکل دلخواه تنظیم کنید.
علت اندازه خیلی کوچک پنجره نظرات در زیر پست بعضی از قالب‌ها چیست؟ در بعضی از قالب‌ها دکمه نظر در جایگاهی با فضای کوچکی قرار دارد، بخش نظرات هم در بعد از دکمه نمایش داده می‌شود پس قطعا نمایش کوچک و ناخوانا خواهد بود.
امیدوارم این مطلب برای شما مفید بوده باشد، موفق باشید.