GET THE FREE VERSION HERE: http://www.kulerthemes.com/ Latest Update: 2.0.1.1 • 2015.05.09, see more at CHANGELOGS. Front-end Demo : http://demo.kulerthemes.com/odio Back-end Demo : http://demo.kulerthemes.com/odio/admin (username : ..

kulerthemes.com

Odio - Premium OpenCart Theme for Fashion Stores

Show events or important moments in the order they occurred, using pictures and text

Example 1

Example 2

Example 3

Example 4

The Timeline widget allows you to choose either vertical or horizontal timelines to help you tailor the design to your specific needs. 

Vertical & Horizontal Timelines

The Timeline widget's feature of incorporating images into individual timeline items not only enhances its visual appeal and captivates your audience but also helps convey complex ideas or events more effectively, contributing to an overall more engaging and comprehensible user experience.

Ability To Add Images

The Timeline widget provides you with an array of trigger options for displaying items, including "always," "never," "on hover," and "scroll to view," empowering you to create a tailored user experience that enhances content accessibility and engages your audience by controlling when and how the information is revealed.

Item Visibility Controls

The Timeline widget comes available with multiple layouts that you can choose from to make sure it fits your overall website design and style.

Multiple Timeline Layouts

The Timeline widget comes with a variety of beautiful skins that you can choose from so you don’t have to spend much time on extensive customization.

Multiple Timeline Widget Skins

You can fully customize the Timeline widget so that it meets your demands by changing the design. Customize anything you want, including the fonts, spacing, and colors! In order to create a unified and polished appearance, you may also select from a variety of font choices and modify the font's size, style, and color. You can alter the spacing in addition to these style choices to make sure it blends in with the rest of your website's design.

Fully Customizable Timeline

The Timeline widget has a clean and contemporary style that will improve the overall appearance of your site in addition to being fully responsive, which means it will shift fluidly to fit the screen size of any device. Having a website that is optimized for mobile viewing is essential in a world where more and more people are accessing the internet through their phones and tablets. The Timeline widget will allow you to do just that, providing you an edge over the competition.

Perfectly Responsive Timeline Widget

No coding expertise is necessary to use the Timeline widget. With only a few mouse clicks, you can modify the timeline however you wish using our user-friendly interface. This implies that even individuals without coding knowledge may quickly and simply build a timeline with a professional appearance that connects with their website, enhancing their online presence and audience engagement.

Easy To Use Timeline Widget

You have total control over how the Timelin appears thanks to our robust advanced editor. This feature makes it simple to change the Timeline's appearance in every way, from the layout and positioning to the colors and fonts. Yet, if you're feeling extremely inventive, you can enhance your customization by making changes straight to the CSS. This enables you to customize the widget even more by making more sophisticated changes. Our powerful editor will help you whether you want to make a few minor adjustments or go all out with complex changes.

Timeline Widget Custom CSS

Simply copy and paste a code snippet into the HTML of your webpage to integrate the Timeline widget on your website. It is also self-updating, so any modifications you make to the Timeline Editor will be automatically reflected on your website without the need for any further manual updates.

Easy To Embed Timeline Widget

With the Timeline widget, you can organize and present information in chronological order, making it easier for your users to understand the content on your website. It is particularly useful for websites that deal with historical information, or for websites that try to convey a narrative through an engaging timeline. 

Better Organization and Navigation

The Timeline widget can help make your website more interactive and engaging for users, encouraging them to explore the content and spend more time on your site.

Improved User Engagement

The Timeline widget can add a visually appealing element to the website, making it more attractive and memorable for visitors.


Increased Visual Appeal 

Timeline

Website Components

Diverse Animation Effects

With advanced typography options, site owners can easily customize the font, size, and color of their animated titles to create the desired look and feel. These options enable users to maintain a consistent visual style across their website.

Advanced Typography Options

With our new feature in the Animated Headline Widget, you're no longer confined to animating only full sentences or headlines. You now have the ability to animate any segment of your sentence - be it the beginning, the middle, or the end. This feature gives you more flexibility to emphasize specific words or phrases, making your content even more engaging and interactive.

Animate for Any part of Your Sentence

