Search Over 30,000 FREE Plugins from the Official WordPress Plugin Directory Repository

SiteOrigin Widgets by CodeLights

Flexible high-end shortcodes and widgets. Responsive, modern, SEO-optimized and easy-to-use. Also can work without SiteOrigin.

Six Built-in Elements

1. Modal Popup

Modal Popup is a dialog box/popup window that is displayed on top of the current page. It is a very useful tool when you want to add some special content and to keep the original content clean at the same time.

Special Features:

  1. 5 popup sizes to choose from.
  2. 7 awesome CSS3-based show/hide animations.
  3. 4 popup show triggers: button click, text click, image click and page load.

Modal Popup Showcase and Examples

2. Stats Counter

A great tool to draw visitors' attention to a data that can be expressed in numbers, like: your sales, number of completed projects or your customer satisfaction index. You set initial and final values and when your visitor will reach a counter, it will animate in a most natural way: gradually changing the number.

Special Features:

  1. 6 international number formattings including Chinese and Indian ones.
  2. Accounting formatting available, where negative numbers are framed with parentheses.
  3. Specify amount of numbers after the decimal point or use integers with no decimal part at all.
  4. Several numbers within a single counter, so you can animate "0 / 0" into "24 / 7", lets say, to emphasize your service working hours.
  5. Animate anything into anyting: even letter-based string will be turned into the other one in a most natural way.
  6. Simple to use: just type in the initial and final strings and our smart scripts will do the rest.

Stats Counter Showcase and Examples

3. FlipBox

Two-sided card that flips to reveal additional information, when you hover over it.

Special Features:

  1. 4 animation types: Card Flip, Cube Tilt, Cube Flip and Cover Open.
  2. 8 animation directions for each of the animations.
  3. 100% CSS3-based animations to improve performance.
  4. Most flexible FlipBox ever: 34 different options, yet easy-to-use.

FlipBox Showcase and Examples

4. Interactive Text

Trending element in 2015: when you need to emphasize that you are great at several services, you can smoothly change the service-name part of the slogan, leaving the rest unchanged. And that's just one tiny example of how this element can be used: the richness of language and it's usages are limitless!

Special Features:

  1. The only of it's kind in free WordPress plugins.
  2. Choose one of 5 beautiful animation types.
  3. Change different parts of sentence at different steps.
  4. Incredibly easy-to-use: just type in all the sentence states, and our smart scripts will do the rest.

Interactive Text Showcase and Examples

5. Interactive Banner

Element powered by great CSS animations, can be used to attend visitors to the needed page or even to showcase some products listing. Some of the animations reveal additional data, which can be used to highlight important details or call to action.

Special Features:

  1. 10 awesome animations.
  2. Adjustable responsive behavior.
  3. Incredibly customizable: 18 options, yet easy-to-use.

Interactive Banner Showcase and Examples

6. Testimonial

A great tool to share your current Clients' experience with your new visitors, and to emphasize your credibility one more time.

Special Features:

  1. 3 testimonial types: Quote, Scanned document and Video.
  2. 5 quote layouts.
  3. You can specify the author source for even better credibility.

Testimonial Showcase and Examples

... and more elements are coming!

Use Them the Way You Like

SiteOrigin Page Builder

Using SiteOrigin? CodeLights elements can be used as its widgets as well. Just install CodeLights and you'll see an additional tab with its elements in your SiteOrigin dialogs.

Check the screenshots or download the plugin for more details.

Shortcode Builder

Both in visual and text modes you'll see an additional button that helps you to create and edit shortcodes using convenient tabbed forms. Create and modify the elements you want in seconds!

Check the screenshots or download the plugin for more details.

Sidebar Widgets

Use the convenient rich controls when creating and editing sidebars widgets both from admin page and customizer mode. The last option helps you to preview changes instantly.

Check the screenshots or download the plugin for more details.

... and more supported editors are coming!

