Fixed

ShortcodesFixed

What’s this?

You can absolutely position shortcodes or content using the Fixed Shortcode. It can be used with in the Block, Box or Columns shortcode. Check out these Box examples below.
I am aligned Top Left
I am aligned Top Right
I am aligned Bottom Left
I am aligned Bottom Right
I am aligned Center Left
I am aligned Center Right
I am aligned Center Center
I am aligned Top Center
I am aligned Bottom Center

Top Left

[fixed top="0px" right="auto" bottom="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Left[/box]
[/fixed]

Top Right

[fixed top="0px" left="auto" bottom="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Right[/box]
[/fixed]

Bottom Left

[fixed bottom="0px" right="auto" top="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]

Bottom Left

[fixed bottom="0px" left="auto" top="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]

Center Left

[fixed top="50%" right="auto" bottom="auto" left="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Left[/box]
[/fixed]

Center Right

[fixed top="50%" left="auto" bottom="auto" right="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Right[/box]
[/fixed]

Center Center

[fixed top="50%" right="auto" bottom="auto" left="50%" margin_top="-25px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Center Center[/box]
[/fixed]

Top Center

[fixed top="0px" right="auto" bottom="auto" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Top Center[/box]
[/fixed]

Bottom Center

[fixed top="auto" right="auto" bottom="0px" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Bottom Center[/box]
[/fixed]

Variations

Change the Skin for this Case Study

Demos

React Hub
Lens
Berri
Replika
Press
Second
View all Demos React Hub Copy current page content
[box type="custom-boxed-item" align="center" text_align="textcenter"] [fancy_header tag="h4" size="medium" text_align="textcenter" bold="1"]What's this?[/fancy_header] You can absolutely position shortcodes or content using the Fixed Shortcode. It can be used with in the [a href="/shortcodes/block" class="subtle-link"]Block[/a], [a href="/shortcodes/boxes" class="subtle-link"]Box[/a] or [a href="/shortcodes/column-layouts" class="subtle-link"]Columns[/a] shortcode. Check out these Box examples below. [icon icon="fa-arrow-down" font_size="15" boxed="1" description="See examples below" position="center" margin_top="20px" margin_bottom="-40px" link="#content" class="infinite wobble"] [/box] [section_break type="blank" margin_bottom="30" /] [block rounded="rounded" border="border" min_height="600" palette="0" margin_bottom="40"] [fixed top="0px" right="auto" bottom="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Top Left[/b][/box] [/fixed] [fixed top="0px" left="auto" bottom="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Top Right[/b][/box] [/fixed] [fixed bottom="0px" right="auto" top="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Bottom Left[/b][/box] [/fixed] [fixed bottom="0px" left="auto" top="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Bottom Right[/b][/box] [/fixed] [fixed top="50%" right="auto" bottom="auto" left="0px" margin_top="-45px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Center Left[/b][/box] [/fixed] [fixed top="50%" left="auto" bottom="auto" right="0px" margin_top="-45px" margin_right="10px" margin_bottom="10px" margin_left="10px"] [box type="basic-light"]I am aligned [b]Center Right[/b][/box] [/fixed] [fixed top="50%" right="auto" bottom="auto" left="50%" margin_top="-45px" margin_right="10px" margin_bottom="10px" margin_left="-125px" width="250"] [box type="basic-light" text_align="textcenter"]I am aligned [b]Center Center[/b][/box] [/fixed] [fixed top="0px" right="auto" bottom="auto" left="50%" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="-125px" width="250"] [box type="basic-light" text_align="textcenter"]I am aligned [b]Top Center[/b][/box] [/fixed] [fixed top="auto" right="auto" bottom="0px" left="50%" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="-125px" width="250"] [box type="basic-light" text_align="textcenter"]I am aligned [b]Bottom Center[/b][/box] [/fixed] [/block] [fancy_header bold="1" type="style1" margin_top="40"]Top Left[/fancy_header] 
[fixed top="0px" right="auto" bottom="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Left[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Top Right[/fancy_header] 
[fixed top="0px" left="auto" bottom="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Right[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Bottom Left[/fancy_header] 
[fixed bottom="0px" right="auto" top="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Bottom Left[/fancy_header] 
[fixed bottom="0px" left="auto" top="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Center Left[/fancy_header] 
[fixed top="50%" right="auto" bottom="auto" left="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Left[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Center Right[/fancy_header] 
[fixed top="50%" left="auto" bottom="auto" right="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Right[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Center Center[/fancy_header] 
[fixed top="50%" right="auto" bottom="auto" left="50%" margin_top="-25px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Center Center[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Top Center[/fancy_header] 
[fixed top="0px" right="auto" bottom="auto" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Top Center[/box]
[/fixed]
[fancy_header bold="1" type="style1" margin_top="40"]Bottom Center[/fancy_header] 
[fixed top="auto" right="auto" bottom="0px" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Bottom Center[/box]
[/fixed]
Download - $44