Globe Free Documentation

Shortcodes

In this section you can learn how to use our shortcodes.

Accordion

Back to top

Accordion is useful to add collapsible content panels for presenting information in a limited amount of space.

[accordion title="your_title" opened="no" animation_delay="0" class_icon_closed="plus" class_icon_opened="minus" border="true" animate="" ][/accordion]
  • title: the accordion's title
  • opened: [yes / no] whether to show the accordion opened initially
  • class_icon_opened: the icon when accordion is opened
  • class_icon_closed: the icon when accordion is closed
  • border: [yes / no] whether to show the border
  • animate: [ none , bounce , flash , pulse , shake , swing , tada , wobble , bounceIn , bounceInDown , bounceInLeft , bounceInRight, bounceInUp , fadeIn , fadeInDown , fadeInDownBig , fadeInLeft , fadeInLeftBig , fadeInRight , fadeInRightBig , fadeInUp , fadeInUpBig , flip , flipInX , flipInY , lightSpeedIn , rotateIn , rotateInDownLeft , rotateInDownRight , rotateInUpLeft , rotateInUpRight , rollIn ] the animation of the element
  • animation_delay: the delay of animation
  • content: the content of accordion

Add Space

Back to top

Print a space

[space height="30" ]
  • height: height of space box in px

Box Title

Back to top

Show a formatted title

[box_title class="" subtitle="" subtitle_font_size="15" font_size="15" border_color="#CDCDCD"
                animation_delay="0" font_alignment="center" border="middle" animate="" ][/box_title]
  • content: title of box
  • class: custom css class added to the box
  • font_size: font size for the box content
  • subtitle: subtitle of the box
  • subtitle_font_size: subtitle font size
  • border: border position
  • border_color: border color
  • font_alignment: font alignment for the box content
  • animate: [ none , bounce , flash , pulse , shake , swing , tada , wobble , bounceIn , bounceInDown , bounceInLeft , bounceInRight, bounceInUp , fadeIn , fadeInDown , fadeInDownBig , fadeInLeft , fadeInLeftBig , fadeInRight , fadeInRightBig , fadeInUp , fadeInUpBig , flip , flipInX , flipInY , lightSpeedIn , rotateIn , rotateInDownLeft , rotateInDownRight , rotateInUpLeft , rotateInUpRight , rollIn ] the animation of the element
  • animation_delay: the delay to which the animation starts

Buttton

Back to top

Show a custom button

[button href="#" icon_size="12" class="" target="" color="flat" dimension="normal" icon="None" animation="" animate="" animation_delay="0" ]button[/button]
  • href: url of the link
  • target: target of the link
  • color: button’s look and feel
  • dimension:[ large / normal / small / mini] width of the button
  • icon: awesome icon inside button, look here for a complete list of options
  • icon size: size of the awesome icon
  • animation: animation direction
  • animate: [ none , bounce , flash , pulse , shake , swing , tada , wobble , bounceIn , bounceInDown , bounceInLeft , bounceInRight, bounceInUp , fadeIn , fadeInDown , fadeInDownBig , fadeInLeft , fadeInLeftBig , fadeInRight , fadeInRightBig , fadeInUp , fadeInUpBig , flip , flipInX , flipInY , lightSpeedIn , rotateIn , rotateInDownLeft , rotateInDownRight , rotateInUpLeft , rotateInUpRight , rollIn ] the animation of the element
  • animation_delay: the delay to which the animation starts
  • class: custom css class addedd to the button

Dropcap

Back to top

Create a dropcap

[dropcap]L[/dropcap]

Highlight

Back to top

Show a text with custom font and background color

[highlight text_color="#000" background_color="#1e73be" ]lorem ipsum[/highlight] dolor sit amet, consectetur adipiscing 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.[highlight text_color="#000" background_color="#dd3333" ] Duis aute irure dolor[/highlight] in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  • text color: color of the text
  • background color: color of the background

Show an icon

[icon icon_size="14" color="#797979" circle_size="35" spinning="no" icon_type="theme-icon" icon_theme="envelope-o" circle="yes" rotate="normal" ]
  • icon type: type of the icon(theme-icon or custom)
  • icon size: font size of the icon
  • color: color of the border and the icon
  • circle: whether to show the circle around the icon
  • circle size: icon circle width
  • spinning: whether to active spinning animation
  • rotate: rotation type

List Bullet

Back to top

Shows list bullet with custom icon

[list_bullet icon="star" animation_delay="0" icon_color="#f7c104"]
                
  • Quisque nec mi eu nibh aliquam elementum.
  • Lorem ipsum dolor sit amet, consectetur adipiscing lorem ipsum dolor sit amet.
  • Ut cursus nisl sit amet sapien dignissim at adipiscing lectus ornare dieus.
  • Lorem ipsum dolor sit amet, consectetur adipiscing lorem ipsum dolor sit amet.
[/list_bullet]
  • icon: awesome icon showed near the text, look here for a complete list of options
  • icon_color: awesome icon color

Logged User

Back to top

Shows logged user info

[logged_user before="Hello " after="" display="display_name" ]
  • before: text before user info
  • after: text after user info
  • display: the info to wicth display

Separator

Back to top

Show a list of posts

[separator color="#cdcdcd" margin_top="40" margin_bottom="40" style="single"]
  • style: style of the separator [single | double | dotted | dashed]
  • color: separator color
  • margin_top: css property margin top [0-999]px
  • margin_bottom: css property margin bottom [0-999]px

Sitemap

Back to top

Print website sitemap (the sitemap can be configured in YIT Plugins -> Layout if YIT_Sidebar plugin is active)

[sitemap title="Sitemap" ]
  • title: sitemap title

Size Text

Back to top

Choose size of text

[size px="45" perc="-1" em="-1" ]size of text[/size]
  • px: pixel unit of width
  • perc: percentual unit of width
  • em: em unit of width

Twitter

Back to top

Print a list of last tweets

[twitter username="" consumer_key="" consumer_secret="" access_token="" access_token_secret="" items="5"
class="last-tweets-widget" time="yes" animation_delay="0" animate="" ]
  • username: twitter username
  • consumer key: field required by twitter api
  • consumer secret: field required by twitter api
  • access token: field required by twitter api
  • access token secret: field required by twitter api
  • items: number of item to show
  • class: container css class
  • time: whether to show time
  • animate: animation type
  • animation_delay: the delay to which the animation starts

Blog Section

Back to top

Print a blog slider

[blog_section nitems="-1" enable_slider="yes" enable_thumbnails="yes" enable_date="yes" enable_title="yes" enable_author="yes" enable_comments="yes" animation_delay="0" animate="" ]
  • number of items: set how many elements to show
  • enable slider: whether to activate the slider
  • show thumbnails: whether to show the thumbnail
  • show date: whether to show the date
  • show title: whether to show the title
  • show author: whether to show the author
  • show comments: whether to show the comments
  • animate: animation type
  • animation delay: the delay to which the animation starts