آخر الأخبار

الأحد، 6 ديسمبر 2015

كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر



زوار ومتابعي المدونة  الكرام 
أسعد الله أوقاتكم بكل خير ومحبة 

في درسنا اليوم سوف نتعرف على إضافة مهمة وجميلة وأحترافية ، إضافة المشاركات الأخير على شكل سلايد شو ، وهذه الأضافة تعرف زوار مدونتك بآخر مواضيع المدونة .



- طريقة التركيب :

1-ادخل إلى مدونتك ثم اختر لوحة التحكم .

2- اختر من لوحة التحكم قالب ثم أختر تحرير قالب .

3- إبحث عن الوسم :
]]></b:skin>

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

 /* START EasySlider By homeblog7.blogspot.com */

#slide-container {
    height: 360px;
    position: relative;
    width: 480px;
}

#slider {
    height: 360px;
    left: 25px;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    width: 480px;
    font-family: calibri;
}

.slide-desc {
    background: transparent url(http://i195.photobucket.com/albums/z105/dantearaujo/darkbg.png) repeat scroll 0 0;
    color: #FFFFFF;
    padding: 10px;
    position: absolute;
    right: 0px;
    text-align: left;
    top: 0;
    width: 200px;
    z-index: 99999;
}

.slide-desc h2 {
    display: block;
}

.crosscol .widget-content {
    position: relative;
}

#slider ul, #slider li,

#slider2 ul, #slider2 li {
    margin: 0;
    padding: 0;
    list-style: none;
}

#slider2 {
    margin-top: 1em;
}

#slider li, #slider2 li {
/*

define width and height of list item (slide)

entire slider area will adjust according to the parameters provided here

*/
    width: 480px;
    height: 360px;
    overflow: hidden;
}

#prevBtn, #nextBtn,

#slider1next, #slider1prev {
    display: block;
    width: 30px;
    height: 77px;
    position: absolute;
    left: -30px;
    text-indent: -9999px;
    top: 71px;
    z-index: 1000;
}

#nextBtn, #slider1next {
    left: 520px !important;
}

#prevBtn, #nextBtn, #slider1next, #slider1prev {
    display: block;
    height: 77px;
    left: 0;
    position: absolute;
    top: 132px;
    width: 30px;
    z-index: 1000;
}

#prevBtn a, #nextBtn a,

#slider1next a, #slider1prev a {
    display: block;
    position: relative;
    width: 30px;
    height: 77px;
    background: url(http://i195.photobucket.com/albums/z105/dantearaujo/prev.png) no-repeat 0 0;
}

#nextBtn a, #slider1next a {
    background: url(http://i195.photobucket.com/albums/z105/dantearaujo/next.png) no-repeat 0 0;
}

/* numeric controls */

ol#controls {
    margin: 1em 0;
    padding: 0;
    height: 28px;
}

ol#controls li {
    margin: 0 10px 0 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 28px;
    line-height: 28px;
}

ol#controls li a {
    float: left;
    height: 28px;
    line-height: 28px;
    border: 1px solid #ccc;
    background: #DAF3F8;
    color: #555;
    padding: 0 10px;
    text-decoration: none;
}

ol#controls li.current a {
    background: #5DC9E1;
    color: #fff;
}

ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus {
    outline: none;
}

/* END EasySlider By homeblog7.blogspot.com */ 

4- بعد ذلك ابحث عن الوسم :
</body>

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

 <!-- Start easy content slider by homeblog7.blogspot.com -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js' type='text/javascript'></script>
<script src='http://accordion-template.googlecode.com/svn/trunk/easySlider1.7.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
 $("#slider").easySlider({
 auto: true,
 continuous: true
 });
});
//]]>
</script>
<!-- End easy content slider by homeblog7.blogspot.com --> 

6-  بعد ذلك ادخل إلى تخطيط ثم إضافة أداة : HTML/JavaScript

7- ضع الكود التالي في صتدوق الأداة ثم إحفظ .

 <div id="slider">
<script style="text/javascript" src="https://googledrive.com/host/0BxFbqjck0GDdbmhVUUxnZG5qRmM"></script>
<script style="text/javascript">
 var numposts_gal = 6;
 var numchars_gal = 150;
 var random_posts = false; // random posts
</script>
<!-- replace with your web address (marked with red color) -->
<script src="http://homeblog7.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showgalleryposts&max-results=999999"></script>
</div> 

- التعديلات :
- استبدل رابط مدونتنا برابط مدونتك .
كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر
موضوع المشاركة: كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر 9 من خلال 10 وعلى أساس 10 تصنيف. 9 تعليقات المستخدمين.
  • تعليقات بلوجر
  • تعليقات الفيس بوك

0 Comments:

رسالة تنبيه
    يسعدنا تفاعلكم بالتعليق لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق :
    أن لا تضع أي روابط خارجية
    أي سؤال خارج محتوى التدوينة يرجى استخدام صفحة الدعم الفني
    صفحة الدعم الفني
  • أن يكون التعليق خاص بمحتوى التدوينة كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر
  • لإضافة كود حوله أولا بمحول الأكواد
انقرهنا لتحويل الكود

إرسال تعليق

Item Reviewed: كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر Description: كيفية أضافة المشاركات الأخير على شكل سلايد شو تلقائي مع جي كويري لمدونات بلوجر Rating: 5 Reviewed By: home blogger