سلايد شو مميز لعرض أحدث تدوينات بلوجر تلقائيا

السلام عليكم ورحمة الله وبركاته

سلايد شو رائع و مميز لعرض أحدث تدوينات بلوجر تلقائيا

سلايد شو مميز لعرض أحدث تدوينات بلوجر تلقائيا

فى هذة التدوينة أحببت أن أضع بين أيديكم هذة الإضافة الرائعة وهى سلايد شو لعرض أحدث تدوينات مدونتكم وإعطائها شكل أكثر جمالا

أولا : اذهب الى لوحة تحكم بلوجر واختر قالب ثم تحرير html

ثانيا : عن طريق الضغط على ctre + f إبحث عن هذا الكود

]]></b:skin>

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

.s3slider { 
margin:0 auto 10px; 
border:2px solid white; 
background:white none no-repeat 50% 50%; 
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4); 
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4); 
box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4); 
position:relative; 
overflow:hidden; 
} 
.s3slider.loading { 
background-image:url('data:image/gif;base64,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'); 
text-indent:-9999px; 
} 
.s3slider-content, 
.s3slider-content li { 
position:absolute; 
top:0; 
right:0; 
bottom:0; 
left:0; 
margin:0; 
padding:0; 
list-style:none; 
overflow:hidden; 
} 
.s3slider-content li { 
position:static; 
display:none; 
} 
.s3slider-content img { 
display:block; 
width:100%; 
height:100%; 
max-width:none; 
max-height:none; 
border:none; 
outline:none; 
padding:0; 
margin:0; 
} 
.s3slider-caption { 
position:absolute; 
right:0; 
bottom:0; 
left:0; 
height:auto; 
font:normal normal 11px/normal GESSTwoMediumRegular; 
color:white; 
background-color:black; 
opacity:.8; 
filter:alpha(opacity=80); 
padding:7px 10px 10px; 
display:none; 
} 
.s3slider-title, 
.s3slider-meta {display:block} 
.s3slider-title a { 
font-size:110%; 
font-weight:bold; 
color:white; 
text-decoration:none; 
} 
.s3slider-title a:focus, 
.s3slider-title a:hover {text-decoration:underline} 
.s3slider-meta-comment:before {content:" - "}

الآن إذهب الى تخطيط ثم إضافة أداة Html/javascript داخل الصندوق

وضع هذا الكود

<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<div id="s3slider-container">
 <div class="s3slider loading" style="width:420px;height:270px;">
 Memuat... 
 </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script>
var s3slider_config = {
 url: 'http://t3own.blogspot.com',
 numPost: 7,
 labelName: null,
 monthArray: [
 "Januari",
 "Februari",
 "Maret",
 "April",
 "Mei",
 "Juni",
 "Juli",
 "Agustus",
 "September",
 "Oktober",
 "November",
 "Desember"
 ],
 noImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC',
 newTabLink: false,
 containerId: 's3slider-container',
 slider: {
 width: 420,
 height: 270,
 timeOut: 4000
 }
};
</script> 
<script src="http://dte-project.googlecode.com/svn/trunk/blogger-s3slider.js"></script> 
</b:if>

الآن قم بتعديل

http://worldblogger22.blogspot.com  برابط مدونتك

 
numPost 7: عدد المواضيع التي تعرض في السلايدشو يمكنك تغيرها حسب رغبتك

width:420 : هو عرض السلايد شو يمكنك تعديله بما يناسب مدونتك

height:270 : هو طول السلايد شو غيره بما يناسبك

سلايد شو مميز لعرض أحدث تدوينات بلوجر تلقائيا

ليست هناك تعليقات:

اضافة تعليق

إنضم إلينا

المشاركات الشائعة

سلايد شو مميز لعرض أحدث تدوينات بلوجر تلقائيا

اطلع ايضا :

ليست هناك تعليقات:

اضافة تعليق

إنضم إلينا

المشاركات الشائعة