09355868199
info@webbarg.ir
شماره حساب

وب برگ

       
ساختن زبانه های ناوبری با استفاده از DOMTab -  چهارشنبه ,۷ دی , ۱۳۹۰

بیشتر کاربران وردپرس در طراحی پوسته دوست دارند در قسمت ابزارکشون یک زبانه ناوبری (Navigation Tab) داشته باشند. با این کار می تونید به عنوان مثال در هر زبانه آخرین نظرات, نوشته ها, ویا کدهای مخصوص به افزونه را قرار دهید. قسمتی در سایت onlinetools به نام DOMTab این کار رو آسون کرده و می توانید به راحتی این زبانه رو در پوستتون به کار ببرید.

در DOMTab که کدها رو به جاوااسکریپت خودش متصل می کنه کارش رو راحت کرده و در کنارش یک domtab.css نیز تعریف می کنه و باعث سردرگمی شما در css تون نمی شه.

روش استفاده:
ابتدا آخرین نسخه از DOMTab رو از اینجا دریافت کنید و بعد فایل های آن را در کنار فایل های پوسته قرار خود دهید.
بعد لازمه که جاوااسکریپت اون رو در فایل header.php فراخوانی کنید. کافیه کد زیر رو به header.php بعد از تگ head اضافه کنید:

 <script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/domtab.js”></script>

برای نمایش زبانه ناوبری, کد زیر می توانید به sidebar.php پوستتون اضافه کنید.

 <div>
<ul>
<li><a href=”#t1″>Test 1</a></li>
<li><a href=”#t2″>Test 2</a></li>
[... and so on ...]
</ul>
<div>
<h2><a name=”t1″ id=”t1″>Proof 1</a></h2>
<p>Test to prove that more than one menu is possible</p>
<p><a href=”#top”>back to menu</a></p>
</div>
<div>
<h2><a name=”t2″ id=”t2″>Proof 2</a></h2>
<p>Test to prove that more than one menu is possible</p>
<p><a href=”#top”>back to menu</a></p>
</div>
[... and so on ...]
</div>

برای تغییر عرضش هم می تونید فایل domtab.css اون رو ویرایش کنید.

منبع : iran98.org