اضافات

‏إظهار الرسائل ذات التسميات اضافات. إظهار كافة الرسائل

اضافة اتصل بنا في صفحة خاصة مستقلة بلوجر

عبدالله منقوش

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

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

معاينة

ملاحظه هامه: يجب قبل كل شيء تفعيل اتصال بنا من خلال التخطيط (ولن تظهر في التخطيط بعد تركيب الاكواد) بعد ذالك تابع الطريقة ألتاليه

ابحث عن ]]></b:skin> اضف الكود التالي فوقة مباشره

#ContactForm1{display: none;}

هذا كود نموذج اتصل بنا سوف نستخدمه لاحقاً

طريقة تركيبه

نتوجه إلى لوحة التحكم الخاصة بالمدونة

تم نضغط على الصفحات الموجدة في القائمة العمودية كم في ألصوره

ألان إنشاء صفحة جديدة وسميها اتصال بنا

قم بتحويل من تأليف إلى HTML حتى يشتغل الكود بشكل الصحيح

قم بحذف جميع الاكواد الموجودة

1- ضع الكواد السابق كواد اتصال بناء

2-اضغط خيارات

3-تعليقات خليها عدم السماح

4- اعمل العنوان الدي تريده

5- نشر

إضافة صندوق الفيس بوك تظهر مرة واحدة

عبدالله منقوش

إضافة صندوق الفيس بوك تظهر مرة واحدة

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

معاينة الاضافة

شرح تركيب الاضافة

1- اذهب الى لوحة التحكم

2- اذهب الى قالب / تحرير HTML / ابحث عن </head> اضع الكود فوقه /اعلى مباشره

الطريقة الثانية سهلة جدان ولن تواجه اي صعوبات في تركيب الاضافة تابع معي

1- ادخل على تخطيط / إضافة أداة / HTML/JavaScript تم اضافة الكواد

ملاحظ همه : عند تركيب الإضافة في التخطيط عليك لانتبه وعدم تركيب عنوان للإضافة تركيبه بدون عنوان

كواد الاضافة

<div dir="rtl" style="text-align: right;" trbidi="on">
<style> #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block;} .cboxIframe{width:100%; height:100%; display:block; border:0;}
#cboxOverlay{background:#000;opacity:0.5 !important;} #colorbox{ box-shadow:0 0 15px rgba(0,0,0,0.4); -moz-box-shadow:0 0 15px rgba(0,0,0,0.4); -webkit-box-shadow:0 0 15px rgba(0,0,0,0.4); } #cboxTopLeft{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) no-repeat 0 0;}#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg22zhtGbLBfjCH_4e_ESU5upvpb4QUim_uCqUNzLLHEii2h-EXStnexk_igGUZ1IG4NHIATM2_v4yyGiR3ryX7VBCU-JuTnlmKVlRG5whXIkk5Lu_u-_QQRt6XKWssLTHCkiTkA3BwdG8/s400/border.png) repeat-x top left;} #cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) no-repeat -36px 0;} #cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) no-repeat 0 -32px;} #cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg22zhtGbLBfjCH_4e_ESU5upvpb4QUim_uCqUNzLLHEii2h-EXStnexk_igGUZ1IG4NHIATM2_v4yyGiR3ryX7VBCU-JuTnlmKVlRG5whXIkk5Lu_u-_QQRt6XKWssLTHCkiTkA3BwdG8/s400/border.png) repeat-x bottom left;} #cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) no-repeat -36px -32px;} #cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) repeat-y -175px 0;} #cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) repeat-y -211px 0;} #cboxContent{background:#fff; overflow:visible;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR8IQknzKhQspgBnnTFGUfXzVpSNJXkC8a01kaUM0Ow8_azUvVnjiYNP0Ms6pM-Q7-ovOECO4CPCpUI5Xh44eWU5-_PdpBU6UhxMhFebiyNqmSS8oDgwX8JYyLPfmvbVMaw51hIa4ZdPE/s400/loadingbackground.png) no-repeat center center;} #cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfq3PLihIE0YEF4EEdsmYr4IvQkyihI8ed5V5iGTSvvy0TP2om49ItFkX6K7Ys8ONERSTqiDjaT_iYXJQSOeYhUQtBowp_Akza00k4Vyu2Ta9HDSN6IJYiKBs2E-2oQ_PzepLWiFfrq7Y/s400/loading.gif) no-repeat center center;} #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;} #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcJyf9etdTi6JhmvM9FXf9_g_6PYLwIrLGxozKwJuijHDVYpH7As_CUan2L3HcmmR11uGJEgWJBAIvm8aP2Eb5AtC87HsNcxl8jHXNZDP4wIppdHcT2k-ST3FUn_U0lAUQ7DHA64mx1JI/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;} #cboxPrevious{left:0px; background-position: -51px -25px;} #cboxPrevious.hover{background-position:-51px 0px;} #cboxNext{left:27px; background-position:-75px -25px;} #cboxNext.hover{background-position:-75px 0px;} #cboxClose{right:0; background-position:-100px -25px;} #cboxClose.hover{background-position:-100px 0px;} .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;} .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;} .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;} .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}
</style><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script><script src="http://yourjavascript.com/3093182329/btt_jquery.colorbox-min.js">"></script><script type="text/javascript">jQuery(document).ready(function(){if (document.cookie.indexOf('visited=true') == -1) {var fifteenDays = 1000*60*60*24*30;var expires = new Date((new Date()).valueOf() + fifteenDays);document.cookie = "visited=true;expires=" + expires.toUTCString();$.colorbox({width:"390px", inline:true, href:"#subscribe"});}});</script>
<br />
<div style="display: none;">
<div id="subscribe" style="background: #fff; padding: 10px;">
<center>
<h3 class="box-title">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPi2WJ7s9cHVFVo_Bd5mprg04x4xXgrFTGxZbFpVarQRkn62y7WYZJ4fCD5KYMlHOCPEl4QM09YNJdX4JCGIaR7Nz7IlLRFY4DxYkICtDG88bIhzEOM2PvOomRR5VtR3x9HRbwtkax7Gg/s1600/subscribe.gif" /></h3>
</center>
<center>
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="https://www.facebook.com/5633564&width=300&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false&height=270" style="border: none; height: 270px; overflow: hidden; width: 300px;"></iframe></center>
<div style="float: right; margin-right: 10px;">
<a href="http://arts2017.blogspot.com/" style="color: #3b78cd; font-size: 7px; text-decoration: none;" target="_blank">arts</a></div>
</div>
</div>
</div>

