تجمع لأفضل القوالب والملحقات المتنوعة

الاثنين، 13 يوليو 2015

مرحبا بكم اصدقائي متابعين مدونة مدهش ويب في درس جديد وخاص ببلوجر وبالتحديد اضافات بلوجر اليوم لدينا اضافة رائعة وهي قائمة لمدونات بلوجر وليست اي قائمة انها قائمة عرب ويب الاحترافية القائمة طبعا كما كنا دائما القائمة حصرية على المدونة فقط وليست موجودة في اي مدونة او موقع اخر حتى موقع عرب ويب اذا ندخل الى شرح اضافة القائمة بسرعة طبعا اذا كان لديك قائمة قديمة قم بحذف اكوادها الhtml والcss لكي لا تختلط الاكواد مع بعضها.
طريقة التركيب
ضع الكود التالي فوق ]]></b:skin>
/* CSS Menu Top modhich-web  */ #menutop{margin-top: 0px;width:100%;max-width: 1010px;margin:-60px auto 0;background:rgba(255, 255, 255, 1);position: fixed;z-index: 92;opacity: 0.98;margin-right: -0px;border-bottom-right-radius: 3px;box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.16),inset 0 -1px 0 #E7E7E7;border-bottom-left-radius: 3px;}#menutop ul,#menutop li{margin:0;padding:0;list-style:none;}#menutop ul{height:45px}#menutop li{float:right;display:inline;position:relative;font-family:Electrolize,ge_ss_threeregular;font-size:12px;font-weight:bold;}#menutop a{display:block;line-height:45px;padding:0 16px;text-decoration:none;color:#6b6c71;}#menutop ul li:hover a{color:#7C7777;}#menutop input{display:none;margin:0 0;padding:0 0;width:100%;height:45px;opacity:0;cursor:pointer}#menutop label{font-family:'Open Sans';font-size:30px;font-weight:400;display:none;width:35px;height:45px;line-height:45px;text-align:center;}#menutop label span{font-size:13px;position:absolute;right:35px}#menutop ul li ul{height:auto;overflow:hidden;position:absolute;z-index:99;color:#666}#menutop ul li ul li a{color:#666;height:45px;line-height:45px;background:#fff;width:100%;}#menutop ul.menux{visibility:hidden;opacity:0;height:auto;overflow:hidden;background:#fff;position:absolute;z-index:99;color:#444;box-shadow: 0px 2px 3px rgba(0,0,0,0.1);top:65px;transition:all 0.2s ease-in-out;}#menutop li:hover > ul.menux{visibility:visible;opacity:1;top:45px;}#menutop a.dutt{padding:0 14px 0 27px}#menutop a.dutt::after{content:"\f0d7";font-family:FontAwesome;margin:0 auto;width:10px;height:10px;line-height:45px;position:absolute;top:0;left:10px;}#menutop a.dutt:hover::after,#menutop ul li:hover a.dutt::after{content:"\f0d7";font-family:FontAwesome;margin:0 auto;width:10px;height:10px;line-height:45px;position:absolute;top:0;left:10px;}#menutop ul li ul li a:hover{background:#2980B9;color:#fff;}#menutop li.facebook {padding:0 5px;}#menutop li.facebook,#menutop li.twitter,#menutop li.youtube,#menutop li.googleplus,#menutop li.linkedin{text-align:center;color:#666;float:left;transition:all 0.2s ease-in-out;}#menutop li a.facebook:hover,#menutop li a.twitter:hover,#menutop li a.youtube:hover,#menutop li a.googleplus:hover,#menutop li a.linkedin:hover{color:#fff;}#menutop li .facebook .fa.fa-facebook,#menutop li.twitter .fa.fa-twitter,#menutop li.youtube .fa.fa-youtube,#menutop li.googleplus .fa.fa-google-plus,#menutop li.linkedin .fa.fa-linkedin{color:#666;transition:all 0.2s ease-in-out;}#menutop li.facebook:hover{background:#3b5998;color:#fff;}#menutop li.twitter:hover{background:#57b5e2;color:#fff;}#menutop li.youtube:hover{background:#e74c3c;color:#fff;}#menutop li.googleplus:hover{background:#FA6B5C;color:#fff;}#menutop li.facebook:hover .fa.fa-facebook,#menutop li.twitter:hover .fa.fa-twitter,#menutop li.youtube:hover .fa.fa-youtube,#menutop li.googleplus:hover .fa.fa-google-plus,#menutop li.linkedin:hover .fa.fa-linkedin{color:#fff;} #menutop a ul li a:hover, #menutop a ul li.active a{color: #FF4444;}#menutop li.buttonalert {font-size:16px;color:#2980B9;padding:0 30px;cursor:pointer;margin-top: 12px;} .fa-lightbulb-o:before {content: "\f113";position: absolute;bottom: 0;right: -1px;font-size: 25px;line-height: 1.4em;padding-left: 10px;padding-bottom: 4px;padding-right: 10px;padding-top: 5px;color: #fff;background: #2980B9;border-bottom-right-radius: 3px;  }.fa-lightbulb-o:hover{color: #DD4637;}#dialogoverlay{display:none;opacity:.5;position:fixed;top:0px;left:0px;background:#000;width:100%;z-index:10;}#dialogbox{top:-300px;position:fixed;background:#222;width:350px;z-index:10;transition:all 400ms ease-in-out;}#dialogbox > div{background:#fff;margin:8px;text-align:center}#dialogbox > div > #dialogboxhead{position:relative;background:#2980B9;font-size:18px;font-weight:400;padding:10px;color:#fff;font-family:Electrolize,ge_ss_threeregular;text-transform:uppercase;}#dialogboxhead:before {top:100%;left:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(0,0,0,0);border-top-color:#2980B9;border-width:10px;margin-left:-10px;}#dialogbox > div > #dialogboxbody{background:#111;padding:20px;color:#e9e9e9;font-size:14px;font-weight:400;line-height:20px;font-family: Electrolize,ge_dinar_oneregular;}#dialogbox > div > #dialogboxfoot{background:#222;padding:0px;text-align:right;}#dialogbox > div > #dialogboxfoot button{position:absolute;top:-10px;right:-10px;background:#222;border:none;height:30px;width:30px;outline:none;color:#fff;line-height:25px;font:bold 16px Arial;text-align:center;cursor:pointer;border-radius:50%;}
قم بوضع الكود التالي فوق </body>
<script type='text/javascript'>//<![CDATA[function CustomAlert(){ this.render = function(dialog){  var winW = window.innerWidth;     var winH = window.innerHeight;  var dialogoverlay = document.getElementById('dialogoverlay');     var dialogbox = document.getElementById('dialogbox');  dialogoverlay.style.display = "block";     dialogoverlay.style.height = winH+"px";  dialogbox.style.left = (winW/2) - (350 * .5)+"px";     dialogbox.style.top = "150px";     dialogbox.style.display = "block";  document.getElementById('dialogboxhead').innerHTML = "التدوينة القادمة ؟";     document.getElementById('dialogboxbody').innerHTML = dialog;  document.getElementById('dialogboxfoot').innerHTML = '<button onclick="Alert.ok()" title="مع السلامة">&#215;</button>'; } this.ok = function(){  document.getElementById('dialogbox').style.top = "-300px";  document.getElementById('dialogoverlay').style.display = "none"; }}var Alert = new CustomAlert();//]]></script>
قم بوضع كود html هذا في المكان الذي تريد وضع القائمة فيه
<div id='dialogoverlay'/>
<div id='dialogbox'>
<div>
<div id='dialogboxhead'/>
<div id='dialogboxbody'/>
<div id='dialogboxfoot'/>
</div>
</div>
<div class='clear'/>
<nav id='menutop'>
<input type='checkbox'/>
<label/>
<ul>
<li><a class='active' href='http://thgeekweb3.blogspot.com/' title='الرئيسية'><i class='fa fa-lightbulb-o'/></a></li>
<li><a href='http://modhich-web.blogspot.com/' target='_blank'><i class='fa fa-sitemap'/>فهرس التدوينات </a></li>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'><i class='fa fa-cog'/>إتفاقية الإستخدام</a></li>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'><i class='fa fa-users'/>سجل الزوار </a></li>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'><i class='fa fa-laptop'/>ننصحكم</a></li>
  <li><a class='dutt' href='/'><i class='fa fa-link'/>روابط قد تهمك</a>
