Description
This plugin define two shortcodes to generate graphical tab panels in posts and pages. You don’t have to edit your theme’s style.css, and any templates.
To browse it’s tab panels, NOT IE browser (Chrome, FireFox, Opera, Safari were tested) or IE8 or above required. With IE7 or below, it will generate standard <ul> list and recommend to use other browser or update.
Please visit my sample at http://sabaoh.sakura.ne.jp/wordpress/?page_id=106
right” attribute sample at http://sabaoh.sakura.ne.jp/wordpress/?page_id=116
scroll” attribute sample at http://sabaoh.sakura.ne.jp/wordpress/?page_id=122
Usage:
[rollover-tabs name="id" norollover="true" border="true" margin="-2px" height="1.5in" left="1px" right="1px" scroll="true" font="small"][rollover-tab name="tab1" label="sample1"] content of tab1... ... [/rollover-tab][rollover-tab name="tab2" label="sample2" font="large"] content of tab2... ... [/rollover-tab][/rollover-tabs]
Attribute:
name:
internal name (id). [rollover-tabs name=”id”] is optional (default value is rollover”). [rollover-tab name=”tab1″] is required.
norollover:
optional boolean. As default tab panels will switch when your mouse is on the tab (click is not necessary). If norollover is set true”, panels will switch when you click the tab.
border:
optional boolean. As default panel has no border. If border is set true”, border will display.
margin:
optional. As default margin-top was defined in css/rollover-tab.css (Now vlaue has changed to 0 for all themes). If your panels’ top border didn’t match the tab graphic, you could adjust the position of the top border by either edit css/rollover-tab.css or set margin attribute in each rollover-tabs tag.
height:
optional. As default panels’ height will adjust automatic. You can assign fixed height to your panels.
left:
optional. As default left defined in css/rollover-tab.css (Value is 1px”). If you wanted to make space in left of tabs, you could set greater value to this attribute. 0” or 0px” is NOT recommended due to avoid lack of border.
right:
optional. Default value is false. If you wanted to make tabs align right, you could set 1px” or greater value to this attribute. If left” attribute was setted, this attribute would be ignored. 0” or 0px” is NOT recommended due to avoid lack of border.
scroll:
optional boolean. As default panel has no scroll bar. If scroll attribute was set true”, panel will have scroll bar.
font:
optional. You can assign font-size in tabs, for example 10pt” or small”. If it was used with [rollover-tab …], size would be assigned for just ONE tab. With [rollover-tabs …], size would be applied all of tabs, except [rollover-tab …] with font attribute assigned.
label:
caption of tabs, required.
NOTICE: Since 1.2.0, margin attribute’s default value changed from -26px” to 0”. So if you’ve assigned margin value, You had to change your assignment in order to maintain good display.
NOTICE: with rich text editor, you must NOT insert any line breaks between [rollover-tabs] and next [rollover-tab], between [/rollover-tab] and next [rollover-tab], between [/rollover-tab] and [/rollover-tabs]. Due to wordpress automatic <p> insertion.
Features:
- You can create a panel which contain tabs, with [rollover-tabs] shortcode.
- In between [rollover-tabs] and [/rollober-tabs], you can define panels with [rollover-tab name=”…” label=”…”]…[/rollover-tab] shortcode.
- Tabs with label will display in rich graphical background.
- As default, tabs will switch when your mouse is on the tab. Optional, you can choose click-needed-switching.
- You can choose the border on or off.
- You can adjust position of top border without editing stylesheet.
- You can assign height of panels, without editing stylesheet of course.
- Stylesheet was improved and top border will match with graphics, theme proof positioning was innovated since 1.2.0.
- You can use some other shortcodes between [rollover-tab…] and [/rollover-tab], since 1.2.0.
- You can assign position of tabs left or right, since 1.2.0.
- You can choose the scroll bar on or off. Since 1.2.0.
- You can assign font size for tabs. Since 1.2.1.
For more information
Please visit http://sabaoh.sakura.ne.jp/wordpress/ . In Japanese only.
If you need information in English, please contact to age.yamada@kxa.biglobe.ne.jp .
Screenshots
Installation
- Download and extract the Rollover Tab archive file into your wordpress/wp-content/plugins/ folder.
- Access your site. Go to dashboard. And activate this plugin.
- Then edit your posts or pages with shortcodes added.
FAQ
- My tabs are NOT displayed in line. They looks like steps down.
-
You DID insert some line breaks between two shortcodes with rich text editor, did’nt you?
For example:
[rollover-tabs] [rollover-tab name="tab1" label="Sample1"] Sample This is a sample. [/rollover-tab] [rollover-tab name="tab2" label="For example"] Example This is example. [/rollover-tab] [/rollover-tabs]
Show above is incorrect. Below one is correct.
[rollover-tabs][rollover-tab name="tab1" label="Sample1"] Sample This is a sample. [/rollover-tab][rollover-tab name="tab2" label="For example"] Example This is example. [/rollover-tab][/rollover-tabs]
- I want to my tabs switch when it’s clicked.
-
In [rollover-tabs] shortcode, please set norollover attribute true”.
For example:
[rollover-tabs norollover="true"][rollover-tab name="tab1" label="Sample1"] Sample ...
- I want to make 2 [rollover-tabs] in one post.
-
In [rollover-tabs] shortcode, please set name attribute some unique name.
For example:
[rollover-tabs name="tabs1"][rollover-tab name="tab1" label="Sample1"] Sample ... [/rollover-tab][/rollover-tabs] ... [rollover-tabs name="tabs2"][...
Contributors & Developers
“Rollover Tab” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Rollover Tab” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.3.2
- This plugin became running correctly without removing the wptexturize filter.
1.3.1
- Became removing the wptexturize filter, due to conflict with this plugin.
1.2.1
- Font attribute was added.
- border color and thickness moved from php to css.
1.2.0
- Theme proof positioning was innovated. So margin” attribute’s default value changed from -26px” in php to 0” in css.
- Nested shortcode will proceed between [rollover-tab …] and [/rollover-tab].
- You can assign position of tabs left or right.
- You can choose the scroll bar on or off.
1.1.0
- You can choose the border on or off.
- You can adjust position of top border.
- You can assign height of panels.
1.0.2
stylesheet improved.
1.0.1
click-needed-swithing bug fix.
1.0.0
the first release.