منتديات الهجان
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

منتديات الهجان


 
الرئيسيةأحدث الصورالتسجيلدخول

 

 سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين)

اذهب الى الأسفل 
كاتب الموضوعرسالة
الهجان
مستر وليد فريد
مستر وليد فريد
الهجان


ادعية لوجة الله : هوا الله
السرطان ذكر
عدد المساهمات : 4697
تاريخ الميلاد : 04/07/1975
تاريخ التسجيل : 21/09/2009
العمر : 48

سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين) Empty
مُساهمةموضوع: سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين)   سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين) Icon_minitimeالأحد يونيو 01 2014, 18:04

بسم الله والصلاة والسلام على رسول الله , مرحبا بكم اخواني في كل جديد من مدونة جلال البعداني , اليوم باذن الله سوف سنتظرق الى كيفية اضافة سكريبت سلايد شو احترافي (سلايد شو قالب ليوماجازين) لمدونات بلوجر بطريقه سهله ومضمونه , طبعا هذا السلايد شو غني عن التعريف فمعظم المدونين يعرفونه , مايميز هذا السلايد شو انه يضفي لمسة جميلة على المدونات حيث يساهم بشكل كبير في إثارة انتباه الزائر إلى أكثر المواضيع أهمية في المدونه , ومن مميزاته ايضا انه يقوم بعرض اخر مواضيع المدونه بطريقه تلقائيه بشكل دون الحاجه الى ادراج روابط وصور المواضيع فيه, الأمر بسيط جدا و سأحاول تبسيطه أكثر قدر الإمكان ان شاء الله
سلايد شو احترافي

سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين) %D9%81%D9%87%D8%B1%D8%B3


۞مشاهدة مثال حي للسلايدر شو ◄

كيفية اضافة هذه الاداه الى مدوناتكم
1- من لوحة التحكم -> قالب -> تحرير HTML
2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات
3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)


كود بلغة HTML:

الكود:
]]></b:skin>


** والصق الكود التالي قبله تمامآ

