السلام عليكم
سوف نشرح باذن الله كيفية اضافة تلميحات او بما يسمى tooltip
المعاينة
اولا
نقوم برفع هذا الملف
tooltip.zip
الذي بحتوى على
tooltip.min.css
tooltip.min.js
نقوم برفع الملف tooltip.min.css الى المسار التالي
CODE
styles/default/css/tooltip.min.css
نقوم برفع الملف tooltip.min.js الى المسار التالي
CODE
includes/js/tooltip.min.js
ثانيا
نقوم باستدعاء الملفات
نقوم بتحرير قالب headinclud
لوحة تحكم الإدارة القوالب » default-style » تحرير : headinclud
ثم نضيف اوامر استدعاء
نضيف سطر التالي بجانب اسطر css
CODE
<link rel="stylesheet" href="{$ForumAdress}styles/default/css/tooltip.min.css" />
نضيف سطر التالي بجانب اسطر js
CODE
<script type="text/javascript" src="{$ForumAdress}includes/js/tooltip.min.js"></script>
و في الاخير نضيف سطر التالي لتفعيل tooltip
يجب ان يكون قبل </head>
CODE
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
ثالثا
الان نقوم باضافة كودة التالي في جميع القوالب التي تحتوي على title=""
CODE
data-toggle="tooltip" data-placement="auto"
بجانب title=""
اى يصبح
CODE
data-toggle="tooltip" data-placement="auto" title=""
مثال
لدينا هذا سطر خاص يعدد المواضيع المتواجد في عنواوين المنتديات
CODE
<span class="subject_num subject_num_icon pkr-b" title="{$lang['subject_num']}">
كما قلنا سابقا نضيف السطر السابق بجانب titlr=""
فتصبح النتيجة
CODE
<span class="subject_num subject_num_icon pkr-b" data-toggle="tooltip" data-placement="auto" title="{$lang['subject_num']}">
و نحفظ و نقوم بحذف الكاش المتصفح عن طريق برنامج ccleaner و نرى النتيجة
بالتوفيق
شرح اضافة تلميحات Tooltip
.. جزاك الله كل خير اخي عبد الرحمن على مجهودك الكبير