اضافة تلميحات إلى نص بطريقة جذابة على مدونات بلوجر بخمسة اشكال مختلفة

السلام عليكم مرحبا بكم في مدونة عبدو تكنولوجي اليوم اقدم لكم شرح حصري على كيفية اضافة تلميحات لروابطك و لكلمات مهمة في تدوينتك يعني عندا وضع الفأرة على الكلمة المسطر عليها تنبثق نافذة تكون فيها تعريف بسيط على الكلمة التي حدتها و في الشكل الذي وضعته في الصورة المصغرة يوجد فيها كلمات + صورة على الكلمة و يوجد اشكال اخرى يمكنك معاينتها من الزر التالي

معاينة

الان نتجه الى الشرح

1. بعد فتح تحرير html في بلوجر
2. تبحث على </head>
3. و تضع هذا الكود فوقه مباشرة

<link href='http://rawgit.com/abdelalilebbihi/techabdou/master/master/css/tooltip.css' rel='stylesheet'/>

و الان نتجه الى جزء اضهار الاضافة 

<span class="tooltip tooltip-effect-1"><span class="tooltip-item">هنا الكلمة المسطر عليها</span><span class="tooltip-content clearfix"><img src="هنا صورة"/><span class="tooltip-text"><strong>هنا الكلمة المسطر عليها</strong> هنا وصف الكلمة المسطر عليها <a target="_blank" href="هنا تضع رابط يخص الكلمة المسطر عليها">هنا عنوان الرابط الذي تضعه</a></span></span></span>

1. الان اذا اردت تغيير طريقة ضهور التلميحة ما عليك سوى tooltip-effect-1 الى tooltip-effect-2 او tooltip-effect-3 او tooltip-effect-4
2. مثال <span class="tooltip tooltip-effect-1"> الى <span class="tooltip tooltip-effect-2">

الان نتجه الى الافكت الخامس و الاخير و الذي يكون بدون صورة كتابة و رابط فقط

كود هذا هوا 

<span class="tooltip tooltip-effect-5"><span class="tooltip-item">كلمة مسطر عليها</span><span class="tooltip-content clearfix"><span class="tooltip-text"><strong>كلمة مسطر عليها</strong>وضف للكلمة مسطر عليها <a href="رابط كلمة مسطر عليها">كلمة مسطر عليها</a></span></span></span>


اذا اعجبتك اضافة لا تنسى الاشتراك في المدونة لدعمي ولكي تتوصل بكل ما هوا جديد من اضافات و قوالب حصرية

شارك هذا