In this example we use the [bw_jq] shortcode to cycle through the set of plugins that define the basic functionality of the oik-plugins server.
oik – oik information kit
oik block shortcode and API server
The oik block, shortcode and API server enables you to document blocks, shortcodes and APIs for your plugins and themes.
oik-fields – custom post type field APIs
Performant Application Programming Interface for entry and display of meta data for custom post types.
oik-plugins – WordPress plugins server
Deliver your FREE and Premium WordPress plugins from your own WordPress like plugin server.
How it works
Four shortcodes are used to create the result.
[bw_jq .cycle method=cycle fx=fade script=cycle.all fit=1 width=”100%” ]
Use the [bw_jq] shortcode to invoke some jQuery code. Invoke the method called cycle with parameter fx=fade on the CSS selector .cycle. The script file source is jquery.cycle.all.js Additional parameters ( fit=1 and width=”100%” ) help make the cycle responsive. If you adjust the window size then the cycling area also adjusts.
[div class=”cycle”]
Create a div with the CSS selector .cycle. Additionally we need some CSS to make sure that the container and images within it are responsive.
div.cycle { width: 100% !important; min-height: 300px !important;}
div.cycle img { max-width: 100% !important }
The !important parts are very important.
[bw_pages post_type=”oik-plugins” include=2384,2393,395,5025]
Display the posts identified in the include= parameter which are of post_type “oik-plugins”.
[ediv]
End the div we started earlier.
For more information
- bw_css – Add internal CSS styling
- bw_jq – Perform a jQuery method
- bw_pages – Display page thumbnails and excerpts as links
- div – start a <div> tag
- ediv – end a <div> with </div>
See also
hover to slideToggle source
