Using Frozr shortcodes extention

Frozr has tried to make a simple yet unique collection of shortcodes through Frozr shortcodes extension. The shortcode extention includes:

  1. Image Gallery Shortcode.
  2. Protected content Shortcode.
  3. Style Box Shortcode.
  4. Tabs Shortcode.
  5. Toggles Shortcode.
  6. Button Shortcode.

To install Frozr shortcodes extension, go to the plugins page in your WP admin dashboard, choose to add a new plugin, and search for “Frozr Shortcodes”.

Image Gallery Shortcode

Frozr Image Gallery is a Posts and Pages Adaptive Thumbnail Pile Effect Gallery. It uses jQuery stapel v1.0.0 by CodeDrops.
Usage:

  1. In the post/page edit page click “Add Media”.
  2. Then “Create gallery” and select the images you want to include in the galley.
  3. Click “Create a new gallery” then “Insert gallery”.
  4. If you click the Text view option of the editor the output will probably look like:
  5. Finally modify that code to make it look like:

[frozr_gallery title=”Random gallery” ids=”1776,1777,1864,1855,1806″]
[frozr_gallery title=”Random gallery 2″ ids=”1765,1766,1767,1764,1760″]
[frozr_gallery title=”Mutasim” ids=”1706,1724,1725,1710,1714,1721″]
[frozr_gallery title=”Mutasim 2″ ids=”1948,1950,1951,1952,1946,1955″]

Protected Content Shortcode

This shortcode is used to hide any content from un registered users. To use the shortcode simply use the shortocde syntax: [hidden-content] Your Content Here! [/hidden-content] in posts/pages editor.
[hidden-content] Your Content Here! [/hidden-content]

Style Box Shortcode

The Style Box shortcode is used to create announcements and messages in WordPress posts and pages. To use the shortcode simply copy the following shortcode to pages/posts editor and change its values.
[style-box icon=”yourboxicon” icon_color=”youriconcolor” text_color=”yourtextcolor” box_color=”yourboxcolor”] Your Message Goes Here! [/style-box]

bolt
Your Message Goes Here!

All Values are optional you can also use the code like this: [style-box] Your Content Here! [/style-box]
Your Content Here!

Style box uses Font Awesome Icons so type the icon name in the icon=”” section and for the colors use HEX color values.

Tabs Shortcode

Tabs shortcode allow you to show more content on the page using less space. You can have as many tabs as needed. The container will auto-fill the width of the area where it is inserted.

To use the shortcode past the following code to pages/posts edit page editor and modify its values.
[tabgroup]
[tab title=”Tab Title 1″] Tab content… [/tab]
[tab title=”Tab Title 2″] Tab content… [/tab]
[/tabgroup]

[tabgroup]
[tab title=”Tab Title 1″]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ut viverra lorem. Fusce dictum elit sit amet tristique accumsan. Aenean iaculis vitae lectus vitae posuere. Maecenas mollis in neque quis ullamcorper. Proin et tincidunt lorem. Sed dignissim massa non enim tincidunt semper. Fusce sit amet dignissim ex, at tincidunt erat. Aenean ullamcorper felis eget leo imperdiet maximus. Quisque cursus aliquam mi a rutrum…. [/tab]
[tab title=”Tab Title 2″]Curabitur egestas elit ut lorem blandit, quis imperdiet felis accumsan. Vestibulum at erat ut libero posuere tincidunt eu vel mi. Maecenas sodales ultrices pellentesque. Fusce sagittis vitae odio quis laoreet. Praesent mollis hendrerit odio, ut luctus dolor accumsan vitae. Phasellus eu convallis tellus. In arcu diam, scelerisque eu massa id, luctus imperdiet orci….[/tab]
[tab title=”Tab Title 3″]Cras et eleifend eros. Fusce placerat felis eu eros pulvinar mattis. Morbi imperdiet, dolor ut sollicitudin commodo, ipsum sem semper dolor, at ornare justo lacus vel nibh. Ut auctor sagittis mi eget tempor. Aenean sagittis risus a arcu placerat malesuada. Morbi finibus congue purus, ac ultrices nisl eleifend eu. Cras consequat porttitor convallis. Nunc ipsum mauris, mattis nec arcu et, rutrum molestie ante. Aenean laoreet, dolor non tristique venenatis, sem turpis ullamcorper ligula, sit amet eleifend odio enim at nisl. Vivamus in gravida elit. Duis porttitor condimentum tellus vitae dignissim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis in massa porta, pharetra ex quis, pretium magna. Pellentesque gravida, dui vitae cursus auctor, purus ipsum luctus justo, a consequat quam dolor vel massa. In elementum erat eget felis pulvinar interdum…[/tab]
[tab title=”Tab Title 4″]Pellentesque tempor laoreet dolor eget scelerisque. Praesent eu cursus urna. Pellentesque dictum consequat leo ultrices congue. Etiam nec lorem congue metus euismod tristique. Nulla et orci eget quam ornare sodales. Maecenas magna est, mattis in euismod et, sodales sed erat. Ut in tellus non tortor venenatis rhoncus…[/tab]
[tab title=”Tab Title 5″]Aenean mauris nibh, pulvinar sed ornare id, imperdiet rhoncus neque. Proin imperdiet risus ut urna malesuada, nec dapibus arcu sodales. Vestibulum vitae fringilla quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus lacinia nibh quis lobortis finibus. Morbi tempus bibendum nulla non mattis. Suspendisse ut magna eget magna tristique iaculis. Ut eget posuere justo. Suspendisse nec consectetur massa…[/tab]
[/tabgroup]
You’re free to add as many tabs as you want in one tabgroup.