The animated title widget is fully customizable, empowering site owners to modify every aspect of the title to suit their preferences. This level of control ensures that the final result is always in line with the desired outcome and the website's branding.

Complete Customization

The widget's fully responsive design ensures that animated titles display perfectly on all devices, including mobile phones, tablets, and desktop computers. This guarantees a consistent and enjoyable experience for visitors, regardless of the device they use.

Responsive Design

The Animated Title Widget features an easy-to-use interface, making it simple for site owners to create and customize their animated titles. This user-friendly approach ensures that even those with minimal technical knowledge can effectively implement the widget on their websites.

User-friendly Interface

For users with coding knowledge, the widget supports custom CSS, allowing for even more precise control over the appearance and behavior of the animated titles. This feature caters to advanced users who seek a higher level of customization.

Custom CSS Support

The animated title widget is simple to embed on any website with just one line of code, ensuring a hassle-free integration process. This ease of use makes it accessible to site owners of all skill levels, from beginners to experienced web developers.

Easy to embed on any website

The addition of an animated headline widget can greatly enhance a website's visual appeal, making it more attractive to visitors. This not only improves the user experience but also reflects positively on the site's brand and professionalism.

Improve your website's Aesthetics

Using animated headlines enables you to convey complex ideas or important information more effectively to your website visitors. This facilitates better communication and understanding, ensuring that both parties benefit from a more streamlined and informative user experience.

Better Communication

By emphasizing key messages or calls to action, the animated headline widget can effectively guide your website's visitors toward desired actions, such as signing up for a newsletter or purchasing. This ultimately leads to higher conversion rates and increased profits.

Increased Conversion Rates

Animated Headline

Get Creative

Showcases images in a rotating or sliding manner

Example 5

The widget comes with the option to change the carousel’s image sizes — from small, to large, vertical, or horizontal; you make the widget fit your specific needs.
Additionally, the widget also includes the ability to add captions to each image, giving you the ability to provide more information and guide visitors to other pages on your website. The carousel feature also allows for easy navigation between images, making it user-friendly and interactive.

Image Carousel Slide Size

With the option to change the arrow types of the Image Carousel slider, and the pagination icons below, you can further customize the widget and make it fit your design requirements.

Arrows & Pagination 

The Image Carousel widget comes with the options to control the speed at which the images slide, and how much time should be spent on the images. You can use these options to tailor your user’s experience.

Slider Speed & Time Per Slide

The Image Carousel widget comes available with multiple layouts that you can choose from to make sure it fits your overall website design and style.

Image Carousel Multiple Layouts

The Image Carousel widget is designed to provide complete customization options, allowing you to edit the design to fit your needs perfectly. With this widget, you can change the colors, fonts, spacing, and a wide range of other design elements to create a custom look and feel tailored to your requirements.


Fully Customizable Image Carousel

The Image Carousel widget is fully responsive and will look great on any device, this feature can give you a significant advantage over your competitors in today's mobile-first world. With more and more people accessing the internet through their smartphones and tablets, your website must be optimized for mobile devices.

Perfectly Responsive Image Carousel

The Image Carousel widget is easy to use and requires no coding knowledge. Our intuitive dashboard with the drag-and-drop feature will enable you to customize the widget any way you’d like to with just a few simple clicks.

Easy To Use widget

As with all of Common Ninja's widgets, the Image Carousel widget also provides the option to add custom CSS, which allows you to take your customization to the next level and be even more creative. Custom CSS will enable you to create custom styles and design elements that are unavailable through built-in customization options.

Image Carousel Custom CSS

Embedding the Image Carousel widget on your website is easy, simply copy a single line of code, and paste it into the HTML of your webpage. This allows you to quickly and easily add the widget to your website without any complicated setup or installation process. Once the widget is embedded, it will automatically update with every change you make, so you don't have to worry about manually updating the widget every time you make a change. This feature can save you a lot of time and effort, and ensure that your Image Carousel is always up-to-date and accurate.

Easy To Embed Image Carousel

With the Image Carousel widget, you can enhance your website’s design by selecting beautiful photos, and with the ability to change the photo’s sizes, and the slider’s options, you will be able to create an image carousel that is perfect for your website.

