ثلاث اضافات مهمة في قائمة واحدة

بادن الله في هذه التدوينة سوف نقوم بشرح اضافة قائمة جانبية تحتوي على الاضافات التالية خلاصات المدونة تابعنا عبر البريد الالكتروني و كذلك تابعنا على التويتر و هي كما يبدو في الصورة التالية:

للاطلاع اكثر على الاضافة يمكنك معاينتها من خلال الرابط التالي لتلك المدونة التجريبية اذا اعجبتك الاضافة و اردت امتلاكها فتابع الخطوات التالية:
من القالب ثم تحرير الـhtml اضغط على زر المتابعة و ابحث عن الوسم التالي:

]]></b:skin>

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

#subscribebox{list-style:none; margin:0px}
#subscribebox li{padding:10px 5px; position:relative; margin-top:0; margin-right:0; margin-bottom:5px; margin-left:0; height:64px; opacity:0.75; -moz-opacity:0.75}
#subscribebox li:hover{ background-color:#f4f4f4; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -khtml-border-radius:5px; opacity:1; -moz-opacity:1; -webkit-transition:opacity 1s ease-out}
#subscribebox li img{float:left; position:relative; padding:0px; margin:0px 10px 0px 0px}
#subscribebox li h4{margin:-6px 0 3px 83px; font-size:15px; line-height:26px; color:#8B3E2F; text-shadow:1px 1px 0px #fff; font-family:Helvetica,Arial,Verdana; font-weight:bold; clear:none}
#subscribebox li p{margin:0 0 0 0; font-family:Trebuchet MS,sans-serif; font-size:13px; letter-spacing:-0.02em; clear:none; text-indent:0px}
#subscribebox li a.link{background:none; border:none; top:0; left:0; right:0; bottom:0; width:100%; height:100%; position:absolute; z-index:50}

قم بحفظ القالب و توجه الى التخطيط اضافة ادات من نوع html/javascripte و اضف الكود التالي:

<ul id="subscribebox">
<li>
<a class="link" href="http://feeds.feedburner.com/city-bl" target="_blank"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYDI1KLcfd3_QC3wUOBRK4GzKA70qN8cUUPRdUzMyRG1hndbft1gJZZNSBfdIPjDcFFMyIGXRX736mtMsGIxykYRuxCWzvQ4PdrDyK914TZmnUXpbObA0FgBkaIaFRzBDm4AoAIbnrjFE/s1600/rss_48.png" alt="RSS Feeds" />
<h4>RSS Feed</h4>
<p>Subscribe To RSS Feed</p>
</li>
<li>
<a class="link" href="http://feedburner.google.com/fb/a/mailverify?uri=city-bl&loc=en_US" target="_blank"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB9M5QKwPwqciMpiLrcw2JGnwb435jofZbMB1KDVAQX0UeHoM1gK_rbkTVtP9BWotCgZBoBoCypgUFU-3kCz-SLtnTotcZwPozzYP1L9AW4oH-lCabeKcVWpIf8xNYGXrZTrX5wYqWMco/s1600/mail_forward_48.png" alt="RSS E-Mail Delivery" />
<h4>E-Mail Delivery</h4>
<p>Subscribe To Email for the latest updates right to your email</p>
</li>
<li>
<a class="link" href="http://twitter.com/saidkharbouche" target="_blank"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyM4w1U824z7VJtaJ6Cdl7Lj9Ldij7DdcgdCvbRM289G57PfCMpu6EselShqf6wVKxt3blg84Uc2lN8-SOnTGag0ClzGCuwkdQcdbgG6iUJsXtHz1rqmQpgqtZaQ-IhGZ0qeClLpDheQA/s1600/twitter_48.png" alt="Follow Us On Twitter" />
<h4>Twitter</h4>
<p>Follow Us On Twitter to join the list of 1000  followers</p>
</li>
</ul>

غير ما باللون الاحمر الى ما يناسبك و قم بالحفظ و مبروك عليك الاضافة