Author CodeLights
Contributors rsukhar
Tags admin, animation, banner, counter, flipbox, page, responsive, shortcode, shortcodes, sidebar, siteorigin, widget, widgets
  1. codelights-shortcodes-and-widgets screenshot 1

    Using with SiteOrigin panels builder

  2. codelights-shortcodes-and-widgets screenshot 2

    Special button for generating and modifying shortcodes

  3. codelights-shortcodes-and-widgets screenshot 3

    Great customizability with an intuitive to use editor

  4. codelights-shortcodes-and-widgets screenshot 4

    Editing sidebar widget from admin page

  5. codelights-shortcodes-and-widgets screenshot 5

    Editing sidebar widget from customizer


  • Improved: CodeLights now works in SiteOrigin Layout Builder Widget too
  • Improved: Now you can use nbsp chars in Interactive Text
  • Updated: Font Awesome to the latest 4.7.0 version
  • Fixed: Interactive Text now doesn't trim some spaces between words
  • Fixed: Compatibility of Modal Popups with SiteOrigin Vantage theme's menu z-index


  • Improved: Interactive Banner now shows attachment alt, when it's defined (which is good for SEO)
  • Fixed: Compatibility with some 3-rd party plugins that change hooks order.
  • Fixed: Clean styled Testimonials' quotes now are not cut in Safari


  • Improved: Compatibility with WordPress 4.6
  • Improved: FlipBox and Interactive Banners how handle Tab button focus properly
  • Improved: Modal Popup now contains additional class in the popup wrap too, so you can customize the inside content's styles too
  • Improved: Plugin now should become translatable by the community
  • Improved: Provided native compatibility with UpSolution's Impreza and Zephyr premium WordPress themes


  • Improved: Compatibility with WordPress 4.5
  • Improved: Compatibility with "WP Canvas - Shortcodes" plugin
  • Improved: Added media button for html form fields
  • Improved: FlipBox now allows to choose image sizes for both front and back sides


  • New: Added the new Modal Popup element
  • Fixed: Compatibility with WP CLI
  • Fixed: SiteOrigin page builder custom posts compatibility


  • Improved: front-end JS logic now allows to load scripts asynchronously (could be useful for 3-rd party page loading accelerators).
  • Fixed: Form link field now is properly shown in customizer editing mode
  • Fixed: Stats Counter now properly detects 00.00 format
  • Fixed: SiteOrigin-related assets loading is optimized and became more stable


  • Fixed: FlipBox back button is now clickable on iOS devices
  • Fixed: Form textarea field is now properly handled in TinyMCE editing mode


  • New: Opacity slider for all color fields
  • Updated: Font Awesome to the latest 4.5.0 version
  • Fixed: Assets loading for standalone CL version (with no SiteOrigin Editor enabled)
  • Fixed: Testimonial quotes symbol now is always properly loaded


  • New: Added the new Testimonial element
  • New: The plugin now is fully translatable
  • New: Added Russian localization (ru_RU)
  • Fixed: Interactive text Safari transition fix
  • Fixed: FlipBox text styles now less likely to be overloaded by theme styles


  • Fixed: Urgent fix for some experimental 3-rd party editors support


  • Fixed: PHP 5.3 compatibility (Thanks to @sduccio for the feedback!)


  • New: FlipBox order settings for both front and back sides
  • Fixed: FlipBox flanks background color calculation and border style
  • Fixed: FlipBox cover open animation glitch in WebKit browsers
  • Fixed: FlipBox and Interactive Banner mobile touch behaviour
  • Fixed: Cleaned excess admin assets, added plugin version to assets to bypass caching after update


  • Initial version.

What about support?

If your ticket is about some systematic issue that is replicable on a clean installation with a standard WordPress theme and no other plugins turned on, we'll be glad to help! For this case, please provide the detailed issue explanation, so we could replicate it with no additional questions. If you have questions about usage or something else, feel free to ask! Documentation is coming soon. If you want some custom modifications, at the moment it's better to hire a separate developer (or to do these modifications yourself, if you can).

Which browsers does the plugin support?

Front-end: IE10+; two latest versions of Chrome, Safari, FireFox and Opera. Back-end (editor): Edge, two latest versions of Chrome, Safari, FireFox and Opera.

Version 1.1.4

Requires WordPress version: 4.0 or higher

Compatible up to: 4.7.2

Last Updated 08 Jan 2017

Date Added: 21 Nov 2015

Plugin Homepage


4.8 stars
18 ratings


Not Enough Data

Works: 0
Broken: 0