Standard Shortcodes
Take a look at some possibilities that offer you shortcodes in Innovation+Science 2 theme. You will find here a demonstration of all Standard shortcodes – like all shortcodes in this theme you can setup them with special Lightbulb editor tool – this allows you to define all parameters and content for selected shortcode. To read more about other shortcodes and Lightbulb feature check links below:
01. Small heading with underline (dcs_head)
02. Standard Button (dcs_btn)
03. Hidden Content Button (dcs_hidden)
04. Text Span (dcs_span)
05. Text Highlight (dcs_highlight)
06. Empty block (dcs_empty) and Clear block (dcs_clear)
07. Line separator with Top link (dcs_top)
08. Fancy Header (dcs_fancy_header)
09. Small Text Block (dcs_small_block)
10. Lightbox Text Link (dcs_lb_link)
11. NGG image Lightbox Text Link (dcs_lb_ngg)
12. Blockquote (dcs_blockquote)
13. Lists shortcode (dcs_ul_list)
14. Content Box (dcs_box)
15. Note Text Block (dcs_note)
16. Post Box (dcs_postbox)
17. Page Box (dcs_pagebox)
01. Small heading with underline (dcs_head)
Simple text in div with underline. Can be used also to insert a dividing line (no text inside).
• Example 1: Text with underline
[dcs_head top="0" color="#666666"]Heading text here[/dcs_head]
• Example 2: Just a divider line
[dcs_head top="0" color="#666666"] [/dcs_head]
• Example 3: Text with underline and not default color
[dcs_head top="0" color="#994400"]Heading text here[/dcs_head]
02. Standard Button (dcs_btn)
Simple button shortcode to create links to other pages or sites.
• Example: Button with URL path
[dcs_btn name="Button Name" url="http://digitalcavalry.com/themeforest/live/wp/innovationscience2"]
03. Hidden Content Button (dcs_hidden)
Creates a button with some title and hidden content. Inside this shortcode it is possible to use other shortcodes. The content shows up after click.
• Example 1: Hidden content (some text inside)
[dcs_hidden title="Some Text For Title" color="#555555" ]Lorem ipsum...[/dcs_hidden]
• Example 2: Hidden content (more content and image shortcode inside)
Lorem ipsum dolor sit amet, donec at massa sed sed iaculis, amet volutpat, lobortis amet ut et, at ut. Dui mauris, elit rutrum, in tortor etiam tempus. Viverra libero aliquid non adipiscing elementum. Fermentum in neque. Dolor lorem nec libero pellentesque ut duis, et dolore eros nec, tortor qui, risus maecenas ullamcorper vestibulum enim viverra wisi, itaque adipiscing sed ut tempor interdum.
Rutrum augue at dolor neque, quam vel sed ligula, magna egestas cras congue nullam, malesuada ut blandit consectetuer nunc fringilla sem. Libero laoreet donec arcu eros erat sed, adipiscing felis vel aliquam in, tincidunt mollis porro, pede metus eu aenean, duis cum ut non proin pede etiam. Pellentesque velit pellentesque consectetuer id nec. Eget bibendum in, sed duis sit fusce, libero rutrum, mus in vel. Class est ornare, felis mi lobortis magna posuere, orci consectetuer dictum eget facilisis lorem rem.
Tellus massa adipiscing morbi suscipit, non condimentum molestie. Sem eu ac, vulputate non suscipit nisl ligula volutpat, aliquet placerat vel at non, et fermentum eget. Aliquam sit sit condimentum orci dictum, pede aliquam ultricies suscipit nec eget. Nec aliquam leo velit nam id mattis. Tempor commodo ac et, tellus per integer at suspendisse. Diam feugiat vivamus montes iaculis, quam duis sodales iaculis morbi. Augue tempus nec quis metus quis, rhoncus eros vivamus lacus et leo et, quam aliquet, fermentum ante vehicula suspendisse lorem, non integer donec eu ut. Vulputate massa risus. Curabitur lectus ligula tortor nam in, cursus hac sed rhoncus eget blandit scelerisque, rerum amet, pellentesque nullam, et placerat ac diam. Pellentesque gravida arcu tortor, lectus accumsan, at elit maecenas.
Ultrices aenean, nullam consequat vel ligula per. Quis sit tincidunt ac, ligula ornare at fusce tellus sapien et. Proin et aenean hymenaeos praesent, litora eget turpis pellentesque a ut, eros arcu velit tempor eget, donec lacinia consectetuer fames, urna eget gravida et eros. At orci blandit vehicula feugiat, nisl sed vivamus purus etiam non, amet dolor. Porttitor dignissim pellentesque cursus, dapibus lacus pede nulla. Accumsan amet cras velit sed modi nullam, sed scelerisque vel mattis lectus.
Sem elementum parturient erat lectus auctor, gravida et, nostrud libero lorem donec, suspendisse sit tincidunt. Proin dolor mattis, convallis nec non sed, phasellus nulla pretium bibendum eget luctus turpis. Litora rutrum mi at suscipit, adipiscing nibh urna, imperdiet pede amet. Ipsum elit ut blandit, condimentum nunc semper duis duis, sem vitae, placerat et blandit.
[dcs_hidden title="Some Text For Title" color="#555555" ]Lorem ipsum...[/dcs_hidden]
04. Text Span (dcs_span)
Can be used to change the color of some text inside paragraph.
• Example 1: Text color
Lorem ipsum dolor sit amet, donec at massa sed sed iaculis, amet volutpat, lobortis amet ut et, at ut. Your content here. Dui mauris, elit rutrum, in tortor etiam tempus. Viverra libero aliquid non adipiscing elementum. Fermentum in neque.
...lobortis amet ut et, at ut. [dcs_span color="#3EAD41" ]Your content here.[/dcs_span] Dui mauris, elit rutrum...
• Example 2: Text background color
Lorem ipsum dolor sit amet, donec at massa sed sed iaculis, amet volutpat, lobortis amet ut et, at ut. Your content here. Dui mauris, elit rutrum, in tortor etiam tempus. Viverra libero aliquid non adipiscing elementum. Fermentum in neque.
...lobortis amet ut et, at ut. [dcs_span bgcolor="#7EED81" ] Your content here. [/dcs_span] Dui mauris, elit rutrum...
05. Text Highlight (dcs_highlight)
Can be used to create a highlighted text. Works similar to dcs_span from example two, but a default background color is used. With text color option in Lightbulb it is also possible to change text color.
• Example: Highlighted text
Lorem ipsum dolor sit amet, donec at massa sed sed iaculis, amet volutpat, lobortis amet ut et, at ut. Your content here. Dui mauris, elit rutrum, in tortor etiam tempus. Viverra libero aliquid non adipiscing elementum. Fermentum in neque.
...lobortis amet ut et, at ut. [dcs_highlight]Your content here.[/dcs_highlight] Dui mauris, elit rutrum...
06. Empty block (dcs_empty) and Clear block (dcs_clear)
Creates an empty block with any height – you can define height with parameter in Lightbulb tool. This shortcode is useful when you want to create some vertical space between content, or/and clear the floating to start from new line (generates a div with clear-both).
• Example: shortcode for vertical space of 20px height (no live example as it generates just an empty space…)
[dcs_empty h="20" /]
[dcs_clear h="20" /]
07. Line separator with Top link (dcs_top)
Creates a simple divider – a line with “Top” link on the right side that moves to the top of your site.
• Example: a Top divider (only the code is presented in this example – you will see this shortcode effect as a separator before each shortcode on this page)
[dcs_top top="5" bottom="5" /]
08. Fancy Header (dcs_fancy_header)
Allows to create a special headers on page. In Lightbulb options you can set parameters for this shortcode, like for example: text color, text margins, header margins, text position inside header (left, right, center), header position (left, right, center).
• Example 1: standard small fancy header with text color setting
[dcs_fancy_header margin="0px 0px 10px 0px" smargin="0px auto 0px auto" width="0" align="left" salign="center" color="#3399CC"] Your content here [/dcs_fancy_header]
• Example 2: small fancy header with text color setting, center position, 600px width parameter and bold text
[dcs_fancy_header margin="0px 0px 10px 0px" smargin="10px auto 10px auto" width="600" align="center" salign="center" color="#4BCC6E"] <strong>Your content here</strong> [/dcs_fancy_header]
09. Small Text Block (dcs_small_block)
Use it to create a simple text block. In Lightbulb tool you can change font size and line height, text color, border, padding, text align etc.
• Example 1: a small text block with default settings
[dcs_small_block border="false" align="left" bcolor="#DDDDDD" fheight="14" fsize="11"]Lorem ipsum...[/dcs_small_block]
• Example 2: a small text block with border and some modified settings
[dcs_small_block color="#2D8CB5" border="true" padding="10px 10px 10px 10px" align="center" bcolor="#5892DD" bgcolor="#C7EAFF" fheight="17" fsize="14"]Lorem ipsum...[/dcs_small_block]
10. Lightbox Text Link (dcs_lb_link)
Creates a text link to Lightbox – allows to display images and videos embeded on Vimeo or YouTube.
• Example 1: text link to Vimeo video displayed in Lightbox
[dcs_lb_link title="Link to video on Vimeo" url="http://vimeo.com/13884675"]Link to video on Vimeo[/dcs_lb_link]
• Example 2: text link to some image displayed in Lightbox
[dcs_lb_link color="#B87400" title="Photo: Tim Wang, BMW 5 GT Chinese Launch" url="http://digitalcavalry.com/.../BMW5_GT_ChLaunch.jpg"]Link to image[/dcs_lb_link]
11. NGG image Lightbox Text Link (dcs_lb_ngg)
Creates a text link to Lightbox – you can display a single image from gallery created with NextGEN Gallery plugin. You can select a photo by picture ID number.
• Example: text link to NGG image displayed in Lightbox
Lamborghini Murcielago LP670-4 SV’s Chinese Debut
[dcs_lb_ngg color="#A60741" id="306"]Lambo...[/dcs_lb_ngg]
12. Blockquote (dcs_blockquote)
Creates a blockquote – in Lightbulb tool it is possible to set width and margins parameters, plus also text align, float, author name and description etc.
• Example 1: Blockquote with default settings and 500px width parameter (float set to: left, text align set to: center)
This is some blockquote text. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[dcs_blockquote margin="0px 0px 15px 0px" width="500" author="John Smith" title="Some Author Description" align="center"] This is some blockquote... [/dcs_blockquote]
• Example 2: Blockquote with 600px width parameter and text color (float set to: right, text align set to: left)
This is some blockquote text. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[dcs_blockquote margin="0px 0px 15px 0px" color="#769923" width="600" float="right" border="false" author="Author Name" title="Some Author Description" align="left"] This is some blockquote... [/dcs_blockquote]
13. Lists shortcode (dcs_ul_list)
This list shortcode allows you to choose list type in Lightbulb tool – all list types preview you can check on Typography example page.
• Example: List type “Accept”
- list item
- list item
- list item
[dcs_ul_list type="accept"] <li>list item</li> <li>list item</li> <li>list item</li> [/dcs_ul_list]
14. Content Box (dcs_box)
Creates a content box – this shortcode can be useful to create some special frames with important text information or just to create some great design composition. In Lightbulb tool setting you can use options to change colors, alignment, rounded corners, or even set a background image.
• Example 1: Blue content box with some text and rounded corners setting
[color="#FFFFFF" bcolor="#FFFFFF" bgcolor="#3399CC" align="center" rounded="5" bwidth="0" padding="10px 20px 14px 20px" font="Trebuchet MS" fsize="14" ] This box was created with dcs_box shortcode... [/dcs_box]
• Example 2: Dark content box with some text, sharp corners, and background pattern image
[dcs_box color="#A60741" bcolor="#A60741" bwidth="3" bgcolor="#FFFFFF" align="center" rounded="0" padding="10px 20px 14px 20px" font="Helvetica" fsize="14" bg="http://digitalcavalry.com/.../carbon.png" bgrepeat="repeat" ] With various shortcode parameters... [/dcs_box]
15. Note Text Block (dcs_note)
Creates a text content box, can be used to add some special text notes inside content of a page. In Lightbulb tool setting you can use options to change colors, text alignment, and rounded corners size.
• Example: Text note with default settings
[dcs_note color="#606060" bcolor="#F1F1F1" bgcolor="#FFFBCC"]Your content here[/dcs_note]
16. Post Box (dcs_postbox)
Displays a special box with post image, description, and a link to post page. In Lightbulb options you can choose from 3 box sizes, add some other text description (by default post excerpt is used), change the number of words displayed for description, or change the float. This shortcode is perfect for adding a link to post page inside some other page text content.
• Example 1: Two Post Box shortcodes with small and medium size setting (small with float left, and medium a bit lower with float right setting)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[dcs_postbox id="227" type="small-190" words="12" margin="0px 20px 0px 0px" float="left" /]
[dcs_postbox id="216" type="medium-225" desc="For post box you can also add your own description instead of post..." /]
• Example 2: Post Box with big size setting (float left)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
[dcs_postbox id="234" type="large-300" words="12" margin="0px 20px 0px 0px" float="left" /]
17. Page Box (dcs_pagebox)
In I+S2 theme, for each page in Custom Page Settings you can add a page image. This Page Box shortcode displays a special box with page image, description, and a link to page. In Lightbulb options you can choose from 3 box sizes, add some other text description (by default page content text is used), change the number of words displayed for description, or change the float. This shortcode is perfect for adding a link to page inside some other page/post text content.
• Example 1: Two Page Box shortcodes with small and medium size setting (small with float left, and medium a bit lower with float right setting)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[dcs_pagebox id="247" type="small-190" words="12" margin="0px 20px 0px 0px" float="left" /]
[dcs_pagebox id="247" type="medium-225" desc="For page box you can also add your own description instead of page text..." /]
• Example 2: Page Box with big size setting (float left)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
[dcs_pagebox id="247" type="large-300" words="12" margin="0px 20px 0px 0px" float="left" /]
