=== Tab & Accordion - Responsive Tabs, FAQ, Menu === Contributors: richteam Donate link: http://rich-web.esy.es/tabs Tags: tab, tabs, Accordion, Responsive Tabs, Tabs plugin, jQuery Tabs, tabs shortcode, tabs Widget, WordPress tabs plugin, animated tab, FAQs, Requires at least: 4.2 Tested up to: 4.8 Stable tag: 1.0.7 License: GPLv2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tab and Accordion plugin is fully responsive. Tab and Accordion plugin is for creating responsive tabbed panels with unlimited options and transition animations support. == Description == Tab and Accordion plugin is fully responsive. Tab and Accordion plugin is for creating responsive tabbed panels with unlimited options and transition animations support. ### WordPress Tab & Accordion. * [WordPress Tabs Pro](http://rich-web.esy.es/tabs) * [Tabs Live Demo](http://rich-web.esy.es/wordpress-bar-tab-horizontal) * [Tabs Support](https://wordpress.org/support/plugin/tabbed) WordPress Tab and Accordion Plugin https://www.youtube.com/watch?v=RV5ShkI6grA&t=4s ### New Plugins by Rich Team * [WordPress Coming Soon Plugin](https://wordpress.org/plugins/coming-soons/) * [WordPress Social Media Share Buttons Plugin](https://wordpress.org/plugins/rich-web-share-button/) * [WordPress Event Timeline Plugin](http://rich-web.esy.es/wordpress-timeline/) ### Rich Web * [WordPress Tab Builder Pro](http://rich-web.esy.es/tabs/) ### Live Demo * [Tab Bar Horizontal](http://rich-web.esy.es/wordpress-bar-tab-horizontal/) * [Icon Box](http://rich-web.esy.es/wordpress-tab-icon-box-horizontal/) * [Underline Tabs](http://rich-web.esy.es/wordpress-tab-underline-vertical/) * [Triangle and line](http://rich-web.esy.es/wordpress-tab-triangle-and-line-vertical/) * [Tab Top Line](http://rich-web.esy.es/wordpress-tab-top-line-vertical/) * [Falling Icon](http://rich-web.esy.es/wordpress-tab-falling-icon-horizontal/) * [Moving Line](http://rich-web.esy.es/wordpress-tab-moving-line-vertical/) * [Tabs Line](http://rich-web.esy.es/wordpress-tab-line-vertical/) * [Circle Tab](http://rich-web.esy.es/wordpress-tab-circle-vertical/) * [Line Box](http://rich-web.esy.es/wordpress-tab-line-box-vertical/) * [Flip Tabs](http://rich-web.esy.es/wordpress-tab-flip-vertical/) * [Circle Fill](http://rich-web.esy.es/wordpress-tab-circle-fill-horizontal/) * [Fill Up Tabs](http://rich-web.esy.es/wordpress-tab-flip-up-horizontal/) * [Tab Trapezoid](http://rich-web.esy.es/wordpress-tab-trapezoid-vertical/) * [Tab - 15](http://rich-web.esy.es/wordpress-tab-15/) * [Tab - 16](http://rich-web.esy.es/wordpress-tab-16/) * [Tab - 17](http://rich-web.esy.es/wordpress-tab-17/) * [Tab - 18](http://rich-web.esy.es/wordpress-tab-18/) * [Tab - 19](http://rich-web.esy.es/wordpress-tab-19/) * [Tab - 20](http://rich-web.esy.es/wordpress-tab-20/) * [Tab - 21](http://rich-web.esy.es/wordpress-tab-21/) * [Tab - 22](http://rich-web.esy.es/wordpress-tab-22/) * [Tab - 23](http://rich-web.esy.es/wordpress-tab-23/) * [Tab - 24](http://rich-web.esy.es/wordpress-tab-24/) * [Tab - 25](http://rich-web.esy.es/wordpress-tab-25/) * [Tab - 26](http://rich-web.esy.es/wordpress-tab-26/) * [Tab - 27](http://rich-web.esy.es/wordpress-tab-27/) * [Tab - 28](http://rich-web.esy.es/wordpress-tab-28/) * [Tab - 29](http://rich-web.esy.es/wordpress-tab-29/) * [Tab - 30](http://rich-web.esy.es/wordpress-tab-30/) * [Tab - 31](http://rich-web.esy.es/wordpress-tab-31/) * [Accordion Animation 1](http://rich-web.esy.es/wordpress-tab-accordion-faq-1) * [Accordion Animation 2](http://rich-web.esy.es/wordpress-tab-accordion-faq-2) * [Accordion Animation 3](http://rich-web.esy.es/wordpress-tab-accordion-faq-3) * [Accordion Animation 4](http://rich-web.esy.es/wordpress-tab-accordion-faq-4) * [Accordion Animation 5](http://rich-web.esy.es/wordpress-tab-accordion-faq-5) * [Accordion Animation 6](http://rich-web.esy.es/wordpress-tab-accordion-faq-6) * [Accordion Animation 7](http://rich-web.esy.es/wordpress-tab-accordion-faq-7) * [Accordion Animation 8](http://rich-web.esy.es/wordpress-tab-accordion-faq-8) * [Accordion Animation 9](http://rich-web.esy.es/wordpress-tab-accordion-faq-9) * [Accordion Animation 10](http://rich-web.esy.es/wordpress-tab-accordion-faq-10) * [Accordion Animation 11](http://rich-web.esy.es/wordpress-tab-accordion-faq-11) * [Accordion Animation 12](http://rich-web.esy.es/wordpress-tab-accordion-faq-12) * [Accordion Animation 13](http://rich-web.esy.es/wordpress-tab-accordion-faq-13) * [Accordion Animation 14](http://rich-web.esy.es/wordpress-tab-accordion-faq-14) * [Accordion Animation 15](http://rich-web.esy.es/wordpress-tab-accordion-faq-15) * [Accordion Animation 16](http://rich-web.esy.es/wordpress-tab-accordion-faq-16) * [Accordion Animation 17](http://rich-web.esy.es/wordpress-tab-accordion-faq-17) * [Accordion Animation 18](http://rich-web.esy.es/wordpress-tab-accordion-faq-18) * [Accordion Animation 19](http://rich-web.esy.es/wordpress-tab-accordion-faq-19) * [Accordion Animation 20](http://rich-web.esy.es/wordpress-tab-accordion-faq-20) * [Accordion Animation 21](http://rich-web.esy.es/wordpress-tab-accordion-faq-21) * [Accordion Animation 22](http://rich-web.esy.es/wordpress-tab-accordion-faq-22) * [Accordion Animation 23](http://rich-web.esy.es/wordpress-tab-accordion-faq-23) * [Accordion Animation 24](http://rich-web.esy.es/wordpress-tab-accordion-faq-24) * [Accordion Animation 25](http://rich-web.esy.es/wordpress-tab-accordion-faq-25) * [Accordion Animation 26](http://rich-web.esy.es/wordpress-tab-accordion-faq-26) * [Accordion Animation 27](http://rich-web.esy.es/wordpress-tab-accordion-faq-27) * [Accordion Animation 28](http://rich-web.esy.es/wordpress-tab-accordion-faq-28) * [Accordion Animation 29](http://rich-web.esy.es/wordpress-tab-accordion-faq-29) * [Accordion Animation 30](http://rich-web.esy.es/wordpress-tab-accordion-faq-30) * [Accordion Animation 31](http://rich-web.esy.es/wordpress-tab-accordion-faq-31) Each of the versions of the tab made in a certain style according to your preference and related to your web site. Rich Tabbed plugin is a true miracle. If you wish to spice up your corporate website, blog, ecommerce site or a message board, with Tabbed its easy to show any content, video, price or data tables, form or other elements. ### To add PDF file 
<object style="width: 100%; height: 500px;" 
data="www.example.com/file-source.pdf">>
### Responsive beautiful plugin Tabs is 100% responsive and compatible with mobile, tablets, desktop computers and all modern web browsers which include iPhone, iPad, Android, Chrome, Safari, Firefox, Opera, Internet Explorer 7/8/9/10/11 and also Microsoft Edge. ### Vertical Tab Most requested and awaited feature is finally here. Now, you can add vertical tabs to your page or turn the existing tabs to vertical tabs to add more look to your site. ### Tab and Accordion Icon You can choose the icon for each tab or accordion from the available fonts library in Rich-Web Builder. ### Tab or Accordion Alignment Most of our users have asked for this feature. We have added an option for alignment. You can now align your tabs or accordions: left, right or center. ### Beautiful Slideshow Effects Tabbed makes displaying your title, description, FAQ, videos or images a beautiful experience, by using amazing slideshow effects ranging from slicing and sliding to fading and folding. There simply is no better way to showcase your amazing work than to make the presentation of it looks just as beautiful. ### General Features: * 31 types of Tabs * 31 types of Accordions * Fully responsive. * Clean Design & Code. * Easy to customize. * Support post/page or widget. * Show/hide category icon. * You can choose Icon for Tabs. * Tabs transitions. * Free updates & support. * Use via shortcodes. * Awesome input field for Tabs content. * Clean design and commented code. * Clean HTML, Javascript & CSS Code. * Easy to customize to fit any design and color scheme. * Can display any content, video,Image or other elements. * Vertical & Horizontal Tabs Layouts. * Add and remove Tabs item from backend Quickly. * Slick Frontend and backend UI. * Draggable box items for easy sorting. * Super smooth hardware accelerated CSS3 transitions with jQuery fallback. * Very detailed documentation with examples. * Multipurpose use FAQ or Accordion. * Accordion Menu Position (Horizontal) * Display specific category FAQ. * Unlimited variations of usage. * Unlimited number of FAQs. * Unlimited number of tabs. * Unlimited number of Accardions. * Unlimited amount of images to be added. * Unlimited amount of videos (Vimeo and YouTube) to be added. ### Upgrade to Rich Tab Pro Version. Take your tab to the next level with [Rich Tab Pro](http://rich-web.esy.es/tabs), which gives you additional features such as. ### Tabs or Accordion Pro Key Features. * Fully responsive & multiple layouts support. * Random effects - including 'one' effects and 'out-in' effects. * Content transition animations (Random, Scale, Bounce, FadeUp, FadeDown, FadeLeft, FadeRight, SlideUp, SlideDown, SlideLeft, SlideRight, ScrollUp, ScrollDown ScrollLeft, ScrollRight, BounceUp, BounceDownBounceLeft, BounceRight, HorizontalFlip, VerticalFlip, RotateDownLeft, RotateDownRight, RotateUpLeft, RotateUpRight, TopZoom, BottomZoom, LeftZoom, RightZoom ). * Tab Menu Position (Horizontal or Vertical). * Tab or Accordion header title font size. * Tab or Accordion header title font color. * Tab or Accordion title background color. * Custom hover and active tab effects. **10 Flexible ways to position** - Tabs are very flexible and customizable, horizontal and vertical Tabs and it can be positioned in 10 Flexible ways. **Touch gestures** - switch between slides easy and flexibility with support swipe gestures, especially with tabs and accordion have many slides or on the mobile devices. No need to worry, no need to trouble to switch dropdown menu on mobile devices. Tested on iOS, Android, Window Phone device. **Hardware accelerated** - Rich-Web Tabs completely used new techniques used in the transition effects to create smooth transition, fastest, and saves the system memory. **HTML Content** - Place absolutely any HTML content (Images, Audio, and Video) into tabs. You can also have external links or a link to a specific tab. **Flat design** - Flat, clean and minimalist design throughout Rich-Web Tabs, respond most of the modern template. Same time easily create new style in css file. **Free support & update** - Rich-Web Tabs and Accordion always developing new features, regular updates as well as improve existing features. **Shortcodes** - If you need to display any short-codes in product tab or accordion, you can use this type. Friendly tab, attractive tab and easy to use backend. Friendly Accordion, attractive tab and easy to use backend. Tab and Accordion plugin works with any WordPress themes, and very easy to install and tune the tab plugin. ### Set your tabbed in your WordPress page is very simple. 1. Create your tab using the tabbed plugin. 1. Copy and paste the shortcode tab within your web page. * How to enable the tab to in a post or page? * [Rich_Web_Tabs id="1"] * How enable the tabbed to header.php or other PHP files? 3. That ' s it! Your tabbed will work out of the box instantly. In addition to the simple tabbed, allows to create other types of tabs, like a Tab Bar, Icon box, Underline, Triangle and line, Top Line, Falling Icon, Moving Line, Line, Circle Tab, Line Box, Flip, Fill up, Trapezoid and Circle fill. Currently, Tabs & Accordions offers around 45 different styles of tabs or accordion and unlimited variations to make sure no two websites have similar looking tabs & accordions. ### Services and Support: We are committed to top-notch customer support because we know if you have problem with Tabs, you need a solution as soon as possible. ### IMPORTANT: If You think You have found a mistake in the Tab and accordion or have any problem, questions about the plugin, please read the support forum on our WordPress website. If You can not find a solution here, please feel free and click here to contact us. " richweb.org@gmail.com " == Installation == ### Install the free version in your WordPress website. > - In the left side you will see **plugins**. Click to open a new page. > - Click to add new button -> Search plugins. On empty line write your preferable plugin. [Example Tabs Builder](http://rich-web.esy.es/tabs/). Your preferable **tabs** plugin you can find from WordPress large menu. > - Clicking **install now** you will start the installation process. > - When will finished the installation process you, can activate it or not. By activating, your plugin will be ready. Only you must do that, what will be required from your plugin. ### Install Pro version of Tabs in Your WordPress > - On the left side you will see written **plugins**. Click to open a new page. > - Click to add new button -> Add Plugins - > Click to Upload Plugin. > - Clicking on the Zip file, if You have a plugin in a Zip format, you may install it by uploading it here. If You have not received the **Tabs-Content** Zip file, please contact with our support team. > - Clicking **Install Now**, already you can start installation process of the tabs plugin. > - When will finished the installation process, you can activate it or not. By activating, already Your **tabs** will be ready. You can change parameter in the General Options. ### Using FTP > - Download the ZIP file from WordPress website. > - Extract the **content tabs** directory to your computer. > - Upload the **content tabs** directory to the **/wp-content/plugins/** directory. > - Activate the plugin in the plugin dashboard. > > - You can see the plugin installed on WordPress left menu. == Frequently Asked Questions == WordPress Tabs Plugin = Whether, is the tabs support to PNG, JPEG,JPG and GIF formats? = Yes. Any format which has a support possibility. You must only install and use it, in any version. = Is the Tabs Builder responsive? = Yes, reacts and displays resizing images, videos, titles and descriptions for mobile devices and tablets. = Arises a problem after purchase, is there a problem with a purchase? = Please try to make the same payment using another browser, otherwise, do not hesitate, contact with our Support Team. Always ready to help you anytime. = I bought Tabs plugin, I have not received it yet. Please suggest, how can I activate it or get the Pro version? = If You acquired the tabs and have not received it, please just contact with our Support Team. Send a letter with purchase tabs Order Number. = I use free version of tabs and placing Pro version arise a problem, what to do? = * Please delete the free version until installing the Pro version. * Download Content Tabs Pro version. If You still see the old version press Ctrl+F5 for refresh the page. * If you can not do that, please contact with us, we will solve this little problem. = How can I change the width of tabs? = For change the width choose the Tabs version, You will see the " width " tab, where you can choose that size, which width you want for your tabs. = How to install the free version in your WordPress website? = * In the left side you will see " plugins ". Click to open a new page. * Click to add new button -> Search plugins. On empty line write your preferable plugin. Example tabs. Your preferable WordPress content tabs plugin you can find from WordPress large menu. * Clicking " install now " you will start the installation process. * When will finished the installation process you, can activate it or not. By activating, your plugin will be ready. Only you must do that, what will be required from your plugin. = How to install Pro version of Tabs in Your WordPress? = * On the left side you will see written " plugins ". Click to open a new page. * Click to add new button -> Add Plugins - > Click to Upload Plugin. * Clicking on the Zip file, if You have a plugin in a Zip format, you may install it by uploading it here. If You have not received the Content Tabs Zip file, please contact with our support team. * Clicking " Install Now", already you can start installation process of the WordPress plugin. * When will finished the installation process, you can activate it or not. By activating, already Your content tabs will be ready. You can change parameter in the general options. = Will I lose all my changes that I made in free version, if I update to pro version? = All kind of changes made in free version tabs will remain, even if you delete the plugin. = What size images should I use? = Image size is not so important, because the final image will be reduced to the size of the circle. In this way, you just have to be sure, to select the size, that is at least as big as the size of the circle. = How can I add Tabs in the widgets? = Find the plugin in available widgets list, add it to your desired widget section by using drag and drop function or the drop down menu. Now, in the chosen section select your tabs from Rich-Web Tabs drop down menu and save. After which watch the beautiful content tabs on your frontend. = How to enable the tab to in a post or page? = [Rich_Web_Tabs id="1"] == Screenshots == 1. WordPress Tab Bar Horizontal 2. WordPress Tab Icon box Horizontal 3. WordPress Tab Underline Horizontal 4. WordPress Tab Triangle and line Vertical 5. WordPress Tab Top Line Horizontal 10. WordPress Tab Falling Icon Vertical 11. WordPress Tab Moving Line Vertical 12. WordPress Tab Line Horizontal 13. WordPress Tab Circle Horizontal 14. WordPress Tab Line Box Horizontal 15. WordPress Tab Flip Vertical 16. WordPress Tab Fill up Horizontal 17. WordPress Tab Trapezoid Horizontal 18. WordPress Accordion & FAQ Animation 19. WordPress Accordion & FAQ Animation 20. WordPress Accordion & FAQ Animation 21. WordPress Accordion & FAQ Animation 22. WordPress Accordion & FAQ Animation 23. WordPress Accordion & FAQ Animation 24. WordPress Accordion & FAQ Animation 25. WordPress Accordion & FAQ Animation 26. WordPress Accordion & FAQ Animation 27. WordPress Accordion & FAQ Animation 28. WordPress Accordion & FAQ Animation 29. WordPress Accordion & FAQ Animation 30. WordPress Accordion & FAQ Animation == Changelog == = 1.0.7 = * Added 2 types in themes. = 1.0.6 = * In tab added 17 more beautiful effects. * Fixed bug with responsive for mobile in the accordion types. * Added possibility to change some functions in free version. = 1.0.5 = * Fixed a bug with the all tab types in the Safari browser. * Fixed issues with background animations. * Fixed CSS issues with shadow. * In accordion added 21 more beautiful effects. * Fixed bug with responsive for mobile in the tab types. = 1.0.4 = * Added in the tab plugin new version: Accordion = 1.0.3 = * Fixed a bug in the content for the mobile version. * Testing plugin in WordPress 4.8 = 1.0.2 = * Added Secure option for deleting tab or removing submenu. = 1.0.1 = * Added possibility to make duplicate for tabs and for tab settings. = 1.0.0 = * Initial release == Tab Other Note == = WordPress Tab - Content Tabs step by step guide = ### IMPORTANT: If You think You have found a mistake in the Tabs or have any problem, questions about the plugin, please read the support forum on our WordPress website. If You can not find a solution here, please feel free and click here to contact us. " richweb.org@gmail.com " ### Rich Web * [WordPress Contents Tab Pro](http://rich-web.esy.es/tabs/) ### Live Demo * [Tab Bar Horizontal](http://rich-web.esy.es/wordpress-bar-tab-horizontal/) * [Icon Box](http://rich-web.esy.es/wordpress-tab-icon-box-horizontal/) * [Underline Tabs](http://rich-web.esy.es/wordpress-tab-underline-vertical/) * [Triangle and line](http://rich-web.esy.es/wordpress-tab-triangle-and-line-vertical/) * [Tab Top Line](http://rich-web.esy.es/wordpress-tab-top-line-vertical/) * [Falling Icon](http://rich-web.esy.es/wordpress-tab-falling-icon-horizontal/) * [Moving Line](http://rich-web.esy.es/wordpress-tab-moving-line-vertical/) * [Tabs Line](http://rich-web.esy.es/wordpress-tab-line-vertical/) * [Circle Tab](http://rich-web.esy.es/wordpress-tab-circle-vertical/) * [Line Box](http://rich-web.esy.es/wordpress-tab-line-box-vertical/) * [Flip Tabs](http://rich-web.esy.es/wordpress-tab-flip-vertical/) * [Circle Fill](http://rich-web.esy.es/wordpress-tab-circle-fill-horizontal/) * [Fill Up Tabs](http://rich-web.esy.es/wordpress-tab-flip-up-horizontal/) * [Tab Trapezoid](http://rich-web.esy.es/wordpress-tab-trapezoid-vertical/) ### Tab & Accordion Themes: General Option * **Theme Name.** " Your Text " Add unique Title to your content tabs & Accordion theme, to complete your settings. Important possibility to add title to each theme. * **Tab or Accordion Width.** " from 0 to 100 percent " - Choose width in percent (use percentage to create responsive tab or accordion). * **Tab or AccordionAlign.** " Left, Right & Center " Select the position for the tab or accordion. * **Content Animation.** " Random, Scale, Bounce, FadeUp, FadeDown, FadeLeft, FadeRight, SlideUp, SlideDown, SlideLeft, SlideRight, ScrollUp, ScrollDown ScrollLeft, ScrollRight, BounceUp, BounceDownBounceLeft, BounceRight, HorizontalFlip, VerticalFlip, RotateDownLeft, RotateDownRight, RotateUpLeft, RotateUpRight, TopZoom, BottomZoom, LeftZoom, RightZoom ). * **Tab Menu Position.** (Horizontal or Vertical " Choose your preferable animation effect for contents. * **Navigation Mode.** " Horizontal & Vertical " Choose Navigation mode to horizontal or vertical for show in the theme. * **Navigation Align.** " Left, Right & Center " Determine the alignment of the navigation names. ### Navigation Options * **Tab Style.** " Bar, Icon box, Underline, Triangle and line, Top Line, Falling Icon, Moving Line, Line, Circle, Line Box, Flip, Fill up, Trapezoid Tab, Circle fill " You can change the style for the navigation buttons. Select the desired effect from the list. There is an effect, which displays the icons or only the title without the icons. * **Main Background color.** " RGB # color number " Select background color for the navigation container. * **Main Border Color.** " RGB # color number " Select border color for the navigation container. * **Place between for Navigation.** " from 0 to 15 pixel " Choose the interval between each flow navigation. * **Inset Box Shadow Color.** " RGB or # color number " Set the shadow color. As you know, the box shadow color allows you to display a shadow behind your navigation container. * **Outset Box Shadow Color.** " RGB or # color number " Set the shadow color. As you know, the box shadow color allows you to display a shadow behind your navigation container. * **Font Size** - " from 8 to 48 pixel " Each box has its own title. Choose the font size for title. * **Font family.** " Google font " Select the font family for the navigation title. * **Icon Size.** " from 8 to 72 pixel " Alter the size of the icon regardless of text size. ### SubTitle Options * **Menu Background Color.** " RGB or # color number " Here you can select your favourite background color for Subtitle. * **Menu Color.** " RGB or # Color number " Choose the title color. * **Menu Hover Background Color.** " RGB or # Color number " Here in the tab you can select your favourite hover background color for navigation title. Each of the versions of the tab made in a certain style according to your preference and related to your web site. Rich Tabbed plugin is a true miracle.