Lightbulb (Editor Tool)
Define and insert shortcodes with Innovation+Science theme new tool
With this feature placing and configuring shortcodes is easy like never before. Lightbulb is a special unique tool that allows to choose, define and quickly insert shortcode into the selected place in editor. With this tool you can make a full use of I+S2 shortcodes and add into content: buttons, galleries, text frames, post/page box, dividers, create columns etc.
The big advantage of this feature is that it works for both editors – HTML and Visual editor. The option that activates it is placed right above the editor – look for the Lightbulb icon! After clicking on this option just select a shortcode from the list, setup your shortcode and insert it into the editor. When shortcode is in the editor you can still manually adjust some values in the code if you would like to change your previous settings.
Each shortcode has its own panel with options and you can use it to choose the parameters and values with just a few clicks. Here is a simple example of how the Lightbulb feature works with one of the shortcodes – dcs_box.
Example: How Lightbulb feature works
After clicking on Lightbulb icon a shortcode dcs_box was selected from drop down list. Right below this list you will see an option panel that allows to define various shortcode parameters.
When the shortcode setup in the Lightbulb options is ready, click on Insert option and the shortcode will show up in the editor. Here is how our example code for dcs_box generated with Lightbulb will look like in editor:
[color="#FFFFFF" bcolor="#FFFFFF" bgcolor="#3399CC" align="center" rounded="5" bwidth="0" padding="10px 20px 14px 20px" font="Trebuchet MS" fsize="14" ] Your content here [/dcs_box]
Below you can see the effect created with this simple shortcode: