المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : إضافة سلايد شو بتقنية جديدة لمدونة blog بلوجر



romaissa
11-01-2013, بتوقيت غرينيتش 08:19 AM
السلام عليكم

كثير من زوار موقعي و مدونتي
M4st3r7o1c.com | Movies (http://www.M4st3r7o1c.com)

سألوني عن السلايد شو الموجود في الموقع
ورغبتهم بإستخدامه في المدونات الخاصه بهم على بلوجر بشكل خاص
لان السلايد شو شبه منعدم وغير موجود لصعوبة تركيب installه

اليوم حبيت انزله هدية لجميع اعضاء المنتدى forum و الزوار
وتسهيل عملية تركيب installه بخطوات بسيطة توفر عليك الكثير من التعقيد الحقيقي


اولاً خواص السلايد شو :
1- طريقة عمل السلايد شو مختلفه كلياً عما رأيته في المواقع
1- يحتوي على 5 صور "( 5 خانات )"
2- يحتوي على طريقة عرض صور مصغره لكل صورة داخل السلايد بشكل احترافي
3- امكانية تغيير الصور و الذهاب للصور التالية او العودة للصورة السابقة
4- إظهار كلمات توضيحيه على كل صورة بشكل جذاب وامكانية ازالة هذي الخاصيه
5- امكانية وضع السلايد شو في اي مكان سواء كان في منتدى او مدونة blog

*# صور : ولاكن شاهد المثال المباشر #* < اذكر الله
https://lh6.googleusercontent.com/-Zt5vsi9gT2o/UOurNFRaRrI/AAAAAAAAA-U/91ylXyPCflM/s800/example.jpg


*# مثال مباشر على سلايد شو Slider #* < اذكر الله
www.M4st3r7o1c.com (http://m4st3r7o1c.com/dl/slider-1/index.htm)


كيفية التركيب install :
تنبيه : قم بأخذ نسخه احتياطية من القالب template قبل التعديل .

اولاً : قم بالذهاب إلى مدونتك في بلوجر >> قالب template >> تحرير HTML
1- اختر &quot;( توسيع قوالب عناصر واجهة interface المستخدم )&quot;
2- إبحث عن
رمز Code:
</head>
3- الصق الكود code التالي فوق الكلمة اللتي بحثنا عنها
رمز Code:
<!-- Start Slider HEAD section (www.M4st3r7o1c.com) --> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/CODES/style.css&quot; /> <style type=&quot;text/css&quot;>a#vlb{display:none}</style> <script type=&quot;text/javascript&quot; src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/CODES/jquery.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/CODES/slider.js&quot;></script> <!-- End Slider HEAD section (www.M4st3r7o1c.com) -->
ثم قم بالحفظ &quot;(

ثانياً : انسخ الكود code التالي وضعه في المكان اللي ترغب ان يظهر فيه السلايد شو

رمز Code:
<!-- Start Slider BODY section (www.M4st3r7o1c.com) --> <div id=&quot;wowslider-container1&quot;> <div class=&quot;ws_images&quot;> <a href=&quot;http://m4st3r7o1c.com&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/images/img1.jpg&quot; alt=&quot;IMG1&quot; title=&quot;الصورة الاولى&quot; id=&quot;wows0&quot;/></a> <a href=&quot;http://m4st3r7o1c.com&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/images/img2.jpg&quot; alt=&quot;IMG2&quot; title=&quot;الصورة الثانية&quot; id=&quot;wows1&quot;/></a> <a href=&quot;http://m4st3r7o1c.com&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/images/img3.jpg&quot; alt=&quot;IMG3&quot; title=&quot;الصورة الثالثة&quot; id=&quot;wows2&quot;/></a> <a href=&quot;http://m4st3r7o1c.com&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/images/img4.jpg&quot; alt=&quot;IMG4&quot; title=&quot;الصورة الرابعة&quot; id=&quot;wows3&quot;/></a> <a href=&quot;http://m4st3r7o1c.com&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/images/img5.jpg&quot; alt=&quot;IMG5&quot; title=&quot;الصورة الخامسة&quot; id=&quot;wows4&quot;/></a> </div> <div class=&quot;ws_bullets&quot;><div> <a href=&quot;#wows0&quot; title=&quot;IMG1&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/tooltips/img1.jpg&quot; alt=&quot;IMG1&quot;/>1</a> <a href=&quot;#wows1&quot; title=&quot;IMG2&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/tooltips/img2.jpg&quot; alt=&quot;IMG2&quot;/>2</a> <a href=&quot;#wows2&quot; title=&quot;IMG3&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/tooltips/img3.jpg&quot; alt=&quot;IMG3&quot;/>3</a> <a href=&quot;#wows3&quot; title=&quot;IMG4&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/tooltips/img4.jpg&quot; alt=&quot;IMG4&quot;/>4</a> <a href=&quot;#wows4&quot; title=&quot;IMG5&quot;><img src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/IMGS/tooltips/img5.jpg&quot; alt=&quot;IMG5&quot;/>5</a> </div></div> </div> <script type=&quot;text/javascript&quot; src=&quot;http://M4st3r7o1c.com/dl/slider-1/slider/CODES/script.js&quot;></script> <!-- End Slider BODY section (www.M4st3r7o1c.com) -->
التغييرات اللي راح تتم على الكود code هذا
1- غير رابط موقعي http://M4st3r7o1c.com اللي باللون الأزرق إلى رابط
موضوع او موقع او حتى ازالة فقط الرابط لإقاف عملية الروابط في السلايد شو

2- غير اول &quot;خمس&quot; روابط الصور اللي باللون الأحمر لـ روابط الصور الخاصه بك
ويجب ان تكون مقاسات الصورة هي &quot;( 600 عرض × 300 إرتفاع )&quot;

3- يوجد جمل مكتوب &quot;( الصور الاولى - الصورة الثانية الخ )&quot;
غيرها او احذفها فقط لإيقافها وعدم ظهور شيء .

4- غير جمل &quot;IMG1 - IMG2 الخ&quot; باللون الازق إلى جمل او كلمات توضيح للصور , او حذفها فقط لأيقاف عملية التوضيح

5- غير روابط الـ &quot;خمس&quot; صور اسف الكود code باللون الأحمر إلى روابط صورك



لاحظ ان هذه الصور هي صور مصغرة بحجم &quot;( 180 عرض × 90 إرتفاع )&quot;



انتهى الموضوع حول تركيب install السلايد شو .
الموضوع واضح وسهل وبسيط ولاكن يوجد امر مهم جداً
هو ان ملفات برمجة السلايد شو على موقعي , وإذا قدر الله
وتوقف موقعي لاي ضرف , اقدم لكم السلايد شو مرفق بالشرح طريقة في ملف مضغوط
يحتوي على الملفات البرمجية الخاصه بالسلايد شو , لرفعها على موقعك .

رابط التحميل : هنا < HERE (https://sites.google.com/site/m4st3r7o1c/Slider1-M4st3r7o1c.com.rar)



==========================================

ملاحظة : إذا كانت مدونتك تحتوي على سلايد شو من قبل او معرض صور , قد يسبب هذا
السلايد شو مشكلة في السلايد شو القديم او معرض الصور مع بقاء عمل هذا السلايد كما هو .



بالتوفيق ان شاء الله &quot;( المصدر : www.M4st3r7o1c.com (http://‬M4st3r7o1c.com) )&quot;





الصور المصغرة المرفقة http://www.traidnt.net/vb/attachments/680228d1357637350t-example.jpg (http://www.traidnt.net/vb/attachments/680228d1357637350-example.jpg)


https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى