Social and Media Sharing

Twitter

Facebook Likebox

You can customize LikeBox Plugin from the official website at Facebook.

Flickr

You can place images from your Flickr account using Flickr Badge

Youtube

Description

You can add Youtube Video easily:

  1. Open desired video on Youtube
  2. Click the Share button under the video
  3. In the appeared window click Embed
  4. After making your selection, copy and paste the embed code to your website.

Vimeo

Description

You can add Vimeo Video easily:

  1. Open desired video on Vimeo
  2. Click Embed in the top right corner of the video
  3. In the appeared window you can see the embed code. You can copy it or customize according to your needs. Click "Customize embed options" to see video embed options.
  4. After making your selection, copy and paste the embed code to your website.

Video Player

Audio Player

Description

This player supports such media formats as: mp3, mp4 (AAC/H.264), ogg (Vorbis/Theora), webm (Vorbis/VP8), wav, mp3, mp4 (AAC/H.264), flv

Two files are required for the player's correct work: jquery.jplayer.min.js and Jplayer.swf

HTML entry, with an example id for jPlayer:

<div id="jpId"></div>

Code Example:

$(document).ready(function() {
  $("#jpId").jPlayer( {
    ready: function () {
      $(this).jPlayer("setMedia", {
        mp3: "/mp3/elvis.mp3" // Defines the mp3 url
      });
    }
  });
});

You can see more information on working with JPlayer on the official website at JPlayer

Social Icons

Description

Social Icons

To add social icons to your website you can use the icon sets that are included into the purchased template package. Icon sets are located in the "images" directory.

Twitter Button

You can learn more about adding Twitter Button to your website here

Google Plus Button

You can learn more about adding Google Plus Button to your website here

Like Button

You can learn more about adding Like Button to your website here

Font Icons

  1. You can easily change the size
  2. You can easily change the color
  3. You can easily shadow their shape
Description

Choose icon color, size and shadow. All these parameters should be added to the style.css for ".pro_icon" or ".pro_icon_social" classes. Then add attribute data-icon="" to the icon you like (hover the icon to get it's class and data-icon attribute).

For example:
<a href="#" class="pro_icon" data-icon="a"> </a>
<a href="#" class="pro_icon_social" data-icon="l"> </a>

Font IcoMoon is used for the social icons.