Outright Consultoría
Outright SRL
Tel.: 011-4437-5781
info@outright.com.ar
Buenos Aires, Argentina
  • Home
  • Nosotros
  • Areas de Colaboracion
    • Comercial
    • Financiera
    • Cadena de Suministro
    • Calidad y Medio Ambiente
  • Clientes
  • Casos de Referencia
  • Columna de Opinion
  • Contacto
Search the site...
  • Home
  • Features
  • Shortcodes
  • Small Components

Small Components

Popups

These come from the Bootstrap modal javascript plugin.

Note: Please keep in mind that this shortcode currently does not work great on small, mobile devices.

General Usage

Click me to see a popup

Title of popup

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Close

[popup text="Click me to see a popup" header="Title of popup"]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
[/popup]

This popup will animate in

Title of popup

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Close

[popup text="This popup will animate in" header="Title of popup" animate="true"]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
[/popup]

Contact Us!

Contact Us

This popup has a contact form inserted via Contact Form 7′s shortcode.
[contact-form-7 404 "Not Found"]

Close

[popup text="Contact Us!" color="primary" icon_before="envelope" header="Contact Us" animate="true"]
This popup has a contact form inserted via Contact Form 7's shortcode.
[contact-form 1]
[/popup]

Options

Required arguments
 - text: Text of button to popup

Optional arguments
 - title: Title tag of button to popup (will default to $text)
 - color: Color of button (view button colors)
 - icon_before: Icon before text of button to popup (view icons)
 - icon_after: Icon after text of button to popup (view icons)
 - size: Size of button - mini, small, default, large
 - animate: Whether popup slides in or not - true, false
 - header: Header text for popup

Progress Bars

Get creative with this one. — We honestly couldn’t think of a whole lot of real-world uses for this shortcode, but we thought it was too cool of a Boostrap feature to leave out.

General Usage

30%

[progress_bar percent="30"]

60%

[progress_bar percent="60" striped="true"]

90%

[progress_bar percent="90" striped="true" animate="true"]

Options

Required arguments
 - percent: A percentage of how far the bar is - 25, 50, 80, etc.

Optional arguments
 - color: Color of bar - default, danger, success, info, warning
 - striped: Whether the bar is striped or not - true, false
 - animate: Whether the bar is animated or not - true, false
Note: Apologies, but the striped effect and the animated effect will not work in IE. Maybe IE10 will get it right! Time will tell…
Note: For the bar to be animated, it must also be striped.

Colors

Color Example
Default
30%
60%
90%
Danger
30%
60%
90%
Success
30%
60%
90%
Info
30%
60%
90%
Warning
30%
60%
90%

Icon Lists

After you’ve inserted a standard unordered list, wrap it in the [icon_list] shortcode to make it stand out a little more.

General Usage

  • List item 1
  • List item 2
  • List item 3
[icon_list]
<ul>
 <li>List item 1</li>
 <li>List item 2</li>
 <li>List item 3</li>
</ul>
[/icon_list]
  • List item 1
  • List item 2
  • List item 3
[icon_list icon="star"]
<ul>
 <li>List item 1</li>
 <li>List item 2</li>
 <li>List item 3</li>
</ul>
[/icon_list]
  • List item 1
  • List item 2
  • List item 3
[icon_list icon="star" color="#eec627"]
<ul>
 <li>List item 1</li>
 <li>List item 2</li>
 <li>List item 3</li>
</ul>
[/icon_list]

Also note that if you’re comfortable with basic HTML, you can accomplish icon lists with the following HTML markup.

  • List item 1
  • List item 2
  • List item 3

<ul class="tb-icon-list">
 <li><i class="icon-star"></i> List item 1</li>
 <li><i class="icon-star"></i> List item 2</li>
 <li><i class="icon-star"></i> List item 3</li>
</ul>

Options

Required arguments
 - icon: Icon to be used. (view icons)

Optional arguments
 - color: Color CSS value to get applied to icon, will default to current text color. Ex: #660000

Acerca de Outright

Outright es una empresa argentina especializada en conducción y gestión de proyectos de alta complejidad, que inicia su actividad en septiembre de 1996 a través del desarrollo de diversos proyectos de consultoría en empresas del segmento medio y alto.

Columna de Opinión

  • Columna de Opinión – En desarrollo

Contáctenos

  • 011-4437-5781
  • info@outright.com.ar
    • Linkedin
Copyright 2016 Outright SRL. Todos los derechos reservados.