Se connecter Recherche

EVOLUTION

SHORTCODES PACK


EVOLUTION Shortcodes Pack

General information

EVOLUTION integrates a set of shortcodes that allow you to create unique presentations

All these shortcodes are available after installing and activating the EVOLUTION theme and plugin EVOLUTION Shortcodes Pack. These shortcodes can be used in all content integration field (dedicated widget, metabox, happy, WooCommerce product description, …) . They can be nested to build a layout advanced content.

the access is done with the button Insert shortcode present on the WordPress visual editor and the dedicated widget. Each shortcode has many option which let you create the element you need.

epica design

List of shortcodes

Interface and selection of shortcodes

The use shortcodes interface has been constructed to be as intuitive as possible.

To click on the button Insert shortcode , a pop-up window will appear offering you the various functionalities:

  • A link to the documentation of shortcodes
  • A link to the support forum
  • A link to epicadesign.fr, editor plugin
  • A search box allowing you to filter the shortcodes
  • Filters for reduce the display according to your choice

to insert a shortcode in your content:

  1. Click the shortcode of your choice
  2. Define the parameters and content of this shortcode in the dedicated interface.
  3. Click on Insert shortcode
  4. The shortcode was added to your page content.


epica design

Interweaving of shortcodes

You can perfectly nested the shortcodes into each other to create your content. By cons, you should never nested 2 identical shortcodes. example:

[ fullsection …][ notifications …] Your Content …[ /notifications][ /fullsection]
[ fullsection …][ fullsection …] Your Content … [ /fullsection][ /fullsection]

Special cases

Some shortcodes have specific use to maximize their visitor side rendering, show the:

Shortcodes Columns series

With the shortcodes engine you can generate responsive columns width equivalent to 100%, 66%, 50%, 33% or 25% of the width of the element in which they are inserted . For proper visual display (alignment of content or partial use of the width of the container), you can place your shortcode insertcolumns in the shortcode Clear Columns . This step is not mandatory but will optimize the insertion of columns with all your content (removing any moving elements).

Exemple:

[ cleanerwrapper][ insertcolumn style= »50% » …]Your Content …[ /insertcolumn][ /cleanerwrapper]
[ insertcolumn style= »25% »]Your Content …[ /insertcolumn] [ insertcolumn style= »25% »]Your Content …[ /insertcolumn]

With the second line, you will still see your content as columns, but a slight shift in content may occur. He may still be helpful to your needs.


Shortcodes Tabs series

The shortcode [ Tabs] for generate a base consisting of 3 tabs and 3 related content. Use the shortcode Tab for add as many tabs as desired. Insert the shortcode [ Tab] between the tags [ Tabs] and [ /Tabs] .

Exemple:

[ tabs style= »default »][ tab title= »Title 1″]Content 1 …[ /tab] [ tab title= »Title 2″]Content 2 …[ /tab] [ tab title= »Title 3″]Content 3 …[ /tab][ /tabs]
[ tabs style= »default »][ tab title= »Title 1″]Content 1 …[ /tab] [ tab title= »Title 2″]Content 2 …[ /tab] [ tab title= »Title 3″]Content 3 …[ /tab][ tab title= »My other tab »]Tab content …[ /tab][ /tabs]
[ tabs style= »default »][ tab title= »Title 1″]Content 1 …[ /tab] [ tab title= »Title 2″]Content 2 …[ /tab] [ tab title= »Title 3″]Content 3 …[ /tab][ /tabs][ tab title= »My other tab »]Tab content …[ /tab]

Line of shortcode [ Tab] used outside tags [ Tabs] will be ignored and will not be displayed side site visitor


Parameter shortcode types source: media xxxx

Pack shortcodes uses id (id_attachement) images in the feedback posted on your editor. If you want to edit a picture stored in a shortcode, you first must get his id. To retrieve a id_attachement:

  1. Visit the Media menu > library
  2. Select the image that you want to retrieve the id
  3. On the page showing you the image, click Get short link
  4. A pop-up window opens. id attachment is the figure at the end of the url

epica design
epica design

Global values

Values ​​animations

Here are the values ​​that can be used animations in shortcodes

NoAnimation, rollIn, rollOut,hinge,flash,rubberBand, bounce, shake, tada, swing, wobble, pulse, flip, flipInX, flipOutX, flipInY, flipOutY, fadeIn, fadeInUp, fadeInDown, fadeInLeft, fadeInRight, fadeInUpBig, fadeInDownBig, fadeInLeftBig, fadeInRightBig, fadeOut, fadeOutUp, fadeOutDown, fadeOutLeft, fadeOutRight, fadeOutUpBig, fadeOutDownBig, fadeOutLeftBig, fadeOutRightBig, slideInDown, slideInLeft, slideInRight, slideOutUp, slideOutLeft, slideOutRight, bounceIn, bounceInDown, bounceInUp, bounceInLeft, bounceInRight, bounceOut, bounceOutDown, bounceOutUp, bounceOutLeft, bounceOutRight, rotateIn, rotateInDownLeft, rotateInDownRight, rotateInUpLeft, rotateInUpRight, rotateOut, rotateOutDownLeft, rotateOutDownRight, rotateOutUpLeft, rotateOutUpRight, lightSpeedIn, lightSpeedOut.

You can see the animations showcased by following this link see the list of animations


Values ​​icons (Font awesome V4.2)

EVOLUTION uses icons Font Awesome police, giving you the choice from a list of more than 450 icons. You can view them by following this link see the list of icons

Here are the values ​​that can be used icons in shortcodes

