تُعتبر تجربة المستخدم جزءًا أساسيًا من نجاح أي منتدى، حيث يُفضل الأعضاء وجود ميزات تسهل عليهم الوصول إلى المحتوى ومشاركته. لذا، فإن إضافة ميزة النسخ التلقائي للأكواد تُعد خطوة مهمة لتحسين هذه التجربة. من خلال استخدام كود JavaScript، يمكنك تسهيل عملية نسخ الأكواد بلمسة واحدة دون الحاجة إلى تحديد المحتوى يدويًا.
أهمية إضافة ميزة النسخ التلقائي:
عندما يكون لدى الأعضاء إمكانية نسخ الأكواد بسهولة، فإن ذلك يُساهم في تحسين انخراطهم وزيادة تفاعلهم. بدلاً من الزر التقليدي لتحديد النص، تتيح هذه الميزة نسخ المحتوى مباشرةً، مما يوفر الوقت ويعزز كفاءة التصفح.كيفية تثبيت الميزة:
لتنفيذ هذه الميزة في منتداك، اتبع الخطوات التالية:- الدخول إلى لوحة الإدارة:
- انتقل إلى عناصر إضافية ثم إدارة أكواد JavaScript.
javascript
نسخ الكود
الكود:
$.getScript('https://cdn.jsdelivr.net/clipboard.js/1.5.16/clipboard.min.js', function() {
window.fae_copyCode = {
copy : 'نسخ الكود',
copied : 'تم النسخ!'
};
$(function() {
var a = $('.codebox dt, .codebox p').not('.spoiler > dt, .hidecode > dt'),
i = 0,
j = a.length;
if (a[0]) {
$('head').append('<style type="text/css">.fae_copy-code{float:right;cursor:pointer;}.fae_copy-code:hover{text-decoration:underline}</style>');
for (; i < j; i++) {
a[i].insertAdjacentHTML('beforeend', '<span class="fae_copy-code">' + fae_copyCode.copy + '</span>');
}
new Clipboard('.fae_copy-code',{
target : function (copy) {
if (copy.innerHTML != fae_copyCode.copied) {
return $(copy).closest('.codebox').find('.cont_code, code')[0];
}
}
}).on('success', function (e) {
var copy = e.trigger;
if (copy.innerHTML != fae_copyCode.copied) {
copy.innerHTML = fae_copyCode.copied;
copy.className += ' fae_copied';
window.setTimeout(function() {
copy.innerHTML = fae_copyCode.copy;
copy.className = copy.className.replace('fae_copied', '');
}, 1000);
}
e.clearSelection();
});
}
});
});
كيفية عمل الميزة:
- بعد إضافة الكود، سيتم عرض زر "نسخ الكود" بجوار كل كتلة كود.
- عند الضغط على الزر، سيتم نسخ الكود تلقائيًا، مع ظهور رسالة تأكيد "تم النسخ!" لمدة ثانية، مما يُشعر الأعضاء بإنجاز العملية.
الفوائد:
- سهولة الاستخدام: تُسهّل عملية نسخ الأكواد، مما يُعزز من تجربة التصفح للأعضاء.
- زيادة التفاعل: تعزز من تفاعل الأعضاء مع المحتوى، حيث تشجعهم على المشاركة واستخدام الأكواد المُقدمة.
- تحسين أداء المنتدى: تزيد من قيمة المنتدى كمرجع موثوق للمعلومات والأكواد.