Toggles Shortcode

Expand and collapse the content inside a container with a title. This is useful for quick tips and frequently asked questions pages where the user can navigate a list of questions. To use the shortcode simply past the following code to pages/posts edit page editor and modify its values.
[toggle title=”The Question or Title”]The is the answer or content to show… [/toggle]

FAQ

Curabitur egestas elit ut lorem blandit, quis imperdiet felis accumsan. Vestibulum at erat ut libero posuere tincidunt eu vel mi. Maecenas sodales ultrices pellentesque. Fusce sagittis vitae odio quis laoreet. Praesent mollis hendrerit odio, ut luctus dolor accumsan vitae. Phasellus eu convallis tellus. In arcu diam, scelerisque eu massa id, luctus imperdiet orci….

Button Shortcode

This shortcode allows you to add buttons to your posts and pages, perfect to add great looking download links or action buttons. To use the shortcode simply past the following code to pages/posts edit page editor and modify its values.
[button bgcolor=”Button Color” color=”Text Color” url=”http://”]Button Text[/button]
[button bgcolor=”Button Color” color=”Text Color” url=”http://”]Button Text[/button]
For the colors use HEX color values.

Customizing Frozr

Frozr uses the amazing WordPress customize tool that made customizing themes a fun and awesome experience with the ability to immediately see the changes of you options on the theme.

To start customizing Frozr, Click “Customize” in your WP admin bar.

customize

Location of the -Customize- link

When you’re in the Customize page, You’ll immediately notice that using the Frozr options does not need to be further explained. Options are quite clear and easy to understand, if not its changes on the theme will further explain it to you.

In the Customize page, Frozr have put for you all the options you will need to create your beautiful unique website. Frozr also have divided its options depending of the page being customized. So different options will appear on different pages, each page you feel you may want to customize, click “Customize” on that page and you’ll find all the necessary options to do so.

Using Frozr Metaboxes

Frozr puts in your hands a carefully chosen posts & pages metaboxes to make controlling how each post & page content appear in the front-end never more powerful then now.
Frozr provides Seven powerful metaboxes.

  1. Posts Meta Options.
  2. Pages Meta Options.
  3. Content Quick Links.
  4. Image Gallery Thumbnail.
  5. Video Thumbnail.
  6. Audio Thumbnail.
  7. Link Thumbnail.

Before we start introducing each metabox, if you have a question or something is not clear after reading this article please post a comment below.

Posts meta options

The metabox controls the appearance of each meta info of the post.
postsmetabox

Posts Meta Metabox in Posts Edit Page

As it looks, it’s very easy to use just check on the meta detail you want to show in the front-end and uncheck those you don’t want.

icon-warning
Note: 1. All options of the metabox will be checked by default when creating a new post. 2. If you import posts then the metabox options will not be checked by default, you should manually review posts imported and check which meta info to show.

Pages meta options

This metabox is much like posts metabox option introduced previously.
pagesmetabox

Pages Meta Metabox in Pages Edit Page

Simply check or uncheck the options to use. Also read the post meta options notices above as they also apply for this metabox.

Content Quick links

This metabox is your posts and pages menu creator.
quicklinks

Quicklinks Metabox in Pages/posts Edit Page

When you are writing a muiltpage, long article or even a FAQ page just check this metabox option to create quick links menu to all main headlines of your article. This metabox is programmed to review your post/page content and find for headlines, that includes text tagged with h1 & h2, and then creates a menu that will link to those headlines.

To get the best menu, consider tagging your content main headings with either h1 or h2 HTML tags. For example:
<h1>My first Headline</h1>
<h2>My first Headline</h2>
Now as much as you take care of ordering your contents as much as this metabox will order your content menu.

Gallery Thumbnail Metabox

This is very simple and user friendly tool to create a gallery thumbnail for a gallery post-format post.
gallery

Gallery Metabox in Posts Edit Page

Select to add images from your media gallery or upload from your device then drag & drop images to order your thumbnail gallery.

Video Thumbnail Metabox

This is another simple tool to create a video thumbnail for a video post-format post.
video

Video Metabox in Posts Edit Page

Video Metabox is actually programmed to create video thumbnails from videos posted in video sharing websites like Youtube, Viemo, Dailymotion, etc, all video sharing websites included in the WordPress Internal whitelist.

To create a video thumbnail you have three choices:

  1. Using the direct link of the video.
  2. Using the Embed code of the video.
  3. Import from the WP media gallery.

Use only one of those three options you have, and you’re done!
 

Audio Thumbnail Metabox

Audio Metabox is yet another easy tool to add an audio player to the audio post-format post thumbnail.
audio

Audio Metabox in Posts Edit Page

To use, Simply copy your MP3/OGA file direct URL uploaded anywhere on the web to their corresponding input fields in the metabox, or import them from your WP media gallery.