adjust, anchor, archive, arrows, arrows-h, arrows-v, asterisk, car, ban, university, bar-chart-o, barcode, bars, beer, bell, bell-o, bolt, bomb, book, bookmark, bookmark-o, briefcase, bug, building, building-o, bullhorn, bullseye, taxi, calendar, calendar-o, camera, camera-retro, car, caret-square-o-down, caret-square-o-left, caret-square-o-right, caret-square-o-up, certificate, check, check-circle, check-circle-o, check-square, check-square-o, child, circle, circle-o, circle-o-notch, circle-thin, clock-o, cloud, cloud-download, cloud-upload, code, code-fork, coffee, cog, cogs, comment, comment-o, comments, comments-o, compass, credit-card, crop, crosshairs, cube, cubes, cutlery, tachometer, database, desktop, dot-circle-o, download, pencil-square-o, ellipsis-h, ellipsis-v, envelope, envelope-o, envelope-square, eraser, exchange, exclamation, exclamation-circle, exclamation-triangle, external-link, external-link-square, eye, eye-slash, fax, female, fighter-jet, file-archive-o, file-audio-o, file-code-o, file-excel-o, file-image-o, file-video-o, file-pdf-o, file-image-o, file-image-o, file-powerpoint-o, file-audio-o, file-video-o, file-word-o, file-archive-o, film, filter, fire, fire-extinguisher, flag, flag-checkered, flag-o, bolt, flask, folder, folder-o, folder-open, folder-open-o, frown-o, gamepad, gavel, cog, cogs, gift, glass, globe, graduation-cap, users, hdd-o, headphones, heart, heart-o, history, home, picture-o, inbox, info, info-circle, university, key, keyboard-o, language, laptop, leaf, gavel, lemon-o, level-down, level-up, life-ring, lightbulb-o, location-arrow, lock, magic, magnet, share, reply, reply-all, male, map-marker, meh-o, microphone, microphone-slash, minus, minus-circle, minus-square, minus-square-o, mobile, money, moon-o, graduation-cap, music, bars, paper-plane, paper-plane-o, paw, pencil, pencil-square, pencil-square-o, phone, phone-square, picture-o, plane, plus, plus-circle, plus-square, plus-square-o, power-off, print, puzzle-piece, qrcode, question, question-circle, quote-left, quote-right, random, recycle, refresh, reply, reply-all, retweet, road, rocket, rss, rss-square, search, search-minus, search-plus, paper-plane, paper-plane-o, share, share-alt, share-alt-square, share-square, share-square-o, shield, shopping-cart, sign-in, sign-out, signal, sitemap, sliders, smile-o, sort, sort-alpha-asc, sort-alpha-desc, sort-amount-asc, sort-amount-desc, sort-asc, sort-desc, sort-numeric-asc, sort-numeric-desc, sort-asc, space-shuttle, spinner, spoon, square, square-o, star, star-half, star-half-o, star-o, suitcase, sun-o, tablet, tachometer, tag, tags, tasks, taxi, terminal, thumb-tack, thumbs-down, thumbs-o-down, thumbs-o-up, thumbs-up, ticket, times, times-circle, times-circle-o, tint, caret-square-o-down, caret-square-o-left, caret-square-o-right, caret-square-o-up, trash-o, tree, trophy, truck, umbrella, university, unlock, unlock-alt, sort, upload, user, users, video-camera, volume-down, volume-off, volume-up, exclamation-triangle, wheelchair, wrench, file, file-archive-o, file-audio-o, file-code-o, file-excel-o, file-image-o, file-video-o, file-o, file-pdf-o, file-powerpoint-o, file-audio-o, file-text, file-text-o, file-video-o, file-word-o, circle-o-notch, refresh, spinner, check-square, check-square-o, circle, circle-o, dot-circle-o, minus-square, minus-square-o, plus-square, plus-square-o, square, square-o, btc, jpy, eur, gbp, inr, jpy, krw, money, rub, try, usd, align-center, align-justify, align-left, align-right, bold, link, chain-broken, clipboard, columns, eraser, file, file-o, file-text, file-text-o, files-o, floppy-o, font, header, indent, italic, link, list, list-alt, list-ol, list-ul, outdent, paperclip, paragraph, clipboard, repeat, undo, scissors, strikethrough, subscript, superscript, table, text-height, text-width, th, th-large, th-list, underline, angle-double-down, angle-double-left, angle-double-right, angle-double-up, angle-down, angle-left, angle-right, angle-up, arrow-circle-down, arrow-circle-left, arrow-circle-o-down, arrow-circle-o-left, arrow-circle-o-right, arrow-circle-o-up, arrow-circle-right, arrow-circle-up, arrow-down, arrow-left, arrow-right, arrow-up, arrows, arrows-alt, arrows-h, arrows-v, caret-down, caret-left, caret-right, caret-square-o-down, caret-square-o-left, caret-square-o-right, caret-square-o-up, caret-up, chevron-circle-down, chevron-circle-left, chevron-circle-right, chevron-circle-up, chevron-down, chevron-left, chevron-right, chevron-up, hand-o-down, hand-o-left, hand-o-right, hand-o-up, long-arrow-down, long-arrow-left, long-arrow-right, long-arrow-up, arrows-alt, backward, compress, eject, expand, fast-backward, fast-forward, forward, pause, play, play-circle, play-circle-o, step-backward, step-forward, stop, youtube-play, adn, android, apple, behance, behance-square, bitbucket, bitbucket-square, btc, codepen, css3, delicious, deviantart, digg, dribbble, dropbox, drupal, empire, facebook, facebook-square, flickr, foursquare, git, git-square, github, github-alt, github-square, gittip, google, google-plus, google-plus-square, hacker-news, html5, instagram, joomla, jsfiddle, linkedin, linkedin-square, linux, maxcdn, openid, pagelines, pied-piper, pied-piper-alt, pinterest, pinterest-square, qq, rebel, reddit, reddit-square, renren, share-alt, share-alt-square, skype, slack, soundcloud, spotify, stack-exchange, stack-overflow, steam, steam-square, stumbleupon, stumbleupon-circle, tencent-weibo, trello, tumblr, tumblr-square, twitter, twitter-square, vimeo-square, vine, vk, weibo, weixin, windows, wordpress, xing, xing-square, yahoo, youtube, youtube-play, youtube-square, ambulance, h-square, hospital-o, medkit, plus-square, stethoscope, user-md, wheelchair, angellist, area-chart, at, bell-slash, bell-slash-o, bicycle, binoculars, birthday-cake, bus, calculator, cc, cc-amex, cc-discover, cc-mastercard, cc-paypal, cc-stripe, cc-visa, copyright, eyedropper, futbol-o, google-wallet, ils, ioxhost, lastfm, lastfm-square, line-chart, meanpath, newspaper-o, paint-brush, paypal, pie-chart, plug, slideshare, toggle-off, toggle-on, trash, tty, twitch, wifi, yelp