Use Image Carousel to Enhance Design

The Image Carousel widget is especially useful to people who need to promote their images and photos, on a portfolio website, for example, as it gives a simple way to showcase different works in an eye-pleasing manner.

Promote Your Work with Image Carousel

The Image Carousel widget is a perfect way to grab the attention of visitors and encourage them to interact with your website.

Increased Engagement

Image Carousel

Images & Galleries

Effortlessly present detailed event agendas; fully customizable with rich features.

When checking out an event on the Agenda Widget, it's always handy to catch the essentials first. For every item, the widget shows the location, the time, and the person taking the lead. It's like a quick snapshot, ensuring attendees know exactly where to be and when.


Details at a Glance

There are moments when an overview isn't enough and you're curious for more. The Agenda Widget allows for a direct link to be attached to any item, guiding users to in-depth information. So, if they want to explore a speaker's full profile or get additional details about a session, it's just a click away.

Direct Links

With the Agenda Widget, you decide how much of the event details to reveal at first glance. Users can easily switch between a neat, collapsed view and a detailed, expanded version, letting them interact with your agenda based on their preference.

Collapsable Details

The Agenda Widget offers a neat feature where event details can be shown in a popup. Instead of navigating away or scrolling endlessly, users can simply click on an agenda item, and all its information springs up in a focused popup window. It's all about providing details without cluttering the main view.

Popup Display

The Agenda Widget is pretty flexible. It's got various display options, so you can pick one that feels right for your website's vibe and looks. Just like choosing the best outfit for an event, but for your site!

Multiple Agenda Layouts

The Agenda Widget isn't just about function; it's got fashion too! It offers a bunch of cool themes, so you can find the perfect look without fussing over tweaks and edits. Making your agenda look snazzy was never this easy!

Stylish Agenda Skins

With the Agenda Widget, you're in the driver's seat. It's packed with customization options, letting you tweak colors, fonts, spacing, and more. Tailor it to match your style and make it a perfect fit for your site. You've got this!

Fully Customizable Agenda

The Agenda Widget adjusts smoothly to any device. Whether someone's checking out your agenda on a phone, tablet, or computer, it's going to look spot-on. In a world where everyone's on the move, your agenda is ready to roll with them.

Fits Every Screen

Getting the Agenda Widget up and running is a breeze, no coding wizardry needed! With an easy-to-grasp dashboard and drag-and-drop actions, you can shape your agenda just the way you want, all in just a few clicks. No fuss, just function.

Simple Setup, Smooth Scheduling:

Like every tool from Common Ninja, the Agenda Widget isn't just about out-of-the-box looks. Got a flair for design? Dive in with custom CSS and give it your unique touch. Your creativity, our platform – a match made in design heaven.

Style It Your Way with Custom CSS

Slipping the Agenda Widget onto your site is as simple as copy-paste. Just grab that one line of code and voila! And the cool part? Anytime you tweak the agenda on your end, it auto-refreshes on your site. 

Easy To Embed

By giving potential attendees a sneak peek into the exciting topics, speakers, or activities, you're providing them with more reasons to mark their calendars and show up.

Increase Attendance

No more constant email queries or phone calls asking about the event schedule. With the Agenda widget, your attendees can get all the information they need in one glance, freeing up your time.

Save Time

Displaying a clear and organized agenda highlights your commitment to planning and organization, elevating your brand's reputation and trustworthiness.

Enhance Professionalism

Agenda

Displays data or features side-by-side, allowing users to compare and contrast the information easily

You can create detailed comparison tables with a visual representation of information in an easy-to-understand manner and add call-to-action buttons that will take your users directly to a landing page or a checkout page.

Detailed Comparison for Quicker Conversions

With an easy-to-read font and little to no clutter, important information can be received better, improving user experience and making the whole process more enjoyable.

Clear and Easy-to-Follow Presentation for Better Understanding

Style 3

Style 4

Style 5

Style 6

Style 7

The Comparison Tables widget comes with indispensable search and sort options that will further enable your users to access information in the most accessible way.

Search & Sort Options