كود بلغة HTML:
الكود:
.mainSlideshows {
width: 628px !important;height: 460px;margin-bottom: 20px;
position: relative;border: none;padding:10px;background:#fff;overflow:hidden;
}.mainSlideshows .sliderloader {position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
#featuredPosts {overflow: hidden;height: 350px;width:628px;}
#featuredPosts .slide {display: none;position: relative;
width:628px;height:350px;}
#featuredPosts .slide img {float: left;width:628px;height:350px;}
#featuredPosts .slide .text {position: absolute;bottom: 0px;
left: 20px;z-index: 2;}
#featuredPosts .slide .text p {margin: 0px 60px 0px 0px;padding: 10px;}
#featuredPosts .slide .text h3 {font-size:16px;font-weight:bold;
text-shadow: 1px 1px 1px #017bb4;
margin: 0;padding: 10px;display: inline-block;
position: relative;top: 0px;}
#featuredPosts .slide .overlay {
position: absolute;top: 0;bottom: 0;left: 0;right: 0;z-index: 1;}
#featuredThumbs {position: relative;padding: 0px 20px;height:110px;}
#featuredThumbs ul {margin: 0;padding: 0;list-style: none;}
#featuredThumbs li {margin: 15px 14px 15px 0;padding: 0;
list-style: none;float: left;width:105px;max-width:105px;height:80px;
overflow:hidden;}
#featuredThumbs li img {float: left;cursor: pointer;
filter: grayscale(100%);-moz-filter: grayscale(100%);
-webkit-filter: grayscale(100%);width:105px;max-width:105px;
height:80px;border-radius: 0px;box-shadow: none;}
#featuredThumbs li img:hover, #featuredThumbs li.active-slide img {
filter: none;-moz-filter: none;-webkit-filter: none;width:105px;
max-width:105px;}
#featuredThumbs ul.direction-nav {}
#featuredThumbs ul.direction-nav li {margin: 0;}
#featuredThumbs ul.direction-nav li a {
display: block;width: 15px;height: 15px;text-indent: -9999px;
position: absolute;top: 50px;right: -10px;padding:5px 2px;}
#featuredThumbs ul.direction-nav li a.prev {left: -10px;right: 620px;}
#featuredThumbs ul.direction-nav li a:hover {
opacity: .7;filter: alpha(opacity=70);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";}
#featuredPosts .slide .text, #featuredPosts .slide .text a {color: #fff;}
#featuredPosts .slide .text p {color:#FFF;text-shadow: 1px 1px #000;
background: rgba(0, 0, 0, 0.8);padding: 10px;}
#featuredPosts .slide .text h3 {background:  #21b8ff;}
#featuredThumbs {
background: url(http://1.bp.blogspot.com/-tDWd0SAj38I/Uj89zgOoX7I/AAAAAAAABZE/4Ni53xcrcDs/s1600/sliderThumbs.png) repeat-x top;}
#featuredThumbs ul.direction-nav li .prev {
background: #fff url(http://2.bp.blogspot.com/-pvUlBeVu-7Q/Uj7rBJv0JbI/AAAAAAAABUQ/zxL4ELr2p2A/s1600/slider-arrows-prev.png) no-repeat center center;}
#featuredThumbs ul.direction-nav li .next {
background: #fff url(http://3.bp.blogspot.com/-DENPdodM1g4/Uj7rAo7QosI/AAAAAAAABUI/NNfOg-wxsvY/s1600/slider-arrows-next.png) no-repeat center center;}
.mainSlideshows .preloader {
background: url(http://2.bp.blogspot.com/-QXCSajkIjp4/Uj7qGpi7jII/AAAAAAAAA-8/At7D9Hz1_7Q/s1600/ajax-loader.gif) center center no-repeat;
}

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

كود بلغة HTML:

الكود:
</head>


** والصق الكود التالي قبله مباشره (فوقه)

كود بلغة HTML:
الكود:
<script src='http://dl.dropboxusercontent.com/s/qd713000d962kms/jquery.flexslider-rtl.js' type='text/javascript'/>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1' type='text/javascript'></script>

وبالاخير قم بالبحث عن


كود بلغة HTML:
الكود:
<div id='main-wrapper'>

واذا لم تجده قم بالبحث عن احد الاكواد التاليه


كود بلغة HTML:
الكود:
<div id='main-wrapper'>
              او
    <div id='content'>
              او
    <div id="content"></div>
              او
    <div class='column-center-inner'>


** و الصق الكود التالي بعده/أسفله :


الكود:
كود بلغة HTML:

 <b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='mainSlideshows clearfix mainBorder' id='mainSlideshows'>
    <script>
//<![CDATA[
function labelthumbs(json) {
    document.write('<div class="clearfix" id="featuredPosts"><div class="preloader"></div><div class="slides">');
    for (var i = 0; i < numposts; i  ) {
        var entry = json.feed.entry[i];
        var posttitle = entry.title.$t;
        var posturl;
        if (i == json.feed.entry.length) break;
        for (var k = 0; k < entry.link.length; k  ) {
            if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
                var commenttext = entry.link[k].title;
                var commenturl = entry.link[k].href;
            }
            if (entry.link[k].rel == 'alternate') {
                posturl = entry.link[k].href;
                break;
            }
        }
        var thumburl;
        try {
            thumburl = entry.gform_foot.url;
        } catch (error) {
            s = entry.content.$t;
            a = s.indexOf("<img");
            b = s.indexOf("src=\"", a);
            c = s.indexOf("\"", b   5);
            d = s.substr(b   5, c - b - 5);
            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
                thumburl = d;
            } else thumburl = 'http://3.bp.blogspot.com/-O-vjxP03hYo/UXVtH90_iQI/AAAAAAAAAG4/60hz9Rn5FWA/s1600/No Image 1.gif';
        }
        var postdate = entry.published.$t;
        var cdyear = postdate.substring(0, 4);
        var cdmonth = postdate.substring(5, 7);
        var cdday = postdate.substring(8, 10);
        var monthnames = new Array();
        monthnames[1] = "Jan";
        monthnames[2] = "Feb";
        monthnames[3] = "Mar";
        monthnames[4] = "Apr";
        monthnames[5] = "May";
        monthnames[6] = "June";
        monthnames[7] = "July";
        monthnames[8] = "Aug";
        monthnames[9] = "Sept";
        monthnames[10] = "Oct";
        monthnames[11] = "Nov";
        monthnames[12] = "Dec";
        document.write('<div class="slide"><img src="'   thumburl   '" alt="'   posttitle   '"><div class="text"><h3><a href="'   posturl   '">'   posttitle   '</a> </h3><p>');
        if ("content" in entry) {
            var postcontent = entry.content.$t;
        } else
        if ("summary" in entry) {
            var postcontent = entry.summary.$t;
        } else var postcontent = "";
        var re = /<\S[^>]*>/g;
        postcontent = postcontent.replace(re, "");
        if (showpostsummary == true) {
            if (postcontent.length < numchars) {
                document.write('');
                document.write(postcontent);
                document.write('');
            } else {
                document.write('');
                postcontent = postcontent.substring(0, numchars);
                var quoteEnd = postcontent.lastIndexOf(" ");
                postcontent = postcontent.substring(0, quoteEnd);
                document.write(postcontent   '...');
                document.write('');
            }
            document.write('</p></div><div class="overlay"></div></div>');
        }
        var towrite = '';
        var flag = 0;
        document.write(towrite);
        document.write('');
        if (displayseparator == true)
            if (i != (numposts - 1))
                document.write('');
    }
    document.write('</div></div>');
}
//]]>
</script>
<script type='text/javascript'>
var numposts = 20;
var showpostthumbnails = false;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;
</script>
<script src='/feeds/posts/default/?published&alt=json-in-script&callback=labelthumbs' type='text/javascript'/>

    <script>
