اضافات بلوجر مميزة لعام 2018

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

في البداية سوف نضع لكم اهم الاضافات لعام 2018 وسوف يكون جزء ثاني انشاء اللة

1-اضافة سلايد شو احترافية slide show

تعد إضافة سلايد شو من أفضل إضافات بلوجر في القوالب بلوجر كم نعرف أن إضافة سلايد شو تتميز بمظهر احترافي في عرض تدوينات أعلى الصفحة الرئيسية .
شرح تفعيل أداء
1- تفتح أداء تحكم بلوجر
2-ثم نختار التخطيط
3- ثم إضافة أداء
4-ثم لصق كود
5-ثم وضع رابط موقع مكان لون احمر
6-ثم حفظ أداة

<style type="text/css">
#slides *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}
#slides ul{height:250px}
#slides li{width:49.9%;height:100%;position:absolute;display:none}
#slides li:nth-child(1), #slides li:nth-child(2), #slides li:nth-child(3), #slides li:nth-child(4){display:block}
#slides li:nth-child(1){left:0;top:0}
#slides li:nth-child(2){left:50.1%;width:24.8%;height:49.8%}
#slides li:nth-child(3){left:75.2%;width:24.8%;height:49.8%}
#slides li:nth-child(4){left:50.1%;top:50.2%;height:49.9%}
#slides a{display:block;width:100%;height:100%;overflow:hidden}
#slides img{display:block;width:100%;height:100%;border:0;padding:4px;background-color:#0097BD;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides .overlayx{width:100%;height:100%;position:absolute;z-index:2;background-image:url(http://softglad.at.ua/images/fadebg.png);background-position:50% 50%;background-repeat:repeat-x;border:4px solid #00BD79;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides h4{position:absolute;bottom:30px;margin:0;font-size:18px;font-family:Arial;left:0;padding:0 10px;color:white;z-index:3;line-height:20px;font-weight:normal}
#slides li:nth-child(2) h4,#slides li:nth-child(3) h4{font-size:13px;line-height:15px}
#slides .label_text{font-size:9px;color:white;bottom:10px;z-index:3;left:10px;font-family:Verdana,Geneva,sans-serif;position:absolute}
#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname{display:none}
#slides .overlayx,#slides li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
#slides li:hover .overlayx{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}
#buttons{margin: 5px auto;text-align: center;background:#00BD79;width: 10%;}
#buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}
#buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}
#buttons a#nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}
@media only screen and (max-width:600px){
  #slides ul{height:600px}
  #slides li:nth-child(1){width:100%;height:49.8%}
  #slides li:nth-child(2){top:50.2%;height:24.8%;left:0;width:49.8%}
  #slides li:nth-child(3){left:50.2%;top:50.2%;width:49.8%;height:24.8%}
  #slides li:nth-child(4){left:0;top:75.3%;height:24.8%;width:100%}
}
</style>
<div id="featuredpost"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://softglad.at.ua/widgets/slider.js" type="text/javascript"></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
FeaturedPost({
blogURL:"ضع رابط مدونتك هنا",
MaxPost:8,
idcontaint:"#featuredpost",
ImageSize:300,
interval:5000,
autoplay:true,
tagName:false
});
});
//]]>
</script>

إضافة صندوق تعليقات disqus مميز

قبل شرح دخول إلى رابط موقع من هنا

1-قم بتسجيل في الموقع عن طريق Facebook او Gmail

2- أختار إضافات المواقع
3- ثم تختار بلوجر
4-ثم يطلب منك حق دخول لبلوجر
5- ثم لصق كود وضعه في أداء جديدة
والآن حصلت على صندوق تعليقات احترافي يتميز بشكل أنيق

إضافة موضوعات ذات صله متحركة

تتميز إضافة عرض موضوعات ذات صلة متحركة بشكل أنيق واحترافي في عرض التدوينات حسب تسميات بشكل رائع

شرح تفعيل أداء

1- فتح لوحة تحكم

2- اختار مظهر ثم تحرير html

3- ثم لصق كود قبل <head>

<!--Related Posts with thumbnails Scripts and Styles Start--> 

<b:if cond='data:blog.pageType == &quot;item&quot;'> 

<style type="text/css"> 

#related-posts { 

float:center; 

text-transform:none; 

height:100%; 

min-height:100%; 

padding-top:5px; 

padding-left:5px; 

}

#related-posts h2{ 

font-size: 1.3em; 

font-weight: bold; 

color: black; 

font-family: Tahoma, Georgia, &#8220;Times New Roman&#8221;, Times, serif; 

margin-bottom: 0.75em; 

margin-top: 0em; 

padding-top: 0em; 

}

#related-posts a{ 

color:black; 

}

#related-posts a:hover{ 

color:black; 

}

#related-posts  a:hover { 

background-color:#d4eaf2; 

}

</style> 

<script src='http://sma-blogger.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/> 

</b:if> 

<!--Related Posts with thumbnails Scripts and Styles End-->

4-ثم لصق كود بعد هذا رمز

<div class='post-footer-line post-footer-line-1'>

<!-- Related Posts with Thumbnails Code Start--> 

<b:if cond='data:blog.pageType == &quot;item&quot;'> 

<div id='related-posts'> 

<b:loop values='data:post.labels' var='label'> 

<b:if cond='data:label.isLast != &quot;true&quot;'> 

</b:if> 

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop> 

<script type='text/javascript'> 

var currentposturl=&quot;<data:post.url/>&quot;; 

var maxresults=5; 

var relatedpoststitle="مواضيع ذات صلة";

removeRelatedDuplicates_thumbs(); 

printRelatedLabels_thumbs(); 

</script> 

</div><div style='clear:both'/> 

</b:if> 

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

<a href='http://alb33dani.blogspot.com' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://alb33dani.blogspot.com' style='display:none;'>EfadaBlog</a> 

</b:if></b:if> 

<!-- Related Posts with Thumbnails Code End-->

ثم قم بحفظ المظهر

والى هنا قد وصلت إلى نهاية الدرس والسلام عليكم ورحمة الله وبركات

موقع تك توك

اضافات بلوجر مميزة لعام 2018

اضافات بلوجر مميزة لعام 2018

1-اضافة سلايد شو احترافية slide show

إضافة صندوق تعليقات disqus مميز

إضافة موضوعات ذات صله متحركة

إرسال تعليق

اضافات بلوجر مميزة لعام 2018

اضافات بلوجر مميزة لعام 2018

1-اضافة سلايد شو احترافية slide show

إضافة صندوق تعليقات disqus مميز

إضافة موضوعات ذات صله متحركة

آخر المشاركات

تعليقات: 0

إرسال تعليق