Pluing تطبيق التلميحات على قوالب بلوجر

Pluing تطبيق التلميحات على قوالب بلوجر

يوجد الآن مشاهدة التعليقات : 11

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات


ا
لكل يستخدم مواقع Facebook - Google - Yahoo ...  أظن ان أول شئ صادفك عند تسجيلك  لأول مرة بالمواقع، ظهور مجموعة من التلميحات التي تعرّف لك التطبيقات الموجودة بالموقع. هذه التلميحات تظهر ايضا كلما تم إضافة تحديث او تطبيق جديد بالموقع. ودورها شرح وتوضيح طريقة عمل التطبيق وكيف تجد مركز المساعدة الخاص بوظائف التطبيق الاساسية. ايضا تستعمل في شتى المجالات ,  تم تطبيق التلميح على المدونة ويمكنك مشاهدة المثال بتمرير الماوس على الشعار الخاص بالمدونة أعلاه هذه التلميحات تطبق تلقائيا على عناصر محددة في المدونة منها الأساسية مثل العناوين المشاركات الشائعة وبعض العناصر الأخرى وأيضا تطبق يدويا وسأتطرق لشرحها بعد رفع الأكواد بموقعك 

مثال على نص


مثال على صورة





شرح طريقة التركيب



1 .نتوجه لقالب >> تحرير 

2. ابحث بإستعمال Ctrl+F عن  ]]></b:skin>

3. ضع الكود التالي قبله [ فوقه ]



 /* CSS ToolTip Hm */ .tooltip {display:none;position:absolute;border-radius:5px;box-shadow:2px 2px 3px rgba(0,0,0,.2);background-color:#333;color:#fff;padding:8px 15px;opacity:.9;z-index:10000;max-width:340px;} .tooltip:after {width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid transparent;content:'';position: absolute;border-bottom: 10px solid #333;top: -20px;bottom: auto;left: 10px;margin: 0;}

4. ابحث عن <body/>

5. ضع الكود التالي فوقه

<script type='text/javascript'>
//<![CDATA[ 
$(function(){
  $('a,img,input,.menu,.close-menu,.translator,img.related-post-item-thumbnail,.fc-members, .fc-members-canvas,h2.post-title a,a.related-post-item-title').not('.paginator,.paginator span a,#subscribe-box input').hover(function(e){ // Hover event
     var titleText = $(this).attr('title');
    $(this)
      .data('tiptext', titleText)
      .removeAttr('title');
   $('<p class="tooltip"></p>')
    .text(titleText)
    .appendTo('body')
    .css('top', (e.pageY - 0) + 'px')
    .css('left', (e.pageX + 5) + 'px')
    .fadeIn('slow');
  }, function(){ // Hover off event
     $(this).attr('title', $(this).data('tiptext'));
    $('.tooltip').remove(); 
  }).mousemove(function(e){ // Mouse move event
     $('.tooltip')
      .css('top', (e.pageY - 0) + 'px')
      .css('left', (e.pageX + 5) + 'px');
 });
});
//]]>
</script>

* الكلمات المحددة بالأصفر هي عناصر رئيسية للقوالب إذا أردت إضافة عنصر ليطبق مثل Popularpost أضفه في أول السطر أو بين الكلمات مثال

 $('Here The Name,a,img,input,.menu,.close-menu,.outer-post,img.related-post-item-thumbnail,')

كما ترون ولتوضيح فقط أضفت كلمة Here The Name في الأول مع الفاصلة

لتطبيق التلميح على صورة أو كلمة معينة عليك بإدراج   ' هنا الكلمة'=Title

مثال

<img border="0" src="رابط الصورة" title="شكرا لكم">

التيتل يضاف كما في الكود المحدد باللون الأصفر

أتمنى أن تستفيدو من الإضافة وماتقدمه أي سؤال يمكن طرحه في خانة التعليقات
ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 11 تعليقًا:

  1. موضوع ممتاز ,,استمر

    ردحذف
  2. أخي عندي قالبك القديم الأبيض فيه الإبتسامات ولاكن لا تضهر هذه الصورة http://im81.gulfup.com/SimniX.png
    فوق التعليقات ممكن الطريقة لأإضافة الصورة
    وشكرا

    ردحذف
  3. القالب لا يتوفر على الكود الخاص بالإبتسامات

    ردحذف
  4. شكراً عرب ويب شكراً حسام :)

    هل من الممكن طرح موضوع حول اضافة تأثيرات عند الضغط أو التمرير على عنوان الموضوع ؟ للتوضيح أكثر ادخل إلى موقعي أخ حسام http://www.ebda2.net/ ثم مرر الماوس على أحد العنوان تجد تغير اللون ببطىء إلى اللون الأزرق هل من الممكن أن تشرح لنا اضافة تأثيرات أخرى ؟

    تحياتي لك

    ردحذف
    الردود
    1. إنشاء الله كل شيئ ووقته

      حذف
  5. اخي ممكن شرح overlay
    لصور المواضيع بالرئيسية
    وشكرا لك

    ردحذف
  6. السلام عليكم اخي العزيز شرح وافي جزاك الله خير الله يحفظك عندي سؤال مافهمت النقطة الاخيرة كيف اعمل تلميح لكلمة معينة في موضوع او مشاركة مكن تفهمني وتجبلي طريقة مبسطة الله يجزيك االخير

    ردحذف
    الردود
    1. عليكم السلام اخي، أترك مثال تريد تطبيق عليه التلميح حتى أريك بشكل أفضل

      حذف
  7. مثلاً على الاقسام تبع المدونة

    ردحذف

عن الكاتب :

إرشادات

    تحميل الملفات

    نستخدم بمدونتنا مواقع مختلفة في رفع الملفات ونوفر منها إثنان:
  • موقع : Mediafire
  • موقع :file-upload
  • باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
  • تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
  • كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
  • إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.
  • أين تجدنا؟

    بعيدا عن الصفحات المزورة أو المزيفة التي يحاول البعض من خلالها استغلال جهود فريق عمل عرب ويب، هذه هي حساباتنا وصفحاتنا الرسمية في الشبكات الاجتماعية، لا نمتلك سوى هذه الصفحات والحسابات وهي الوحيدة التي تتبع للمدونة : https://www.instagram.com/ar1web

    كلمة الختام

    في مدونة عرب ويب نسعى دوما جاهدين للتحسن والتقدم وليس ما تراه هو حدودنا! ونحن نقدر كثيرا زوارنا وآراؤهم فإن كان لديك أي اقتراح/نصيحة/ومضة مفيدة/نقد بناء أو ما إلى ذلك يمكنك مشاركتنا كل ما في جعبتك من خلال الإتصال بنا : istoretech3@gmail.com
أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم