أضف خاصية الصور المنبثقة

الصور المنبثقة هي ميزة تتيح لزائريك رؤية صور مدونتك بحجمها الأصلي دون مغادرة المدونة, الشيء الذي يجعل الزائر مرتاح في تصفح مدونتك.

فدرس اليوم حول هذه الميزة  فهي سهلة جدا ولن تأخد الكثير من الوقت.

إضغط على الصورة لترى كيف ستصبح مدونتك بعد إضافة الكود 

نبدأ الشرح بإذن الله :

من لوحة تحكم المدونة توجه إلي تصميم ثم تحرير html

لا تنسي حفظ نسخة إحتياطية من القالب

ثم ضع خانة علي توسيع القوالب

ثم أضغط علي ctrl+F  "بحث"

أبحث عن الكود التالي :

</body>

بعد ذلك قم بإضافة الكود التالي قبله مباشرة

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>

<style type='text/css'>    /* jQuery lightBox plugin - Gallery style */    #gallery {        background-color: #444;        padding: 10px;        width: 520px;    }    #gallery ul { list-style: none; }    #gallery ul li { display: inline; }    #gallery ul img {        border: 5px solid #3e3e3e;        border-width: 5px 5px 20px;    }    #gallery ul a:hover img {        border: 5px solid #fff;        border-width: 5px 5px 20px;        color: #fff;    }    #gallery ul a:hover { color: #fff; }    </style><script src='http://lightboxabuiyad.googlecode.com/svn/jquery.lightbox-0.4.js' type='text/javascript'/><link href='http://dinhquanghuy.110mb.com/lightbox/jquery.lightbox-0.5.css' media='screen' rel='stylesheet' type='text/css'/><script type='text/javascript'>$(function() {$(&#39;a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)&#39;).lightBox();});</script>

إضغط على حفظ القالب، وإذهب إلى مدونتك للمعاينة وأعلمني بالنتائج.