شرح تركيب سلايدشو ليو ماجزين علي مدونة بلوجر

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

شرح تركيب السلايدشو 

1- html الذهاب الي لوحة تحكم بلوجر - ثم قالب -تحرير

2- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)

]]></b:skin>

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

 .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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYoPnGhmemPjPSchlcpwu1oPRCfQd_TgxohcXVDs0aaOLmly0V8r0B8ATblw4jQI4NFOTfv2BexzIgHwb7ygnPgwytdf0b7FCfzyPxOYfbhPCnzjxeigQyMXB8OEHhjdQxn0Hn6Zm-J35u/s1600/sliderThumbs.png) repeat-x top;} #featuredThumbs ul.direction-nav li .prev { background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkC5pqEefZHdPhDbH29GQPfhgkD-pjTMP6nzY2LpJMnOsZ_yuYCNYqgkfJh_S9O1pxyDJV3TFdfOzTovDyqMdsgug1BzhEK3Q5mtO1FfiYyVS6Cxn04ofAS_UoVLMSxaHUDpzrKZKU0kYA/s1600/slider-arrows-prev.png) no-repeat center center;} #featuredThumbs ul.direction-nav li .next { background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFmBRGRJB2AzCCGc-8BSGbO-BOeTqj2onQ3uJIdGq2eJvdI43Wk03N_fFeeha3iyv80G-pF6Qa1N5ciCE6SX-wDvle22Tg-hWxVdGSbpoJI-HUfYftO_Nq6JHPziB1oon1nX7Idg7zQV82/s1600/slider-arrows-next.png) no-repeat center center;} .mainSlideshows .preloader { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjak3SJZUdyJy6OmQ6MHPM6Crl1V1N0xAaPE-Es-VGwkEzpDfxrgyfuX0BZ1tib-P0PBKcwcAPLY_cM-S2MkAnWAKwS4-FtSbzkCGXybZAuA_IDYxVVE1HEtR4ZPcFPaAWqU6fDZ1qbry8P/s1600/ajax-loader.gif) center center no-repeat; }

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

</head> 

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

<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>

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

<div id='main-wrapper'>

والصق الكود التالي اسفله

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

في اداة جافا اسكربت 

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<div class='mainSlideshows clearfix mainBorder' id='mainSlideshows'>

<div class='clearfix' id='featuredPosts'>

<div class='preloader'/><!--End Loading-->

<div class='slides'> <script src='http://yourjavascript.com/9138228314/slide1.js'/>  <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='http://alb33dani.com/feeds/posts/default/?published&amp;alt=json-in-script&amp;callback=labelthumbs' type='text/javascript'/>

</div><!--End Slides-->

</div><!--End featured Posts-->

<div class='clearfix' id='featuredThumbs'>

<ul class='slides'>

<script src='http://yourjavascript.com/1391494332/slide2.js'/>

<script type='text/javascript'>

var numposts = 10;

</script>

<script src='http://2mrweb.blogspot.com/feeds/posts/default/?published&amp;alt=json-in-script&amp;callback=labelthumbs' type='text/javascript'/>

</ul>

</div>

</div><!--End SlideShow-->          

<script type='text/javascript'>

jQuery(document).ready(function($) {

    jQuery(&#39;#featuredThumbs&#39;).flexslider({

        namespace: &quot;&quot;,

        animation: &quot;slide&quot;,

        asNavFor: &#39;#featuredPosts&#39;,

        slideshow: false,

        controlNav: false,

        itemWidth: 105,

        itemMargin: 11,

        minItems: 2,

        maxItems: 6

    });

    jQuery(&#39;#featuredPosts&#39;).flexslider({

       namespace: &quot;&quot;,

        selector: &quot;.slides &gt; .slide&quot;,

        animation: &quot;slide&quot;,

        sync: &#39;#featuredThumbs&#39;,

        slideshowSpeed: 5000,

        animationSpeed: 900,

        animationLoop: true,

        slideshow: true,

        controlNav: false,

        directionNav: false,

        start: function(slider) {

            jQuery(&#39;.preloader&#39;).hide();

            jQuery(&#39;#featuredThumbs&#39;).show();

      }

    });

});

</script></b:if>

والان عليك استبدل رابط موقعنا برابط موقعك 

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