If you grind your value icons from the official page Font Awesome, please only use the name specified icons. example :

 <i class="fa fa-building"></i> fa-building

for in your code shortcode similar value to :

[  vectoricon icon="icon: building" ...

Shortcodes included in the pack

All parameters of shortcodes with indicative …themeare related to the choice of color selected in the option panel of the theme


Clear columns

Alignment content for the shortcode Columns

[  cleanerwrapper anim="fadeIn" style="text-center" class=""]Remove this text and Insert your Row here[  /cleanerwrapper]
Fields Parameters
anim animation – example: fadeIn – accepted values: animations values
style content alignment – example: text-right – accepted values: text-left, text-center, text-right
class insert a custom CSS class
content This field is provided for the insertion, after validation, of the shortcodes Columns between [ cleanerwrapper …] … [ /cleanerwrapper]


Columns

Create a column

[  cleanerwrapper class=""][  insertcolumn style="50%"]Content[  /insertcolumn][  insertcolumn style="25%"]Content[  /insertcolumn][  /cleanerwrapper]
Fields Parameters
style column width – example: 50% – accepted values: 25%, 33%, 50%, 66%, 75%, 100%
align content alignment – example: text-right – accepted values: text-left, text-center, text-right
paddinglft left spacing of content, in pixels – example: 40 – accepted values: number
paddingrgt right spacing of content, in pixels – example: 40 – accepted values: number
anim animation – example: fadeIn – accepted values: animations values
class insert a custom CSS class
content This field is provided for insertion of your content


Full Section

Create a section displayed in full screen width (only if the vertical sidebars are not present on the page) or full width of the container

[  fullsection margin="32" padding="56" source="media: 2091" backgroundcolor="#b59090" bordertop="5" bordertopcolor="#ecc9c9" borderbottom="4" borderbottomcolor="#d5a3a3" forcefull="yes" animate="fadeIn" class="myclass"]my content[  /fullsection]
Fields Parameters
margintop top outer spacing, in pixels, of the element with the page content – example: 5 – accepted values: number
marginbot bottom outer spacing, in pixels, of the element with the page content – example: 5 – accepted values: number
paddingtop top interior spacing, in pixels, of the contents with the edges of the element – example: 5 – accepted values: number
paddingbot bottom interior spacing, in pixels, of the contents with the edges of the element – example: 5 – accepted values: number
sectionbg media picture used as background element – example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide34.jpg – accepted values: url de l’image
backgroundcolor background color of the element – example: #91c225 – accepted values: hexadecimal color code
bordertop thickness, in pixels, of the top border – example: 5 – accepted values: number
bordertopcolor color of the top border – example: #f1592a – accepted values: hexadecimal color code
borderbottom thickness, in pixels, of the bottom border – example: 5 – accepted values: number
borderbottomcolor color of the bottom border – example: #f1592a – accepted values: hexadecimal color code
forcefull element displayed in full screen width – accepted values: yes, no
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Wrapper

Create a custom section using different parameters such as the width, the edge, the spacing, etc…

[  customwrap style="inline-block" blockwidth="76" paddingtop="10" paddingbot="16" paddingright="14" paddingleft="16" border="2" bordercolor="#b27474" bordertype="dotted" borderradius="4" wrapbg="http://localhost/epicadesign/wp-content/uploads/2014/07/slide16.jpg" backgroundcolor="#a43f3f" anim="flipInX" class="yourcustomclass"]Your content[  /customwrap]
Fields Parameters
style alignment of the block in the content (block center automatically element) – example: inline-block – accepted values: block, inline-block
blockwidth width of the element relative to its container, as a percentage – example: 76 – accepted values: number de 1 à 100
paddingtop top interior spacing, in pixels, of the contents with the edge of the element – example: 5 – accepted values: number
paddingbot bottom interior spacing, in pixels, of the contents with the edge of the element – example: 5 – accepted values: number
paddingright right interior spacing, in pixels, of the contents with the edge of the element – example: 5 – accepted values: number
paddingleft left interior spacing, in pixels, of the contents with the edge of the element – example: 5 – accepted values: number
border thickness, in pixels, of the border – example: 5 – accepted values: number
bordercolor border color – example: #f1592a – accepted values: hexadecimal color code
bordertype border style – example: dotted – accepted values: solid, dotted, dashed, double
borderradius round the corners of the element, in pixels – example: 4 – accepted values: number
wrapbg media picture used as background element – example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide34.jpg – accepted values: url de l’image
backgroundcolor background color of the element – example: #91c225 – accepted values: hexadecimal color code
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Heading

Create a separation, a title or section heading.

[  headtitle style="general" title="title text" textcolor="clrdark" fontsize="fa-2x" anim="NoAnimation"]subtext for general title[  /headtitle]
Fields Parameters
style title style – example: general – accepted values: default, classic, general
title title text
icon insert an icon before the title text – example: user – accepted values: values ​​of Icons
textcolor title color – example: clrorange – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
fontsize enlarge the font of the title, is a multiplication – example: fa-2x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x, fa-6x, fa-mass (10x)
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for the insertion of text subtitle style general


Separator

Create a separation of content with a title

[  separator title="Separator title" bdcolor="bdgray" textcolor="clrvt" style="sep-doublethick" size="20" class="myclass"]
Fields Parameters
title separation title
color color of lines / borders of separator – example: sep-info – accepted values: bdwt, bdlight, bdgray, bddark, bdbk, bdtq, bdgreen, bdblue, bdbdk, bdorange, bdyellow, bdred, bdvt
textcolor text color – example: sep-txinfo – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
style separation line style – example: sep-dotted – accepted values: sep-stdefault, sep-solid, sep-dotted, sep-double, sep-thick, sep-doublethick, sep-dashed
size external vertical spacing, in pixels, between the edges of the element and the content – example: 20 – accepted values: number
class insert a custom CSS class


Divider

Create a separation of content

[  divider style="bdtq" margintop="20" marginbot="25" class=""]
Fields Parameters
style line color – example: bdtq – accepted values: bdwt, bdlight, bdgray, bddark, bdbk, bdtq, bdgreen, bdblue, bdbdk, bdorange, bdyellow, bdred, bdvt
margintop external vertical spacing, in pixels, between the top edge of the element and the content – example: 20 – accepted values: number
marginbottom external vertical spacing, in pixels, between the bottom edge of the element and the content – example: 20 – accepted values: number
class insert a custom CSS class


Spacer

Create a space in the content

[  spacer size="80" class=""]
Fields Parameters
size height of the space / element – example: 80 – accepted values: number
class insert a custom CSS class


Dropcap

Create a paragraph with a dropcap

[  dropcap radius="0" use="icone" value="B" color="bggreen" iconcolor="clrgray" icon="icon: ban" iconsize="fa-3x" link="#" title="Title of the dropcap" justify="table" anim="fadeIn" class="yourcustomclass"]Dropcap text content ...[  /dropcap]
Fields Parameters
use typeface used, alpha-numeric or icon – example: alpha – accepted values: alpha, icone
radius the dropcap is square or round – example: 0 – accepted values: 0, 50
color dropcap background color – example: bggreen – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
iconcolor dropcap content color – example: clrgray – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
value use an alpha-numeric character in the dropcap – example: A – accepted values: alpha-numeric character
icon use an icon in the dropcap – example: user – accepted values: values ​​of Icons
iconsize size of the content in dropcap – example: fa-3x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x
link url link by clicking the dropcap – example: # – accepted values: url
title title information from dropcap – example: Dropcap text content …
justify Define the alignment between the text and the dropcap – example: table – accepted values: block, table
reverse Define if the dropcap is placed in right or left – example: yes – accepted values: yes, no
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of contents dropcap


Anchor

Create an anchor or an anchor link

[  anchor type="link" id="anchor1" linktext="anchor link text" targetid="anchor1" class="555"]
Fields Parameters
type Create an anchor or an anchor link – example: link – accepted values: link, anchor
id id of the anchor, must be unique, no spaces or specials character- example: anchor1 – accepted values: text and/or number
linktext displayed text for a link to an anchor – example: anchor link text – accepted values: text
targetid id anchor targeted by the link – example: anchor1 – accepted values: text and/or number
class insert a custom CSS class


Icons

Insert icon from Font Awesome

[  vectoricon icon="icon: circle" iconsize="fa-3x" iconeffect="epc-icon-effect-2" bgcolor="bgbdk" iconcolor="clrred" bgsize="epc-icon-medium" link="#" anim="tada" class="yourcustomclass"]
Fields Parameters
icon reference of icon – example: icon: circle – accepted values: values ​​of Icons
iconsize icon size – example: fa-3x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x, fa-6x, fa-mass
iconeffect rollover effect – example: epc-icon-effect-2 – accepted values: epc-icon-noeffect, epc-icon-effect-2
bgcolor background color of the icon – example: bgbdk – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
iconcolor color of the icon – example: clrred – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
bgsize background size of the icon – example: epc-icon, – accepted values: epc-icon-medium, epc-icon, epc-icon-large, epc-icon-mass
link define a link to click the icon – example: # – accepted values: url
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class


Notification

Insert a notification box with animation

[  notification style="alert-success" title="title of notification" close="yes" anim="rubberBand" class="yourcustomclass"]notification text content ...[  /notification]
Fields Parameters
style preset style notification- example: alert-info – accepted values: alert-info, alert-success, alert-warning, alert-danger
title notification title – accepted values: texte
close link for masked this notification – example: yes – accepted values: yes, no
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Label

Insert a label

[  taglabel style="labeldft" bgcolor="bgbdk" bdcolor="bdblue" txtcolor="clrwt" anim="fadeIn" class="customclass"]Label content ...[  /taglabel]

txtcolortext color – example: clrblue – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone

Fields Parameters
bdcolor border color – example: bdorange – accepted values: bdwt, bdlight, bdgray, bddark, bdbk, bdtq, bdgreen, bdblue, bdbdk, bdorange, bdyellow, bdred, bdvt
bgcolor background color – example: bgblue – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
style size of label – example: labelmedium – accepted values: labelmin, labeldft, labelmedium, labelmax
anim anim this element – example: bounceInRightshow the animations list
class insert a custom CSS class
content This field is provided for insertion of your content


Tagline Box

Insert a box of content with animation and shadow effect

[  tagline bdstyle="bdtop" bdcolor="bdorange" anim="fadeIn" effect="effect2" class="yourcustomclass"]tagline box content ...[  /tagline]
Fields Parameters
bdstyle box style – example: bdtop – accepted values: bdmin, bdtop, bdbottom, bdleft, bdright, bdnone
bdcolor border color – example: bdorange – accepted values: bdwt, bdlight, bdgray, bddark, bdbk, bdtq, bdgreen, bdblue, bdbdk, bdorange, bdyellow, bdred, bdvt
anim animate this element – example: bounceInRightsee the list of animations
effect add shadow effect – example: effect3 – accepted values: effect0, effect1, effect2, effect3, effect4, effect5, effect6, effect7, effect8
class insert a custom CSS class
content This field is provided for insertion of your content


Custom text

Insert custom text

[  customtxt fontsize="22" fontweight="600" fontstyle="italic" textcolor="#d32727" paddingleft="13" paddingright="24" textalign="center" anim="fadeIn" class="yourcustomclass"]Your custom text ...[  /customtxt]
Fields Parameters
fontsize font size, in pixels – example: 22 – accepted values: number
fontweight thickness of the text – example: 400 – accepted values: 300, 400, 600, 700, 800, 900
fontstyle font style – example: italic – accepted values: inherit, normal, italic
textcolor text color – example: #eec1c1 – accepted values: hexadecimal color code
paddingleft inside spacing of the text, left, in pixels- example: 30 – accepted values: number
paddingright inside spacing of the text, right, in pixels – example: 30 – accepted values: number
textalign text alignment – example: center – accepted values: left, right, center
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Quote

Insert Quote, with or without notifying the author

[  quote fontsize="15" cite="" url="" animate="fadeIn" class=""]Quote content[  /quote]
Fields Parameters
font-size font size of the quote, in pixels – example: 15 – accepted values: number
cite author name
url author link (web page, website, …)
animate animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Button

Create a button from preset style

[  presetbutton btnstyle="btnreverse" btnsize="small" link="http://epicadesign.fr" target="blank" icon="icon: paper-plane" desc="go in epica design" center="yes" anim="fadeIn" class="yourcustomclass"]Our website[  /presetbutton]
Fields Parameters
btnstyle button preset style – example: btngray – accepted values: themebutton, btnwhite, btnreverse, btnlight, btngray, btnbk, btntq, btngreen, btnblue, btnbdk, btnyellow, btnorange, btnred, btnvt, btnlink
btnsize button size – example: medium – accepted values: nosize, small, medium, large
link button link – example: http://epicadesign.fr
target the link opens in the same window or a new – example: self – accepted values: blank, self
icon icon name – example: icon: desktop – accepted values: valeur des icones
desc description displayed in the button, in a smaller font
center center button – example: yes – accepted values: yes, no
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content main text of the button


Image

Insert a picture

[  addimage yourimg="http://localhost/epicadesign/wp-content/uploads/2014/07/slide21.jpg" wrapsize="67" imgalign="block" imgstyle="imgboxed" onzoom="yes" anim="fadeIn" class="yourcustomclass"]description for this image ...[  /addimage]
Fields Parameters
yourimg Image used in the media element – example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide21.jpg – accepted values: image url
wrapsize container size of the image, in percentage – example: 67 – accepted values: number de 1 à 100
imgalign alignment element – example: block – accepted values: block, inline – (la valeur block centre l’image)
imgstyle style of container – example: imgboxed – accepted values: imgclassic, imgboxed
onzoom activate lightbox Image – example: yes – accepted values: yes, no
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your description content of the image (not shown if empty).


Slider

Create an image slider

[  slider source="media: 2132,2131,2130" limit="24" pattern="pattern_2" height="430" portrait="yes" autoplay="no" hover="no" pagination="true" loader="pie" loaderpos="top" transition="curtainBottomLeft" time="5000" trans="1700" class=""]
Fields Parameters
source Image used in the media element – example: media: 2132,2131,2130 – accepted values: media: attachment_id of image
limit maximum number of images used in the element for recent posts, category and custom taxonomy – example: media: 8 – accepted values: number
pattern add a pattern images – example: pattern_2 – accepted values: pattern_no, pattern_1, pattern_2, pattern_3, pattern_4, pattern_5, pattern_6, pattern_7, pattern_8, pattern_9
height height of the slider, in pixels – example: 430 – accepted values: number
portrait crop images – example: yes – accepted values: yes, no
autoplay start the animation to open the page – example: yes – accepted values: yes, no
hover paused at mouseover- example: yes – accepted values: yes, no
pagination view thumbnails of images – example: true – accepted values: true, false
loader timer style – example: pie – accepted values: pie, bar, none
loaderpos timer position – example: top – accepted values: top, bottom
transition style des transitions entre les images – example: curtainBottomLeft – accepted values: random, simpleFade, curtainTopLeft, curtainTopRight, curtainBottomLeft, curtainBottomRight, curtainSliceLeft, curtainSliceRight, blindCurtainTopLeft, blindCurtainTopRight, blindCurtainBottomLeft, blindCurtainBottomRight, blindCurtainSliceBottom, blindCurtainSliceTop, stampede, mosaic, mosaicReverse, mosaicRandom, scrollLeft, scrollRight, scrollHorz, scrollBottom, scrollTop
time delay between two transitions, in ms – example: 5000
trans time of transition, in ms – example: 1000
class insert a custom CSS class


Carousel

Create an image carousel

[  carousel source="media: 115,92,91" style="infcar-default" limit="11" link="post" target="blank" items="4" pages="yes" autoplay="no" playspeed="3000" speed="600" class="yourcustomclass"]
Fields Parameters
source Media pictures used in the item – example: media: 115,92,91 – accepted values: media: attachment_id of image
style carousel preset style – example: infcar-default – accepted values: infcar-default
limit maximum number of images used in the element for recent posts, category and custom taxonomy- example: media: 8 – accepted values: max 16
link image link – example: post – accepted values: none, post, image – none pour aucun lien ; post (pour source = recents post) – lien vers l’article ; image – lien vers image en fullscreen
items number of visible images simultaneously – example: 3 – accepted values: number de 1 à 6
pages display the pagination – example: yes – accepted values: yes, no
autoplay start the animation to open the page – example: yes – accepted values: yes, no
playspeed delay between two transitions, in ms – example: 4000
speed time of transition, in ms – example: 600
class insert a custom CSS class


Progress bar

Create a progress bar

[  progressbar barcolor="#000" textcolor="#fff" value="50" height="22" width="75" striped="yes" class="yourcustomclass"]progress bar text[  /progressbar]
Fields Parameters
barcolor color of the progress bar – example: #000 – accepted values: hexadecimal color code
textcolor text color of the progress bar – example: #fff – accepted values: hexadecimal color code
value value of the progression, in percentage – example: 70 – accepted values: number de 1 à 100
height height of the progress bar, in pixels – example: 22 – accepted values: number
width width of the progress bar, in pixels – example: 75 – accepted values: number de 1 à 100
stripped active stripped – example: yes – accepted values: yes, no
class insert a custom CSS class
content This field is provided for insertion of your content.


Round charts

Presentation value with circular animation

[  roundchart value="80" valuecolor="clrblue" title="title of chart" titlecolor="clrgray" fontsize="fa-2x" size="220" sign="%" barcolor="#f1592a" barwidth="22" animtime="4000" class="yourcustomclass"]content after the chart[  /roundchart]
Fields Parameters
value numerical value of the chart – example: 80 – accepted values: number
icon icon reference – example: icon: desktop – accepted values: values ​​of Icons
chartcontent text inside the circle counter. The text is displayed after the icon – accepted values: text
valuecolor color of the numerical value of the chart – example: clrblue – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
title title of chart – accepted values: texte
titlecolor color of the chart title – example: clrgray – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
fontsize font size of the value of the chart – example: fa-2x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x, fa-mass
size width and height of the chart – example:220 – accepted values: number de 180 a 1000
barcolor color bar chart – example: #f1592a – accepted values: hexadecimal color code
barwidth width of the bar chart, in pixels – example: 20 – accepted values: number de 18 à 140
animtime duration of the animation, in milliseconds – example: 3000 – accepted values: number de 2000 à 4000
class insert a custom CSS class
content This field is provided for insertion of your content, additional information chart


Counter

Presentation of value with counter animated

[  counter value="540" aftervalue="Hours" icon="icon: cloud" iconcolor="clrgray" iconsize="fa-4x" valuecolor="clrblue" title="title of this counter" titlecolor="clrorange" class="yourcustomclass"]
Fields Parameters
style counter style: Vertical ou Horizontal – example: count-one – accepted values: count-one (vertical), count-two (horizontal)
value numerical value of the counter – example: 540 – accepted values: number
valuecolor color of the counter value (symbol included) – example: clrorange – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
aftervalue add text after the numeric value- example: Hours – accepted values: text
textsize Font size of the text after the numeric value, in pixels – example: 40 – accepted values: number
icon icon reference – example: icon: desktop – accepted values: values ​​of Icons
iconsize icon size – example: fa-3x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x, fa-6x, fa-mass
iconcolor icon color – example: clrgray – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
title counter title – accepted values: texte
titlecolor title color of the counter – example: clrgray – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
boxed add border on the counter – example: yes – accepted values: no, yes
class insert a custom CSS class


Service

Presentation of service, with or without link

[  boxservice style="modetwo" icon="icon: archive" iconsize="fa-3x" bgcolor="bgblue" iconcolor="clrlight" bgsize="epc-icon-large" link="#" title="service title" titlecolor="clrbk" anim="fadeIn" class="yourcustomclass"]service description ...[  /boxservice
Fields Parameters
style preset style for service – example: modetwo – accepted values: modeone, modetwo
icon icon name – example: icon: desktop – accepted values: values ​​of Icons
iconsize icon size – example: fa-3x – accepted values: fa-1x, fa-2x, fa-3x, fa-4x, fa-5x, fa-6x, fa-mass
bgcolor background color of the icon – example: bgblue – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
iconcolor icon color – example: clrlight – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
bgsize size of the background of the icon – example: epc-icon – accepted values: epc-icon-medium, epc-icon, epc-icon-large, epc-icon-mass
link icon link – example: # – accepted values: url
title service title
titlecolor title color – example: clrorange – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
anim animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Price box

displaying information with prices and specifications

[  pricebox style="bggreen" headcolor="clrred" size="pricetiers" feat="featured text" title="title of price box" price="149 $" sub="subtitle for this price box" background="#f5f5f5" class="yourcustomclass"]Price Box Content ... USE WP LIST[ /pricebox]
The field content can accept all inputs. We advise you a
    list type available in the wordpress editor, this element being designed for this box shortcode.
Fields Parameters
style pricebox color (header and footer) – example: bggreen – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
headcolor text color in the pricebox header – example: clrwt – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
size pricebox width – example: pricetiers – accepted values: pricefull (fullwidth), pricedemi (1/2), pricetiers (1/3), pricequart (1/4)
feat Text highlighted
title text or name of service/product
price price, indicate value/currency
background background color of the description – example: #eec1c1 – accepted values: hexadecimal color code
subtitle subtitle, after the price
class insert a custom CSS class
content This field is provided for insertion of your content


Members

Box presentation of member or team with content and link to social networks

[  members header="http://localhost/epicadesign/wp-content/uploads/2014/07/slide16.jpg" headerbg="bgorange" cutbg="bgblue" avatar="http://localhost/epicadesign/wp-content/uploads/2014/07/slide29.jpg" member="the member name" funt="the member function" furl="#" turl="#" gurl="#" durl="#" lurl="#" murl="#" animate="fadeIn" class="yourcustomclass"]Members Infos Content ...[  /members]
Links to social networks are displayed only if the field contains a value.
Fields Parameters
header media picture used as the background of the header box member – example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide16.jpg – accepted values: url
headerbg background color of the header of the box member- example: bgorange – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
cutbg color line separation of the member header box – example: bgblue – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
avatar media picture used as avatar / image member- example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide29.jpg – accepted values: url
member full name of the member
funt member function
furl facebook url – example: https://www.facebook.com/my_page_id
turl twitter url
gurl google url
durl dribble url
lurl linkedIn url
murl email adress (sends a triggered email by mailto)
animate animate this element – example: bounceInRightsee the list of animations
class insert a custom CSS class
content This field is provided for insertion of your content


Tabs

Insert content displayed as a list tabs.

[  tabs style="default" navstyle="nav-justified" class=""][  tab title="Title 1"]Content 1[  /tab] [  tab title="Title 2"]Content 2[  /tab] [  tab title="Title 3"]Content 3[  /tab][  /tabs]
Fields Parameters
style preset style – example: default – accepted values: default
navstyle style of navigation items – example: nav-classic – accepted values: nav-classic, nav-justified, nav-stacked
class insert a custom CSS class
content Basis of the list tab, change after inserting the shortcode in WordPress editor. This field is provided for inserting the shortcode Tab


Tab

Insert an additional tab to a tabbed list Tabs.

[  tabs style="default" class=""] [  tab title="Tab title" class=""]Tab content[  /tab] [  /tabs]
Fields Parameters
title tab title
class insert a custom CSS class
content tab content, to change after inserting the shortcode in WordPress editor.


Spoiler

Insert content displayed as fold accordion.

[  spoiler title="The spoiler title" style="default" open="yes" icon="arrow-down" class="yourcustomclass"]Hidden content[  /spoiler]
Fields Parameters
title spoiler title
open The spoiler is open or closed at the beginning of the page – example: yes – accepted values: yes, no
style preset spoiler style – example: default – accepted values: default
icon add icon before the title – example: chevron-down – accepted values: none, plus, plus-circle, plus-square-o, plus-square, arrow-down, arrow-circle-o-down, arrow-circle-down, chevron-down, chevron-circle-down, caret-down, caret-square-o-down, folder-open-o, folder-open
class insert a custom CSS class
content content of spoiler.


List

Insert a list.

[  epclist style="listclassic" icon="icon: asterisk" iconcolor="clrblue" textcolor="clrdark" size="16" class="yourcustomclass"]... USE WP LIST[ /epclist]
Fields Parameters
style preset list style – example: listbasic – accepted values: listbasic, listclassic
icon add icon display before the list item content – example: icon: asterisk – accepted values: values ​​of Icons
iconcolor icon color – example: clrblue – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
textcolor text color – example: clrwt – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
size font size and icon size, in pixels – example: 16 – accepted values: number de 8 à 40
class insert a custom CSS class
content Basis of the list to change after inserting the shortcode in the editor WordPress.


Circle

Insert a circular element with rollover effects.

[  advdcircle circlestyle="circletwo" frontimg="http://localhost/epicadesign/wp-content/uploads/2014/07/slide27.jpg" bgin="bggray" bgout="bgorange" title="PRINCIPAL TITLE" titlecolor="clrwt" subtitle="The subtitle" subtitlecolor="clrtq" link="Title of link" linkcolor="clrred" url="#" target="blank" anim="fadeIn" class="yourcustomclass"]description for this circle[  /advdcircle]
Fields Parameters
circlestyle preset style for this element – example: circletwo – accepted values: circleone, circletwo, circlethree, circlefour, circlefive, circlesix, circlesvn
frontimg foreground image – example: http://localhost/epicadesign/wp-content/uploads/2014/07/slide27.jpg – accepted values: url
bgin foreground color (if no picture) – example: bggray – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
bgout background color in mouseover- example: bgorange – accepted values: bgnone, bgwt, bglight, bggray, bgdark, bgbk, bgtq, bggreen, bgblue, bgbdk, bgorange, bgyellow, bgred, bgvt
title title (displayed on mouseover) – accepted values: texte
titlecolor title color – example: clrblue – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
subtitle subtitle (displayed on mouseover) – accepted values: texte
subtitlecolor subtitle color – example: clrblue – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
link link text (displayed in mouseover) – accepted values: texte
linkcolor link color – example: clrred – accepted values: clrwt, clrlight, clrgray, clrdark, clrbk, clrtq, clrgreen, clrblue, clrbdk, clrorange, clryellow, clrred, clrvt, clrinherit, clrnone
url link url – example: http://epicadesign.fr – accepted values: url
target target link will open in a new window or the same window – example: blank – accepted values: self, blank
anim animate this element – example: fadeIn – accepted values: valeurs des animations
class insert a custom CSS class
content content placed after the element


Code box

Insert a content type language for web development.

[  codebox style="javascript" backstyle="okaidia" linecount="yes"]Paste your code here. This box allows you to insert and magnify code. Enjoy ![  /codebox]
Fields Parameters
style type of language code – example: css – accepted values: markup (HTML), css, javascript, php
backstyle style window code – example: okaidia – accepted values: novalue, okaidia
linecount activate the line count – example: yes – accepted values: yes, no
content Insert your code after adding this shortcode in WordPress editor . The code should always be written when the editor is visual mode .
epica design


Modal box

Insert content displayed pop-up.

[  modalbox style="modal-medium" bodystyle="md-bd-dark" modaltitle="the modal box title" btnstyle="btnorange" size="small" btntext="The button or link text " class="yourcustomclass"]Your Modal Box content ...[  /modalbox]
Fields Parameters
style preset style for modal box – example: modal-medium – accepted values: modal-small, modal-medium, modal-large
bodystyle Style of content for the pop-up windows – example: md-bd-white – accepted values: md-bd-white, md-bd-dark
modaltitle title of the pop-up window, displayed before the content
btnstyle Style shutter button pop-up – example: btnorange – accepted values: themebutton, btnwhite, btnreverse, btnlight, btngray, btnbk, btntq, btngreen, btnblue, btnbdk, btnwhite, btnyellow, btnwhite, btnorange, btnred, btnvt, btnlink
size Size shutter button pop-up – example: nosize – accepted values: small, nosize, medium, large
btntext Text of button
class insert a custom CSS class
content content of the pop-up window.


Gmap

Insert a Google Map

[  gmap width="65" height="360" center="no" address="central park, new york" class="yourcustomclass"]
Fields Parameters
width width of the map, in percentage – example: 65 – accepted values: number de 1 à 100
height height of the map, in pixels – example: 350 – accepted values: number
center center the element – example: yes – accepted values: yes, no
adress address targeted by the marker on the map
class insert a custom CSS class


YouTube Advanced

Insert a video or a playlist of YouTube videos

[  youtube_advanced url="http://youtube.com/watch?v=XXXXXX" playlist="ZIlGNwglkDQ , aQT9on38gSA" width="65" center="yes" controls="no" autohide="yes" showinfo="no" autoplay="yes" loop="yes" rel="no" fs="no" modestbranding="no" theme="light" class=""]
Fields Parameters
url URL of the page hosting the video- example: http://youtube.com/watch?v=XXXXXX
playlist id video in playlist – example: ZIlGNwglkDQ – séparer les id par une virgule ,
width width of the video, in percentage – example: 65 – accepted values: number de 1 à 100
center center the video – example: yes – accepted values: yes, no
controls display control buttons – example: yes – accepted values: no, yes, alt
autohide behavior control buttons – example: yes – accepted values: no, yes, alt
showinfo view video information – example: yes – accepted values: no, yes
autoplay start the video at the opening of the page – example: yes – accepted values: no, yes
loop video loop – example: yes – accepted values: no, yes
rel display the mosaic of video related to the end of reading – example: yes – accepted values: no, yes
fs allow to switch the video in full screen mode – example: yes – accepted values: no, yes
modestbranding Show youtube logo on the video – example: yes – accepted values: no, yes
theme preset style of player – example: dark – accepted values: light, dark
class insert a custom CSS class


Vimeo

Insert a Vimeo video

[  vimeo url="http://vimeo.com/89501438" width="55" center="no" autoplay="yes" class=""]
Fields Parameters
url URL of the page hosting the video – example: http://youtube.com/watch?v=XXXXXX
width width of the video, in percentage – example: 65 – accepted values: number de 1 à 100
center center the video – example: yes – accepted values: yes, no
class insert a custom CSS class


Facebook stream

View thread information from your Facebook page

[  facebookbox url="https://www.facebook.com/FacebookDevelopers" style="dark" width="540" faces="no" header="no" posts="no" border="no"]
Fields Parameters
url Facebook page url – example: https://www.facebook.com/FacebookDevelopers
style preset widget style – example: dark – accepted values: light, dark
width widget width, in pixels – example: 380 – accepted values: number
face display the avatar of your fans – example: yes – accepted values: yes, no
header display the header of the widget – example: yes – accepted values: yes, no
post view your latest posts of your Facebook page – example: yes – accepted values: yes, no
border show borders widget – example: yes – accepted values: yes, no


Twitter stream

View thread information from your Twitter page

[  twitterbox name="Epicadesign" style="dark" width="64" height="500" limit="3" linkcolor="#17b3cb" bordercolor="#dddddd" header="no" footer="no" border="no" background="yes"]
Fields Parameters
name Twitter user name (ID) – example: Epicadesign
style preset widget style – example: dark – accepted values: light, dark
width widget width, in percentages – example: 64 – accepted values: number
height widget height, in pixels – example: 500 – accepted values: number
limit number of tweets to display – example: 5 – accepted values: number
linkcolor link color of the widget – example: #17b3cb – accepted values: hexadecimal color code
bordercolor border color of the widget- example: #666 – accepted values: hexadecimal color code
header display the header of the widget – example: yes – accepted values: yes, no
footer display the footer widget – example: yes – accepted values: yes, no
border show borders widget – example: yes – accepted values: yes, no
background use a transparent background- example: yes – accepted values: yes, no


Google+ post

Post a publication from Google+

[  googlepost url="https://plus.google.com/114048863488330644583/posts/eSXGMSS4Wmg"]
Fields Parameters
url Insert the link to the post (G+ data to retrieve the post itself) – example: https://plus.google.com/114048863488330644583/posts/eSXGMSS4Wmg


Loop of post

View the loop of your latest articles on the blog

[  wploop style="masonryloop" layout="3" limit="12"]
Fields Parameters
style style of loop – example: fliploop – accepted values: classicloop, accordianloop, flatloop, moreflatloop, fliploop, pinitloop, puzzleloop, sliderloop
layout number of columns for display the posts – example: 2 – accepted values: 1, 2, 3 or 4
limit number of post displayed – example: 8 – accepted values: number de 1 à 24

Theme support link

EVOLUTION theme documentation

Evolution demo