ایجاد تب های رسپانسیو در وردپرس با Tabby Responsive Tabs

ایجاد تب های رسپانسیو در وردپرس با Tabby Responsive Tabs

به طور حتم ظاهر سایت برای تمام مدیران و کاربران مهم می باشد و سایتهایی که دارای محتوای بیشتری هستند اصولا با به کار بردن تب ها در آنها می توانید محتوایتان را با ظاهری زیبا و مرتب برای کاربران به نمایش بگذارید.

در گذشته افزونه افزودن تب بندی در نوشته ها و برگه های وردپرس را معرفی کردیم، امروزم یک افزونه کاربردی و کاملا رسپانسیو به شما توضیح خواهم داد.

معرفی و ویژگی افزونه Tabby Responsive Tabs

با افزونه Tabby Responsive Tabs به راحتی می توانید تب های رسپانسیو در وردپرس ایجاد کنید. و ظاهر سایت خود را به شکل دلخواه در آورید.

  • نمایش تب به صورت افقی
  • ایجاد تب آکاردئون با جی کوئری
  • پشتیبانی از چند مجموعه تب در یک صفحه
  • نمایش محتوا برگه یا نوشته در تب ها
  • در دسترس بودن محتوا و تب توسط کیبرد

نحوه کار با افرونه Tabby Responsive Tabs

در ابتدا مثل روال همیشه افزونه را نصب و فعال سازی کنید، پس از فعال سازی افزونه Tabby Responsive Tabs هیچ گزینه ای به پنل پیشخوان وردپرس اضافه نمی شود و تنظیماتی ندارد. این افزونه با دو شورتکد کار می کند و پارامترهای مختلفی دارد که تنها با به کار بردن پارامترها تب رسپانسیو ایجاد می کند، فقط نیاز است شورتکدها را به برگه یا نوشته خود اضافه و منتشر کنید و از نمایش تب ها لذت ببرید.

همچنین این افزونه قابلیت سفارشی سازی توسط کدهای css را در صورت دلخواه دارد. 

دو تا شورتکد [tabby] و [tabbyending] داریم، شورتکد [tabbyending] تنها یک بار استفاده می شود و فقط پس از آخرین تب نوشته می شود.

پارامترهای شورتکد [tabby]

حال چند تا پارامتر داریم که به صورت جداگانه نام می بریم و مثال می زنیم. اولین پارامتر title می باشد، مانند:

[“tabby title=”tabname]، این پارامتر نام تب را مشخص می کند که به جای tabname نام تب مورد نظرتون بنویسید.

[tabby title="زبانه 1"]

این تب تستی است.
[tabby title="زبانه 2"]

این تب تستی است.
[tabby title="زبانه 3"]

این تب تستی است.
[tabbyending]

نمایش تب های رسپانسیو

دومین پارامتر open می باشد، مانند:

[tabby title=”زبانه 3″ open=”yes”]، با این پارامتر می توانید مشخص کنید کدام تب در حین لود شدن صفحه باز بماند و تنها یک بار مورد استفاده می باشد یعنی در یک تب فقط می توانید این پارامتر استفاده کنید.

نمایش تب مورد نظر در حین لود شدن سایت

سومین پارامتر icon می باشد، مانند:

[tabby title=”زبانه 3″ icon=”cog”]، با این پارامتر می توانید آیکون دلخواه خود را کنار تب ها به نمایش بگذارید. آیکون ها را از fontawesome انتخاب و درج کنید. در این مثال cog مخفف چرخ دنده است آیکون به صورت چرخ دهنده نشان داده می شود.

نمایش آیکون کنار تب ها

نتیجه را در بالا مشاهده کردید. از این به بعد به راحتی می توانید تب های دلخواه خود را به صورت کاملا رسپانسیو در وردپرس نمایش دهید.

موفق و پیروز باشید.

راستی! برای دریافت مطالب وردپرسی در کانال تلگرام میهن وردپرس عضو شوید.