تعليمات التعديل

https://www.facebook.com/5633564 قم بتعديل الى رابط صفحتك على الفيس بوك

تغيير شكل التعليقات إلى شكل احترافية في بلوجر

عبدالله منقوش

تغير شكل التعليقات الى شكل متطور لمدونات بلوجر

تغيير شكل التعليقات إلى شكل احترافية في بلوجر

تغيير شكل التعليقات إلى شكل احترافية سوف نعمل على تغيير شكل التعليقات الذي في بلوجر الافتراضية سوف نعدله إلى شكل احترافي في مدونة بلوجر التعليقات الافتراضية أنها تعرض التعليقات بشكل بدئي أو كلاسلكي لأكن اليوم سوف نعدله إلى شكل احترافي سوف نقوم بتغيره عبر كواد عبارة عن اكواد css سوف تحول التعليقات إلى شكل أخر التعليقات مهمة في مدونة بلوجر فيجب عليك تغيير شكله إلى شكل يليق بل مدونة ولقد رئيت الكثير من المدونات عند النضر إلى التعليقات عدم ترتيب التعليقات فعند النضر لأتفرق بين التعليق والرد لأكن في هاد الكود سوف يعمل على ترتيب التعليقات سوف تتمكن من رئيت التعليقات و الرد بكل أنتضام أد كنت تريد أضفتاه اتبع الشرح التالي

معاينة الاضافة

تغيير شكل التعليقات إلى شكل احترافية في بلوجر

1-الذهاب الى القالب تحرير HTML

2- قم بالبحت عن ]]></b:skin>

3- ضع الكود التالي فوقه /اعلى

/*----------- التعاليق ----------*/

#comments {

background-color: #fff;

padding-top: 20px;

width: 98%;

}

.comments .continue a {

background: #0d86cc;

text-align: center;

padding: 10px 0;

display: none;

}

.comments .continue a {

line-height: 30px;

margin: 0;

padding: 20px 0 14px 10px;

font-size: 18px!important;

text-transform: uppercase;

font-weight: 400!important;

color: #444;

}

.comments .user a {

color: #444!important;

font-size: 18px;

line-height: 25px;

text-transform: capitalize;

margin-top: 20px;

font-weight: 600;

padding-right: 15px;

}

#comments .avatar-image-container img {

border: 1px solid #ddd;

margin: -1px -1px;

}

.comment-thread {

color: #111;

}

.comment-thread a {

color: #777;

}

.comment-thread ol {

margin: 0 0 20px;

}

.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a {

color: #000;

}

.comments .avatar-image-container {

overflow: visible;

}

.comments .avatar-image-container,.comments .avatar-image-container img {

width: 48px;

max-width: 40px;

height: 40px;

max-height: 48px;

background: #FFF;

float: right;

border-radius: 50%;

-moz-border-radius: 50%;

margin: 0 10px 0 0;

}

.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single {

margin-right: 60px;

}

.comments .comment-block,.comments .comment-thread.inline-thread .comment {

background: #F6F6F6;

background-color: #F6F6F6;

padding: 10px;

padding-left: 0px;

padding-right: 0px;

border-radius: 4px;

border-top: 5px solid #f34246;

}

.comment-header {

border-bottom: 1px solid #ddd;

padding-bottom: 10px;

}

.thread-chrome.thread-expanded .comment-header {

width: 452px;

margin-right: 15px;

}

#comments h4 {

padding-bottom: 5px;

color: #3f3f3f;

font-size: 25px;

text-transform: capitalize;