//<![CDATA[
function labelthumbs(json) {
 document.write('<div class="clearfix" id="featuredThumbs"><ul class="slides">');
    for (var i = 0; i < numposts; i  ) {
        var entry = json.feed.entry[i];
        var posttitle = entry.title.$t;
        var posturl;
        var postauthor = entry.author[0].name.$t;
        if (i == json.feed.entry.length) break;
        for (var k = 0; k < entry.link.length; k  ) {
            if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
                var commenttext = entry.link[k].title;
                var commenturl = entry.link[k].href;
            }
            if (entry.link[k].rel == 'alternate') {
                posturl = entry.link[k].href;
                break;
            }
        }
        var thumburl;
        try {
            thumburl = entry.gform_foot.url;
        } catch (error) {
            s = entry.content.$t;
            a = s.indexOf("<img");
            b = s.indexOf("src=\"", a);
            c = s.indexOf("\"", b   5);
            d = s.substr(b   5, c - b - 5);
            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
                thumburl = d;
            } else thumburl = 'http://3.bp.blogspot.com/-O-vjxP03hYo/UXVtH90_iQI/AAAAAAAAAG4/60hz9Rn5FWA/s1600/No Image 1.gif';
        }
        var postdate = entry.published.$t;
        var cdyear = postdate.substring(0, 4);
        var cdmonth = postdate.substring(5, 7);
        var cdday = postdate.substring(8, 10);
        var monthnames = new Array();
        monthnames[1] = "Jan";
        monthnames[2] = "Feb";
        monthnames[3] = "Mar";
        monthnames[4] = "Apr";
        monthnames[5] = "May";
        monthnames[6] = "June";
        monthnames[7] = "July";
        monthnames[8] = "Aug";
        monthnames[9] = "Sept";
        monthnames[10] = "Oct";
        monthnames[11] = "Nov";
        monthnames[12] = "Dec";
        document.write('<li><img alt="'   posttitle   '" src="'   thumburl   '" title="'   posttitle   '"/></li>');
        if ("content" in entry) {
            var postcontent = entry.content.$t;
        } else
        if ("summary" in entry) {
            var postcontent = entry.summary.$t;
        } else var postcontent = "";
        var re = /<\S[^>]*>/g;
        postcontent = postcontent.replace(re, "");
        var towrite = '';
        var flag = 0;
    }
 document.write('</ul></div>');
}
//]]>
</script>
<script type='text/javascript'>
var numposts = 10;
</script>
<script src='/feeds/posts/default/?published&alt=json-in-script&callback=labelthumbs' type='text/javascript'/>



</div><!--End SlideShow-->          
<script type='text/javascript'>
jQuery(document).ready(function($) {
    jQuery('#featuredThumbs').flexslider({
        namespace: "",
        animation: "slide",
        asNavFor: '#featuredPosts',
        slideshow: false,
        controlNav: false,
        itemWidth: 105,
        itemMargin: 11,
        minItems: 2,
        maxItems: 6
    });
    jQuery('#featuredPosts').flexslider({
       namespace: "",
        selector: ".slides > .slide",
        animation: "slide",
        sync: '#featuredThumbs',
        slideshowSpeed: 5000,
        animationSpeed: 900,
        animationLoop: true,
        slideshow: true,
        controlNav: false,
        directionNav: false,
        start: function(slider) {
            jQuery('.preloader').hide();
            jQuery('#featuredThumbs').show();
      }
    });
});
</script></b:if>



وبالاخير قم بحفظ القالب وتمتع بمشاهدة السلايدرشو وهو يعرض اخر مواضيع مدونتك بطريقه تلقائيه وبدون بذل اي جهد او تعب من قبلك


وكالعاده اذا واجهتكم اي مشاكل في تركيب السلايدرشو ضعوا تعليق وسيتم الرد عليكم ان شاء الله .....
المرفقات
سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين) Attachmentالسلايد شو.zip
لا تتوفر على صلاحيات كافية لتحميل هذه المرفقات.
(4 Ko) عدد مرات التنزيل 2
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://waled6662003.yoo7.com
 
سلايدشو احترافي يقوم بعرض مواضيع المدونه تلقائيا (سلايدشو ليوماجازين)
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
»  طريقة نشر مواضيع المدونة تلقائيا على المواقع الإجتماعية كالفيس بوك و التويتر
» [ شرح ] حذف رسآئل البريد المزعجة +18 تلقائيا / حذف رسائل البريد +18 تلقائيا
»  كيفية تركيب هاك مواضيع قد تهمك أو مواضيع ذات صلة على مدونات البلوجر أسفل كل تدوينة مثل مدونة أفكار-برو
» هاك المدونه وهاك المجلة للنسخة الرابعة
»  اضافة شريط متحرك يضم اخر اخبار المدونه بثلاثة الوان احترافيه

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات الهجان :: ركن بلوجر :: قسم سلايد شو بلوجر-
انتقل الى: