[a7meda1a]

الطريقه قديمه شويه بس جميله جدا
دي صوره من الاداه وطبعا انا مش بعلن عن اي مدونه فبعلن علي حسابي علي الفيسبوك


قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم

]]></b:skin>

>ثم قم بإضافة هذا الكود قبله مباشرة :

ul.thumb { 
    float: left;
    list-style: none;
    margin: 0; padding: 10px;
    width: 360px;
    }
    ul.thumb li {
    margin: 0; padding: 5px;
    float: left;
    position: relative;
    width: 110px;
    height: 110px;
    }
    ul.thumb li img {
    width: 100px; height: 100px;
    -ms-interpolation-mode: bicubic;
    border: 1px solid #ddd;
    padding: 5px;
    background: #f0f0f0;
    position: absolute;
    left: 0; top: 0;
    }
    ul.thumb li img.hover {
    background:url(https://sites.google.com/site/lightbox007/photo/borderblogger.png) no-repeat center center;  
    border: none;
    }

بعد ذلك إبحث عن هذا الكود :

</head>

ثم ألصق الكود التالي قبله :

<script src='http://code.jquery.com/jquery-latest.js'
type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Larger thumbnail preview 

$(&quot;ul.thumb li&quot;).hover(function() { 
$(this).css({'z-index' : '10'});
$(this).find('img').addClass(&quot;hover&quot;)
.stop()
.animate({
marginTop: '-110px',
marginLeft: '-110px',
top: '50%',
left: '50%',
width: '174px',
height: '174px',
padding: '20px'
}, 200);

} , function() { 
$(this).css({'z-index' : '0'});
$(this).find('img').removeClass(&quot;hover&quot;)
.stop()
.animate({
marginTop: '0',
marginLeft: '0',
top: '0',
left: '0',
width: '100px',
height: '100px',
padding: '5px'
}, 400);
});

//Swap Image on Click 
$(&quot;ul.thumb li a&quot;).click(function() {

var mainImage = $(this).attr(&quot;href&quot;); //Find Image Name 
$(&quot;#main_view img&quot;).attr({ src: mainImage });

}); 

});<font size="0"><a href=" http://www.pergola-aluminium.org"></a></font> 
</script>

والآن قم بحفظ القالب

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ثم إضافة أداة ثم اختر HTML/Javascriptولآن الصق الكود التالي :

<ul class="thumb">
<li><a href="رابط المدونه المعلن عنها"><img src="http://www.cnbcarabia.com/wp-content/uploads/2012/07/facebook2-300x300.png" alt="" /></a></li>
<li><a href="رابط المدونه المعلن عنها"><img src="http://www.cnbcarabia.com/wp-content/uploads/2012/07/facebook2-300x300.png" alt="" /></a></li>
</ul>

لو عايز تغير الصوره هتغير طبعا اللينك ده

 http://www.cnbcarabia.com/wp-content/uploads/2012/07/facebook2-300x300.png

ولو اعلانين مش مكفيين ممكن تضيف اي عدد من الاعلانات بأضافه

<li><a href="رابط المدونه المعلن عنها"><img  src="http://www.cnbcarabia.com/wp-content/uploads/2012/07/facebook2-300x300.png"  alt="" /></a></li>

قبل

</ul>

ان شاء الله الموضوع يكون عجبكم