<ul class='menux'>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'>محــول الأكـــــواد </a></li>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'>التبادل الإعلاني</a></li>
  <li><a href='http://modhich-web.blogspot.com/' target='_blank'>أعلـن بالمـدونـة </a></li>
</ul>
</li>
<li class='sorting-01 facebook'><a href='http://www.facebook.com/modhhichweb' target='_blank'><i class='fa fa-facebook fa-lg'/><span class='inv'/></a></li>
  <li class='sorting-02 twitter'><a href='twitter.com/'><i class='fa fa-twitter fa-lg'/><span class='inv'/></a></li>
<li class='sorting-03 googleplus'><a href='https://plus.google.com/u/0/me?tab=jX' traget='_blank'><i class='fa fa-google-plus fa-lg'/><span class='inv'/></a></li>
<li class='sorting-04 youtube'><a href='https://www.youtube.com/' traget='_blank'><i class='fa fa-youtube fa-lg'/><span class='inv'/>
</a></li>
<li class='buttonalert' onclick='Alert.render(&apos;. التدوينة القادمة سوف تكون قالب غير محدد&apos;)' text='كلمة الفريق'><i class='fa fa-info-circle fa-lg'/></li>
</ul>
</nav>

بإمكانك إدراج الأكواد الغير قابلة لنشر بتحويله عبر محول الأكواد لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى" عبّر عن تعليقكالإبتسامات

يتم التشغيل بواسطة Blogger.

إنضم إلينا

Top Ad unit 728 × 90

فيديوهات

صور

قصص

حكايات

الأكثر زيارة

احدث المشاركات

معلومات

اخر التعليقات

مقالات

على الفيسبوك

فيديو الأسبوع

تكنولوجيا

مشاركات عشوائية

إخترناها لكم

إتصل بنا
كن صديقًا لنا