With Comparison Tables, you can create floating elements to keep the position of column and row headers fixed. Your users won’t get lost when looking at long tables.

Floating Elements

The Comparison Tables widget offers a pagination option for the really long comparison tables. Allow your users to read all the information you want comfortably.

Comparison Tables Pagination

You can easily convert any CSV file into an interactive compare table. With Common Ninja's smart converter, all your data is transferred exactly as it is, including tags, images, buttons, and other supported elements.

Easy CSV-to-Table Conversion

The Comparison Tables widget offers a variety of stunning premade skins that you can use to create comparison tables quickly and easily. Instead of spending hours trying to find the right colors or fonts, simply select a premade skin that you like and start building your comparison table. With a range of styles to choose from, you can find the perfect look and feel to match your brand and style. Whether you want a sleek and modern design, a bold and colorful look, or a clean and minimalistic style, there's something for everyone.

Comparison Tables Beautiful Skins

The Comparison Tables widget comes with full customization options, giving you the ability to easily edit the design to match the aesthetic of your website. You can change the colors of the Comparison Tables, buttons, and labels to match your branding. You can also choose from different font options and adjust the font size, style, and color to create a cohesive and professional look. In addition to these design options, you can customize the widget's spacing to ensure it fits seamlessly into your website layout.

Fully Customizable Comparison Tables

The Comparison Tables widget is a valuable tool for any website. Not only is it fully responsive, meaning it will adjust seamlessly to fit the screen size of any device, but it also has a sleek and modern design that will enhance the overall look of your site. In a world where more and more people are accessing the internet through their phones and tablets, it is crucial to have a website that is optimized for mobile viewing. The Comparison Tables widget will allow you to do just that, giving you an edge over competitors.

Perfectly Responsive Comparison Tables

The Comparison Tables widget is easy to use and requires no coding knowledge. Our intuitive dashboard with the drag-and-drop feature will enable you to customize the widget any way you’d like to with just a few simple clicks.

Easy To Use Comparison Tables

Our advanced editor is a powerful tool that gives you complete control over the appearance of the Comparison Tables widget. With this feature, you can easily customize every aspect of the widget's look and feel, from the colors and fonts to the layout and positioning. But if you're feeling particularly creative, you can take your customization to the next level by editing the CSS directly. This gives you the ability to make even more advanced changes to the widget, allowing you to make it your own. Whether you want to make a few simple tweaks or go all out with advanced customizations, our advanced editor has you covered.

Comparison Tables Custom CSS

To embed the Comparison Tables widget on your website, simply copy and paste the provided code snippet into the HTML of your webpage. Additionally, the widget is designed to be self-updating, meaning that any changes you make to the Comparison Tables Editor will be reflected automatically on your website without the need for any additional manual updates.

Easy To Embed Comparison Tables

The Comparison Tables widget enables you to deliver information in an organized and aesthetically pleasing visual way that your users will love.

Provide Great User Experience

With the Comparison Tables widget, you’ll be able to compare your products or services against that of a competitor’s and highlight your benefits in an easily accessible way.

Showcase Your Benefits in a comparison table

The Comparison Tables widget will allow you to expedite the user’s decision-making process in your favor by creating a simple, visual representation of the benefits you offer.

Expedite Decision-Making

Comparison Tables

Comparison Table - Templates 8

Comparison Table - Templates 7

Comparison Table - Templates 6

Comparison Table - Templates 5

Comparison Table - Template 4

Comparison Table - Template 3

Comparison Table - Template 2

Comparison Tables - Template 1

Displays short, posts and media in a slideshow format

The Stories widget features a progress bar that will help your users to keep track of the content they are viewing, thereby improving their experience.

Progress Bar

The Stories widget features multiple layouts for you to choose from. The right layout will help you send the right message and will also complement your design.

Multiple Layouts

The Stories widget features full customization options so you can edit the design to fit your needs. Change the colors, the fonts, the spacing and anything else!

Fully Customizable

The Stories is fully responsive and will look great on any device. In a mobile-first world, this feature will put you ahead of your competitors.

Perfectly Responsive

