طريقة اضافة قائمه افقيه تحتوي على اربع اضافات هامه لقوالب بلوجر

طريقة اضافة قائمه افقيه تحتوي على اربع اضافات هامه لقوالب بلوجر

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

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

]]></b:skin>

وضع قبلها او فوقها مباشرة الكود  :التالي 

searchbar{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOzHuao6eLZTQt7_IsZ0mCYtipeyyfKAK8iDAYiMzBG5Ju5LdBzerjPM1X2qlBcLAWZbvQcDIoDe0SWpA-_qot7jMmxmWx4V7NPAWEJihqLmiQ1JSpYL99kFK3bbHwsuhfF7ejGn4yT_Q/s1600/searchbar.png) repeat-x bottom;width:960px;height:40px;font-size:12px;font-family:tahoma, arial, Verdana;color:#616161;font-weight:500;margin-bottom:0px;padding:0}
#searchbarleft{width:290px;float:left;margin:0;padding:7px 0 0 10px}
#searchbarmiddle{width:280px;float:left;margin:0;padding:4px 0 0}
#searchbarright{width:190px;float:left;margin:0;padding:8px 0 0}
#searchbarright1{width:190px;float:left;margin:0;padding:2px 0 0}
#searchbarform{display:inline;overflow:hidden;margin:10px 0 0}
#searchbarformheader{margin:0}
#cat{background:#fff;width:220px;color:#222;font-family:tahoma, arial, Verdana;display:inline;margin:3px;padding:3px 2px 2px}
#subscribe{overflow:hidden;margin:0;padding:0 0 5px}
#subbox{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwCvEcsvt_WsxQ8y0byDaicTPV38cS0aa0tMk5fNSKgRBSfqWPHFkjirJo3J-7dr3aVnYCoHIOHsC8u689HW5GNvdJ_4RvRo6SazmmGhGTr9l7bKZEiQUuIr2-DARezomBjOPGr_HNmhU/s1600/email.png) no-repeat scroll 4px center;font:normal 12px tahoma;color:#666;text-decoration:none;border:1px solid #aaa;height:14px;width:170px;margin:0;padding:5px 0 4px 34px}
#subbutton{background:#999;color:#FFF;font:12px tahoma;font-weight:700;text-decoration:none;border:1px solid #666;margin-left:5px;padding:3px 5px}
ul.isocial{list-style:none;margin:0;padding:5px 20px 0 0}
ul.isocial li{float:right;margin:0 5px;padding:0}
ul.isocial li a{float:right;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkMqRJDDUYdMLuSFBr90JGnqsxnbPnFeizVRPX7aT7MaE_hCElbMVJD0fxd8k13IevSCj7lDluMGgiCe0N5c3PJ7qs6wKgxRmLov4ARa0lwV2cctdkawiWh839heLnIv40U0r3NgTZny8/s1600/social+letter.png);background-position:0 0;background:repeat:no-repeat;display:inline-block;text-indent:-9999px;overflow:hidden;width:24px;height:24px;position:relative}
ul.isocial li a.rss{background-position:0 0}
ul.isocial li a.rss:hover{background-position:0 -25px}
ul.isocial li a.facebook{background-position:-25px 0}
ul.isocial li a.facebook:hover{background-position:-25px -25px}
ul.isocial li a.twitter{background-position:-50px 0}
ul.isocial li a.twitter:hover{background-position:-50px -25px}
ul.isocial li a.google{background-position:-75px 0}
ul.isocial li a.google:hover{background-position:-75px -25px}
ul.isocial li a.youtube{background-position:-100px 0}
ul.isocial li a.youtube:hover{background-position:-100px -25px

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

 ولكن يجب ان تكون الاداه تحت منطقة الهيدر مباشره او فوق او تحت القائمه الافقيه بمدونتك ان اردت الاحتفاظ بها

<div id='searchbar'>
<div id='searchbarleft'>
<form action='http://feedburner.google.com/fb/a/mailverify' id='subscribe' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=blogspot/htbgh&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><input id='subbox' name='email' onblur='if (this.value == &apos;&apos;) {this.value = &apos;Enter your email address...&apos;;}' onfocus='if (this.value == &apos;Enter your email address...&apos;) {this.value = &apos;&apos;;}' type='text' value='ا�تب بر�د� ��ا...'/><input name='uri' type='hidden' value='blogspot/htbgh'/><input name='loc' type='hidden' value='en_US'/><input id='subbutton' type='submit' value='Enter'/></form>
</div>
<div id='searchbarmiddle'>
<b:section id='labelsmenu' maxwidgets='1'>
<b:widget id='Label1' locked='true' title='Kategori' type='Label'/>
</b:section>
</div>
<div id='searchbarright'>
<form action='http://www.google.com/search' method='get' target='_blank'>
<input name='sitesearch' style='display:none;' value='http://johny-storage.blogspot.com'/>
<input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:120px;border:none;padding:3px 7px; font:12px Arial;color:#666; background:#fff;border:1px solid #ccc;' type='text' value='بحث سر�ع ...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQpxku7ooYnHG_ixMNFVeamB7NguEz0vKikNO35rm8dWvNFYnaaVUiIOZ1O66iQt8UeJbqCk-zgC5nD18m7-OB9x97sWJvwDp4Lbg8QairrqFE8p3x8NjlhNxtuHaMsb1b0qkFJlMJptc/s1600/search.jpg' style='padding:0px 3px;' type='image' value='Search'/>
</form>
</div>
<div id='searchbarright1'>
<ul class='isocial'>
<li><a class='rss' href='#' target='_blank' title='Subscribe via RSS'/></li>
<li><a class='facebook' href='#' target='_blank' title='Become a Fan'/></li>
<li><a class='twitter' href='#' target='_blank' title='Follow Us'/></li>
<li><a class='google' href='#' target='_blank' title='Google Plus Profile'/></li>
<li><a class='youtube' href='#' target='_blank' title='Watch The Video'/></li>
</ul>
</div>
</div>

قم بحفظ التغييرات على القالب . انتهى ...استفساراتكم مرحبا بها

مواضيع ذات صلة