إضافة سلايدشو يدوي واحترافي جميل جدا مقدمة من المحترف إسماعيل للمعلوميات فقط

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

شرح طريقة التركيب:

1. اذهب إلى لوحة التحكم ثم تحرير Html.
2. قم بالبحث عن الوسم ]]></b:skin> التالي  بإستعمال CTRL+F  .
3. ضع الكود التالي فوقه مباشرة . 

<pre data-codetype="HTMLku" title="HTML"><code class="language-markup"> <blockquote class="tr_bq"> <span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><style> .blog_featured_posts {display: inline-block;width: 1173px; margin: 3px;} .blog_featured_post {display: block;position: relative;float: right;overflow: hidden;height:334px;} .blog_featured_post.first {width: 43%;margin-left: 9px;} .blog_featured_post.second {width: 20.79%;margin-left: 9px;} .blog_featured_post.third, .blog_featured_post.fourth {width: 34.126%;height:163px;} .blog_featured_post.third {margin-bottom: 9px;} .blog_featured_post a {display: block;color: rgb(255, 255, 255);text-shadow: rgba(0, 0, 0, 0.498039) 0px 1px 1px;position: relative;vertical-align: bottom;z-index: 1;height:100%;} .blog_featured_post a:hover:before {opacity: 0.6;box-shadow: inset 0px -3px 200px 5px #000;} .blog_featured_post a:before {display: block;position: absolute;content: '';right: 0px;top: 0px;width: 100%;height: 100%;box-shadow: inset 0px -3px 37px 5px #000;opacity: 0.5;-webkit-transition: all 0.2s;transition: all 0.2s;} .blog_featured_post a .blog_contents {display: block;position: absolute;z-index: 5;bottom: 30px;right: 30px;left: 30px;font-weight:bold;text-transform: uppercase;line-height: 120%;-webkit-transition: all 0.2s;transition: all 0.2s;font-family: droid arabic kufi, sans-serif;} .blog_contents span {font-style: normal;display: block;position: absolute;bottom: 100%;padding: 5px 10px;letter-spacing: 0px;font-size: 15px;font-family: Lobster,ge_dinar_tworegular;line-height: 1;text-shadow: none;margin-bottom: 10px;background: #F74047;} .blog_contents span:after {content: "";border-style: solid;border-width: 21px 7px 21px;border-color: transparent;border-bottom-color: #F74047;left: -7px;bottom: 0;position: absolute;} .blog_contents span:before {content: "";border-style: solid;border-width: 21px 7px 21px;border-color: transparent;border-top-color: #F74047;right: -7px;top: 0;position: absolute;} .blog_featured_post a .blog_contents h3 {text-shadow: 2px 2px 4px black;padding: 8px 10px 9px;text-align: right;float: right;display: inline-block;background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;width:114%;opacity: 0.9;font-size:16px;font-family: Lobster,ge_dinar_tworegular; font-weight: normal;margin-right: -30px;} .blog_featured_post.first a .blog_contents h3 {text-shadow:2px 2px 4px black;padding: 8px 10px 9px;text-align:right;float:right;display:inline-block;background:rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;width:100%;opacity: 0.9;font-weight: normal;font-family: Lobster,ge_dinar_tworegular;margin-right:-30px;} .blog_featured_post .feat-img{width:100%;height:100%;background-size:cover;background-position:50%;}</style></span></blockquote> </code></pre>

1. الخطوة الثانية عليك نسخ الكود التالي ووضعه في اي مكان تريده في القالب 
2. و تستطيع حتى وضعه في التخطيط داخل html javascript .
3. هذا الكود لن أضعه في صندوق لكي ألون لكم الكلمات التي سوف تغيرونها
4. ولكي تكون أيظا سهولة في التركيب 

<div class='widget-content'>

<div class='blog_featured_posts' id='blog_featured_posts'>

<div class='ct-wrapper '>

<div class='blog_featured_posts'>

<div class='blog_featured_post third'><a href='http://www.opsdevme.me/2016/06/blog-post_7.html'><div class='blog_contents'><span>إضافات بلوجر</span><h3>إضافة أيقونات التواصل الاجتماعية بتأثيرات جميلة واحترافية

 </h3></div><div class='feat-img' style='background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3CjvNuDJN35RVsNQTcTzpWyBsIHqYusmiwndI-EoU_xefS2mjHw4ETZr6jeMyuQJt8NlB7zXSC6439hM75MuBGCMwK-mv2Etw6wkAqsqFQd54LxxThCY9voxYmrLFsXw4_vg0XfnwKcM/s1600/Capture.JPG);'/></a></div>

<div class='blog_featured_post third'><a href='http://www.opsdevme.me/2016/04/blog-post75.html'><div class='blog_contents'><span>فيسبوك</span><h3>كيف تكتب إسمك مزخرف على الفيس بوك بطريقة سهلة وبسيطة  </h3></div><div class='feat-img' style='background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm0o6brGjWAMjzBlV9QnaPzUdNNihbK_i6BrTrClocKirDinANSxXACTobFJj3-WaSzBxSwtcIopEk7nEzMYFE4V12M8pI1nkk7er8fvO41M5wFjlk9uVsUQRXv6Binw3y-4yUpHOuoXk/s1600/Capture%25D8%25B6.PNG);'/></a></div><div class='blog_featured_post third'><a href='http://www.opsdevme.me/2016/05/pes-2017.html'><div class='blog_contents'><span>ألعاب</span><h3> الإعلان عن لعبة كرة القدم PES 2017 وإليكم أول الصور والمعلومات</h3></div><div class='feat-img' style='background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji-VpwOQtpCibvxtVQngDzczrV0wAXhzF6j-xuz06cWfVpFIMt6G_w_0QIpyUboCRNbfl1JnB5He-bUoT2Rc0Ux8NuaTk20XJlZmsj7-teKnJQ50rNYqvjx5mps3Uoro-cpS8KDzs2eQ8/s1600/1773623b.jpg);'/></a></div></div></div></div>

</div>

تخصيص الإضافة:

قم بتغيير ما يلي:

الصورة

العنوان

التسمية

رابط الموضوع

1. قم بحفض العمل
2. مبروك عليك الإضافة

• إذا واجهتك أي مشكلة في الإضافة فلا تبخل بوضع تعليق وسنجيبك في أسرع وقت ممكن.