The Stories widget is easy to use and requires no coding knowledge. Our intuitive dashboard with the drag-and-drop feature will enable you to customize the widget any way you’d like to with just a few simple clicks.

Easy To Use

As with all of Common Ninja’s widgets, you can add custom CSS to customize the Stories widget and be even more creative.

Custom CSS

You can embed the Stories widget on your website easily by copying a single line of code. The widget will also be updated automatically with every change you make.

Easy To Embed 

The Stories widget includes the option to choose the shape of its frame. You can choose from three options: circle, square, or card. This allows you to customize the stories' appearance to fit your website's aesthetic.

Story shape

The Stories widget offers full RTL (Right-To-Left) support, making it accessible to users who write from right to left. This feature expands the reach of your news and makes it more accessible to a broader range of users from around the globe.

Full RTL Support

Stories will enable you to create eye-catching content that will keep your users engaged, entertained and glued to their screens for long periods of time. If the time spent on your site is a KPI then this widget will do wonders to improve it.

Increase Time on Site

With the Stories widget, you can promote products & services in a creative, out-of-the-box way. Use clever combinations of text and images to focus the users’ attention on features and benefits you’d like to highlight.

Promote Products & Services

The Stories widget, as the name suggests, enables you to tell stories. Use it on your blog to create a captivating story with visual aids.

Tell Stories

Stories

Present a carousel display featuring images and text cards

The Card Carousel widget comes with the option to change the carousel’s card sizes — from small, to large, vertical, or horizontal, you make the widget fit your specific needs. 


Card Size

With the option to change the arrow types of the Card Carousel slider, and the pagination icons below, you can further customize the widget and make it fit your design requirements.

The Card Carousel widget comes with the options to control the speed at which the cards slide, and how much time should be spent on the cards. You can use these options to tailor your user’s experience. 


The Card Carousel widget comes available with multiple layouts that you can choose from to make sure it fits your overall website design and style.
In addition to its visually appealing design, the Card Carousel widget offers versatility in its layout options. You can select from multiple layouts to ensure that it complements your website's overall look and feel. The ability to customize the layout makes it easy to create a seamless and cohesive experience for your visitors.

Multiple Card Carousel Layouts

The Card Carousel widget comes with various pre-made skins you can choose from to speed up your work.
To save you time and effort, the Card Carousel widget also comes with various pre-made skins for you to choose from. These skins are designed to provide a quick and easy way to customize the look and feel of the Card Carousel widget to match your brand and style. The pre-made skins make it simple to achieve the desired aesthetic without starting from scratch.

Card Carousel widget Multiple Skins

The Card Carousel widget features full customization options to edit the design to fit your needs. Change the colors, the fonts, the spacing, and anything else! You can choose from many premade skins to kick-start your design process. This feature saves you time and effort by providing a variety of ready-made skins that you can use as a starting point for your design. The premade skins have been carefully crafted to suit different website styles and themes, and you can easily customize them to match your brand's colors, fonts, and overall aesthetic. This way, you don't have to start from scratch when designing your Customizable Card Carousel widget; you can pick a skin closest to your desired design and make minor adjustments to make it perfect for your website. Furthermore, having a variety of premade skins also means that you have a more comprehensive range of options to choose from, ensuring that you'll find one perfect for your website.

Odio - Premium OpenCart Theme for Fashion Stores

OpenCart extension

App Details

Pricing

App Info

Some of the best Common Ninja extensions for OpenCart

Timeline

Animated Headline

Image Carousel

Agenda

Comparison Tables

Stories

Card Carousel

Skill List

Restaurant Menu

Product Blobs

RSS Feed Carousel

Corner Pop-up

extensions You Might Like

Discover the best apps for your website

Common Ninja Search Engine

Odio - Premium OpenCart Theme for Fashion Stores

OpenCart extension

App Details

Pricing

Check Out the Timeline Widget

App Info

Some of the best Common Ninja extensions for OpenCart

Timeline

Animated Headline

Image Carousel

Agenda

Comparison Tables

Stories

Card Carousel

Skill List

Restaurant Menu

Product Blobs

RSS Feed Carousel

Corner Pop-up

extensions You Might Like

Discover the best apps for your website

Common Ninja Search Engine