Ads.

شرح إضافة سلايدر شو أنيق لمدونة على بلوجر

الكاتب :Herri Art يوم الثلاثاء، 11 يونيو، 2013 3 التعليقات

بسم الله الرحمان الرحيم ..،

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

أولا إفتح مدونتك و توجه إلى لوحة التحكم الخاص ببلوجر .

° تم التخطيط.
° ثم بإضافة أداة ~  HTML/JAVASCRIPT
° قم بنسخ هذ الكود و ضعه داخل الأداة التي قمت بفتحها .

-------------------------------------------------------------------------------------------------------------------------------------

<!--- Thesis Widget by  Herri-Art.blogspot.com --->
<style type='text/css'>
.btnt-slider {  margin: 30px auto;  max-width: 850px;  padding: 0 20px;  }
.rslides {  list-style: none outside none;  margin: 0 auto;  max-height: 400px;  max-width: 800px;    overflow: hidden;  padding: 0;  position: relative;  width: 100%; }
.rslides li {  -webkit-backface-visibility: hidden;  position: absolute; border: 5px solid #555; display: none;  left: 0;  top: 0; margin: 0; padding: 0; list-style: none; }
.rslides img {  display: block;  height: auto;  float: left;  width: 100%;  border: 0; margin: 0; max-width: 100%; }
ul.rslides .rslides_nav {  height: 30px;  position: absolute;  text-indent: -99999px;  top: 45%;  width: 30px;  z-index: 9999;  display: none; }
ul.rslides:hover .rslides_nav {  display: block;  }
.prev {  background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/btnt-custom-theme/arrows_zps95b22e18.png") repeat scroll 0 0 transparent;  float: left;  left: 15px;  }
.next {  background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/btnt-custom-theme/arrows_zps95b22e18.png") repeat scroll right 0 transparent;  float: right; right: 15px;  }
</style>
<script type='text/javascript'>
/*<![CDATA[*/
  $(function() {
    $(".rslides").responsiveSlides({
      auto: true,
      speed: 500,
      timeout: 3000,
      nav: true,
      pause: true,
      prevText: "Previous",
      nextText: "Next",
      navContainer: "ul.rslides",
    });
  });
/*]]>*/</script>
<a href="http://Herri-Art.blogspot.com" ></a>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src='https://dl.dropboxusercontent.com/u/36169749/scripts/widgets/btnt-responsive-slider.js' type='text/javascript'></script>
<div class="btnt-slider">
<ul class="rslides">
<li><a href="الرابط الاول"><img alt="عنوان الصورة" src="رابط الصورة الاولى " /></a></li>
<li><a href="الرابط الثاني"><img alt="عنوان الصورة" src="رابط الصورة الثانيه" /></a></li>
<li><a href="الرابط الثالث"><img alt="عنوان الصورة" src="رابط الصورة الثالثه" /></a></li>
<li><a href="الرابط الرابع"><img alt="عنوان الصورة" src="رابط الصورة الرابعه" /></a></li>
<li><a href="الرابط الخامس"><img alt="عنوان الصورة" src="رابط الصورة الخامسه" /></a></li>
</ul>
</div>
<!--- Thesis Widget by  Herri-Art.blogspot.com --->
<span style="float:right ; font-size: 10px; font-weight: normal; line-height: 0px; margin-top: 15px;">
 <a href="http://7loll.blogspot.com/2013/05/responsive-slider-widget-for-blogger.html" style="color: black;">احصل على الاضافه</a></span>
 -----------------------------------------------------------------------------------------------------------------------------
 

 التعديلات على الكود : 
اللون الاحمر : رابط الموضوع او الصفحة .
اللون الازرق : اسم الصورة او وصف الصورة .
اللون الاخضر : رابط الصورة .

ملاحظة : 
اذا اردت سلايد شو يظهر فقط في الصفحة الرئيسيه اتبع الاتي :

-----------------------------------------------------------------------------------------------------------------------------------
<b:if cond='data:blog.url == data:blog.homepageUrl'>
 <!-- ضع هنا كود سلايد شو لكي يظهر في الصفحة الرئيسيه -->
 </b:if> 
------------------------------------------------------------------------------------------------------------------------------------

إلى هنا إخواني أكون قد انتهيت من الشرح و مبرووك عليكم السلايدر شو ..

ولا تبخلوا علينا بطرح تسائلاتكم أو تعلياقاتكم " كلمة شكر تكفي" 

3 التعليقات:

NASSIRA EL BAHOUDI يقول...

XOKRAN AKHI ANA BILALPLZZ AKHI ORIDO ANA TO3ALIMANI TARI9AT ATAXJIL FI ADSENES RAJAAA2AN AKHIKH

Herri Art يقول...

أهلا وسهلا آخي بلالا ..، بإذن الله سوف أقوم بتغير شامل حول المدونة من ناحية القالب و الأقسام سوف أضع قسم خاص بأدسنس و الربح منه و المشاكل وكل شئ و إن شاء الله سوف أطرح شرح خصيصا لك عن كيفية التسجيل به و قبول موقعك به وكل شئ .

Princeo CoolO يقول...

شكرآ جزيلا اخى .. ولكن الا يتواجد هنالك سلايدر شو احترافى لعرض المواضيع تلقائيآ بدلا من اليدوى لانى بحثت كثيرآ ما وجدت الا القليل وغير احترافى بالمره ...

وهذه مدونتى
http://thaptalmbda89.blogspot.com/

إرسال تعليق