مدونة ماي تكنولوجي M T B

<style>
@charset "utf-8";
/* CSS Document */
.lof-slidecontent, .lof-slidecontent a {
 color:#FFF;
}
.lof-slidecontent a.readmore{
 color:#58B1EA;
 font-size:95%;

}
.lof-slidecontent{
 position:relative;
 overflow:hidden;
 border:#F4F4F4 solid 1px;
}
.lof-slidecontent .preload{
 height:100%;
 width:100%;
 position:absolute;
 top:0;
 left:0;
 z-index:100000;
 text-align:center;
 background:#FFF
}
.lof-slidecontent .preload div{
 height:100%;
 width:100%;
 background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%;
}
.lof-main-outer{
 position:relative;
 height:100%;
 width:800px;
 z-index:3px;
 overflow:hidden;
}

/*******************************************************/
.lof-main-item-desc{
 z-index:100px;
 position:absolute;
 bottom:50px;
 left:0px;
 width:350px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/bg_trans.png);
 height:100px;
 /* filter:0.7(opacity:60) */
 padding:10px;
}
.lof-main-item-desc p{
 margin:0 8px;
 padding:8px 0
}
.lof-main-item-desc h3{
 padding:0;
 margin:0
}
.lof-main-item-desc h2{
 padding:0;
 margin:15px 0 0 0px;
}
.lof-main-item-desc h3 a{
 margin:0;
 background:#C01F25;
 font-size:75%;
 padding:2px 3px;
 font-family:"Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif;
 text-transform:uppercase;
 text-decoration:none
}
.lof-main-item-desc h3 a:hover{

 text-decoration:underline;
}
.lof-main-item-desc h3 i {
 font-size:70%;
}

/* main flash */
ul.lof-main-wapper{
 /* margin-right:auto; */
 overflow:hidden;
 background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%;
 padding:0px;
 margin:0   !important;
 position:absolute;
 overflow:hidden;
}

ul.lof-main-wapper li{
 overflow:hidden;
 padding:0px   !important;
 margin:0px;
 float:left;
 position:relative;
}
.lof-opacity  li{
 position:absolute;
 top:0;
 left:0;
 float:inherit;
}
ul.lof-main-wapper li img{
 padding:0px  !important;
}

/* item navigator */
.lof-navigator-wapper {
 position:absolute;
 bottom:10px;
 right:10px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/transparent_bg.png) repeat;
 padding:5px 0px;
}
.lof-navigator-outer{
 position:relative;
 z-index:100;
 height:180px;
 width:310px;
 overflow:hidden;
 color:#FFF;
 float:left
}
ul.lof-navigator{
 top:0;
 padding:0;
 margin:0;
 position:absolute;
 width:100%;
 background:none !important;
 margin-top: 0 !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
}
ul.lof-navigator li{
 cursor:hand !important;
 cursor:pointer !important;
 list-style:none !important;
 padding:0 !important;
 margin-left:0px !important;
 overflow:hidden !important;
 float:left !important;
 display:block !important;

 text-align:center !important;

}
ul.lof-navigator li img{
 border:#666 solid 3px;
}
ul.lof-navigator li.active img, ul.lof-navigator li:hover img {
 border:#A8A8A8 solid 3px;
}
.lof-navigator-wapper .lof-next,  .lof-navigator-wapper .lof-previous{
 display:block;
 width:22px;
 height:30px;
 color:#FFF;
 cursor:pointer;

}
.lof-navigator-wapper .lof-next {
 float:left;
 text-indent:-999px;
 margin-right:5px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-l.png) no-repeat right center;
}
.lof-navigator-wapper .lof-previous {
 float:left;
 text-indent:-999px;
 margin-left:5px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-r.png) no-repeat left center;
}
#lofslidecontent45 {width:880px;height:340px;}
.lof-main-outer {width:880px; height:340px;}

.lof-main-wapper img {height:340px !important; width:880px !important}
.lof-navigator-wapper img {height:32px !important; width:80px !important}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/jquery.easing.js"></script>
<script language="javascript" type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/scriptlofblogv2.js"></script>
<script type="text/javascript">
 $(document).ready( function(){
  var buttons = { previous:$('#lofslidecontent45 .lof-previous') ,
      next:$('#lofslidecontent45 .lof-next') };

  $obj = $('#lofslidecontent45').lofJSidernews( { interval : 4000,
            direction  : 'opacitys',
             easing   : 'easeOutBounce',
            duration  : 1200,
            auto    : true,
            maxItemDisplay  : 4,
            navPosition     : 'horizontal', // horizontal
            navigatorHeight : 32,
            navigatorWidth  : 80,
            mainWidth:880,
            buttons   : buttons} );
 });
</script>

<data:post.body/>

<!-- http://www.pergola-aluminium.org adsense in post mod. START -->
<b:if cond='data:blog.pageType == "item"'> <b:if cond='data:post.includeAd'> <data:adEnd/> <font size="0"><a href="http://www.nuancier-peinture.org">nuancier peinture</a></font><data:adCode/> <data:adStart/> </b:if> </b:if>
<!--  http://www.pergola-aluminium.org  adsense in post mod. END -->

<data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div expr:id='"aim1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">

ضع كود أدسنس هنا،بعد تحويله

</div>
<div expr:id='"aim2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script><font size="0"><a href=" http://www.pergola-aluminium.org ">monte escalier</a></font>

</b:if>

<data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
هنا تضع كود إعلان أدسنس.
</b:if>

<data:post.body/>

<div expr:id='"aim1" + data:post.id'></div>

<div style="clear:both; margin:10px 0">

<!-- AdSense code -->

</div>

<div expr:id='"aim2" + data:post.id'>

<data:post.body/>

</div>

<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>

<!-- adsense -->

اذهب إلى تحرير HTML وعلم على توسيع قوالب عناصر واجهة المستخدم وابحث عن :

أضف قبلها مباشرة :

الآن ابحث عن :

                                                               <data:post.body/>

(إذا وجدت كودين فالثاني هو المقصود) وأضف بعده :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<h2>قد يهمك أيضا :<div style='display:none;'> <b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=3&quot;' type='text/javascript'/></b:if></b:loop></div> </h2>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script>
</div>
</b:if>

الكود الأحمر لإظهار الأداة في صفحات المواضيع فقط
max-results=3 لتحديد عدد المواضيع ذات الصلة المراد عرضها بالأداة

لإضافة خلفية عبارة عن صورة فقط :
غير الكود التالي :

كود:

background:#EEEEEE  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwzaM0QZye6p58NiCaQpSh7DX09Vtq3WzyIoJOiER05ORMuv9I8lHZfQQLS0NDBu3qH6sEioFg3H53T0Hw0hLmNen5snVj4C3gFnjbAa5f0ET9jrgM4nSTXONDR6FNx_ZGAKPEA7VPpmw/s0/widget-title-bg.png)  right top repeat-y;

إلى :

كود:

background:url("رابط الخلفية") ;

مع تغيير ما يلزم تغييره

لتغيير صورة السهم بصورة أخرى :
غير الرابط التالي :

كود:

http://i263.photobucket.com/albums/ii150/mohamedrias/newconcept_bullet.png

برابط الصورة المراد عرضها