font-weight: 400;

margin-bottom: 10px;

margin-top: 0px;

}

.comments .comments-content .comment {

width: 100%;

line-height: 1em;

font-size: 13px;

margin: 15px 0 0;

padding: 0;

}

.comments .comments-content .comment-content {

text-align: justify;

line-height: 22px;

overflow: hidden;

color: #444;

}

.thread-chrome.thread-expanded .comment-content {

width: 435px;

line-height: 22px;

overflow: hidden;

}

.comments .comment-thread.inline-thread .comment-actions {

display: none;

}

.item-control.blog-admin {

display: none;

}

.comments .comments-content .datetime {

cursor: pointer;

float: left;

padding-top: 6px;

padding-left: 20px;

}

.comment-actions {

background: #f34246;

padding: 8px;

margin-right: 435px;

border-left: 0px;

border-bottom: 0px;

float: left;

margin-top: -20px;

}

.comment-actions a {

color: #fff;

gont-weight: bold;

text-decoration: none;

}

.comments .comments-content .icon.blog-author {

display: inline-block;

height: 18px;

margin: 0 0 -4px 6px;

width: 18px;

background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwJ28UOGAYelqni1a71T8P1AwUcJ4aRKDxbuwtskiLVG84QTO2koaangmNyw79KL4TGiuAA1uvPX0HHgPrYfARLZzn8aEN9v25QSaj6671_yrcfveNGchcS0t9ytLY3doQK2O_pStz7CFa/s1600/Verificon.png);

}

.icon.user {

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfGNg6-HcV-LwGRpcO5vbf7UK4r8pcmeeru554yFO3bWee3TyquGu__z7sDpda6Yu_rtRw8DuKSp7zjs3uV3Qr50BCdPthYWYmTtIWUDgjoOnWRGK9jSTsx-pcPnOFaZ-B6tyLpdAcwE1L/s1600/online.png) no-repeat;

height: 12px;

width: 16px;

display: inline-block;

margin: 0 0 -4px 6px;

}

.comments .comments-content .comment-replies {

margin-top: 0;

}

.comments .comment-content {

line-height: 1.4em;

padding: 15px;

}

.comments .comment-thread.inline-thread {

padding-right: 0px;

}

.comments .comment-thread.inline-thread .comment {

width: auto;

}

.comments .comment-thread.inline-thread .comment:after {

content: "";

position: absolute;

top: 10px;

right: -20px;

border-top: 1px solid #d2d2d2;

width: 10px;

height: 0;

}

.comments .comment-thread.inline-thread .comment .comment-block {

border: 0;

background: transparent;

padding: 0;

}

.comments .comment-thread.inline-thread .comment-block {

margin-right: 48px;

}

.comments .comment-thread.inline-thread .user a {

font-size: 13px;

margin: 0px;

padding: 0px;

}

.comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img {

width: 36px;

max-width: 36px;

height: 36px;

border: 0px;

max-height: 36px;

margin-right: 5px;

}

.comments .continue {

border-top: 0;

width: 100%;

}

#comment-editor {

width: 98%!important;

}

.comment-form {

width: 100%;

max-width: 100%;

}

#blog-pager-newer-link {

float: $startSide;

}

#blog-pager-older-link {

float: $endSide;

}

#blog-pager {

text-align: center;

}

.feed-links {

clear: both;

line-height: 2.5em;

}

تعديل تغيير شكل التعليقات إلى شكل احترافية في بلوجر

تغير اللون الأحمر الشريط ولون زر رد ابحث عن #f34246

هناك أتنين وحد لتغير لون الشريط و التأني لتغير لون زر رد

اضافة ثلاثة اعمدة اسفل قالب بلوجر

عبدالله منقوش

إضافة ثلاث أعمدة

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

شرح إضافة ثلاثة اعمد في التخطيط أسفل القالب في بلوجر

الأول : الذهاب إلى القالب تحرير HTML

الثاني : قم بالبحت عن ]]></b:skin>

الثالث : ضع الكود التالي فوقه / قبله:

#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#333434;
}
#lower-wrapper {
margin:auto;
padding: 20px 0px 20px 0px;
width: 960px;
}
#lowerbar-wrapper {
border:1px solid #DEDEDE;
background:#fff;
float: left;
margin: 0px 5px auto;
padding-bottom: 20px; width: 32%; text-align: justify;
font-size:100%;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}
.lowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
color:#0084ce;
text-transform:uppercase;
font: bold 14px Arial, Tahoma, Verdana;
border-bottom:3px solid #0084ce;
}
.lowerbar ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
list-style-type: none;
}
.lowerbar li {
margin: 0px 0px 2px 0px;
padding: 0px 0px 1px 0px;
border-bottom: 1px dotted #ccc;
}

ابحث عن

<b:section class='footer' id='footer'/>

</div>

استبدله بل كواد التالي

ملاحظ:أد لم تجده ابحث عن footer سوف تحصل عليه بهاد الشكل

أو

ضع الكود استبدلة في ماء داخل footer

<div id='lower'>
<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>