Just another WordPress site
CALL NOW! 1-800-123-4567
1. Content slider
The [jf_slider] shortcode can be used to easily create image and content slider in your page without writing any HTML code. The slider can be configured in a few seconds by adding some parameters, like scale mode for the images, maximum width and height of the slider or the animation type. The options page contains a complete list with the parameters of the slider.
2. Buttons
When you need an element with a call to action role, buttons are a convenient solution. Jumpeye framework comes with a huge set of buttons and by using the [jf_button] shortcode they can be easily added to the content. You can set the size of the buttons, their color and skin type.
3. Menus
Now you can create N-level drop down menus by using the [jf_menu] shortcode. An important parameter is "direction", which determines the type of the menu: horizontal or vertical. You can set different skins for the menus and some of these skins also let you change the color of the menus.
- In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit...
- Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus...
- Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula consequat posuere...
- In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit...
- Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus...
- Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula consequat posuere...
- In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit...
- Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus...
- Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula posuere...
- In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit...
- Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus...
- Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula posuere...
- In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit...
- Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus...
- Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula consequat posuere...
4. Tabs
You can create tabbed content by using the [jf_tab] shortcode. Several skins are available for tabs and one of these skins lets you change the color parameter.
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
Panel title
Panel content panel content panel content panel content panel content
5. Panels
The best way to highlight an important section of your content is to use panels. All you need to do is to add the shortcode [jf_panel]. Panels also offer a variety of skins and one of these allows changing the color parameter. Panels have a fluid width, they always adjust to the size of the parent container.
| Title column 1 | Title column 2 | Title column 3 | Title column 4 | Title column 5 |
|---|---|---|---|---|
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Title column 1 | Title column 2 | Title column 3 | Title column 4 | Title column 5 |
|---|---|---|---|---|
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Content column 1 | Content column 2 | Content column 3 | Content column 4 | Content column 5 |
| Title column 1 | Title column 2 | Title column 3 |
|---|---|---|
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
| Title column 1 | Title column 2 | Title column 3 |
|---|---|---|
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
| Content col 1 | Content col 2 | Content col 3 |
6. Tables
Tables are one of the best ways to present a lot of information in an easy-to-read manner. They are perfectly suited for displaying tabular data; pricing pages are one of the most common places where tables can be found. Their purpose is to make the data readable and easy to compare. By using the [jf_table] shortcode you will be able to build stunning tables in an easy manner. You can set different skins for the tables and one of the skins allows you to change the color parameter.
7. Alerts
Alerts are useful elements to notify users about a simple message, success, failure, info, warning or question. Use shortcode [jf_alert] to display an alert on your page. You can set the type of the alert, choose from different skins and several transition effects for the hide transition.
8. Tooltips
Tooltips are a quick way to provide detailed information on a term or action on a website. By using the [jf_tooltip] you can add a tooltip to a text and you can choose from a huge set of skins that come with the framework. You can also set the color of the tooltip and the position relative to the target text.
9. Forms
You can add forms in your content by using the [jf_form] shortcode. A custom style is available that is applied to all the included inputs: text inputs, radio buttons, checkboxes, combo boxes and some custom inputs.
12 columns
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. Mauris vel lacus vitae felis vestibulum volutpat. Etiam est nunc, venenatis in, tristique eu, imperdiet ac, nisl. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In iaculis facilisis massa. Etiam eu urna. Sed porta. Suspendisse quam leo, molestie sed, luctus quis, feugiat in, pede.6 columns
Nulla elementum dui ut augue. Aliquam vehicula mi at mauris. Fusce id felis. Vivamus sollicitudin metus eget eros. Nunc tempus felis vitae urna. Vivamus porttitor, neque at volutpat rutrum, purus nisi eleifend libero, a tempus libero lectus feugiat felis. Morbi diam mauris, viverra in.6 columns
In congue ligula sed ultricies laoreet. Pellentesque elit enim, vehicula vel pulvinar non, vulputate quis risus. Aliquam vestibulum, dui et placerat rhoncus, massa sapien dictum leo, a lobortis nulla diam a velit. Etiam et lectus magna. Donec id viverra elit.6 columns
Suspendisse nisi enim, fringilla in orci sodales, ornare elementum nisl. Duis ornare mattis lobortis. Sed eget pellentesque metus. Aliquam lorem eros, faucibus in placerat ut, ornare quis est. Phasellus vel ornare nisl, nec ultricies odio mauris in vehicula tellus.6 columns
Nam euismod pharetra metus eu pellentesque. Nunc tristique ultrices mi, vitae accumsan ipsum semper ac. Integer ipsum lorem, molestie ac ante et, tempus consectetur eros. Sed id mattis massa, nec blandit sapien. Curabitur sed erat quis ligula posuere.10. Grid
Now you can organize your content with the column layout shortcodes in any number of rows and columns by using the [jf_row] and [jf_col] shortcodes. The default CSS grid comes with 18 columns, but you can customize it by using the online grid editor.