Archive for June, 2012

Best HTML5 Video & Audio Players and Tutorials for Video Blog (Vlogs)

There are lot of  WordPress Plugins build on HTML5 for video blogging and HTML5 based Plugins rapidly growing to represent videos online. Specially with the advancement of mobile technology like iPad, which don’t support Flash player, they can play videos with these HTML5 Video and audio players.   If the user have a  non-HTML5 browser, again these HTML5 video and audio plugins provide Flash or Silverlight fallback players option to run Video and audio streaming on WordPress powered Websites. If you don’t run video on your blog but you can improve WordPress blog With Flash and Video players. There are lots WordPress Themes with Video and audio players features on WordPress as a Video Portal.

HTML5 player is the excellent features in HTML5, which allows to embed video  and audio files without using  flash. In the Following list, you will find best HTML5 video and Audio players for Vlogs and other website that allow to embed video and audio streaming into web pages and ensure backwards compatibility.

HTML5 Video & Audio Players for WordPress


HTML5 Video Player WordPress Plugin

HTML5 Video Player WordPress Plugin includes 3 types of video players:

– Video Player With RightSide Playlist
- Video Player With Bottom Playlist
- Video Player Without Playlist

Live preview | Detail

 Video Gallery WordPress Plugin /w YouTube, Vimeo

responsive, localized, awesome, fully featured, fast. the most advanced stock video gallery in the world! now as a wordpress plugin!

Live preview | Detail

MediaElement.js – HTML5 Video & Audio Player

Video and audio plugin for WordPress built on the MediaElement.js HTML5 media player library. Provides Flash or Silverlight fallback players for non-HTML5 browsers. Supports iPhone, iPad, and Andriod. Supports MP4, OGG, WebM, WMV, MP3, WAV, WMA files as well as captions with WebSRT files.

Check out mediaElementjs.com for more information and examples.

Detail

Vidplanet WordPress Video Sharing Plugin

This plugin can create a comprehensive amount of video playlist and video gallery with full custom controls of shortcode.

Key features are :

  • Create and manage unlimited numbers of playlists.
  • Add any and unlimited numbers of videos to a playlist.
  • Videos can be added by certain video id of youtube
  • Videos can be added by searching youtube instantly.
  • Lot’s of themes and plugins are integrated to watch a video playlist in style.
  • Create and manage unlimited numbers of video gallery.

Live preview | Detail

Projekktor Video Tag Extension

This plugins adds easy to learn shortcodes allowing you to embed a HTML5 based audio and video player into your blog posts with ease. The player features:

  • Six premium player themes
  • automatic Flash fallback
  • custom Logo Overlay
  • Youtube support
  • Social features (embedding, post to Twitter and Facebook)

Please visit www.projekktor.com/docs/wp for more detailed instructions.

Detail

YouTube Premium Videos Integration for WordPress

This Premium YouTube Plugin for WordPress enables you to integrate not only single YouTube videos into your blog posts and pages, but also full YouTube channels and featured YouTube videos (Most Popular videos, Most View videos etc) that you can filter by date (weekly, daily, all time etc).

Live preview | Detail

VideoJS – HTML5 Video Player for WordPress

A video plugin for WordPress built on the Video.js HTML5 video player library. Allows you to embed video in your post or page using HTML5 with Flash fallback support for non-HTML5 browsers.

View videojs.com for additional information.

Detail

External “Video for Everybody”

External “Video for Everybody” is a WordPress plugin that you can use to show videos on your WordPress site. You enter a simple shortcode on your page, and the plugin generates the HTML to deliver the media. Browsers that understand the HTML5 tag will display MPEG/H.264 (.mp4) files, VP8/webm (.webm), or Ogg/Theora (.ogv) files. Other browsers can use Flash to play the .mp4. In all cases, the markup includes links to download the media files. The HTML comes with only minor variations straight from the Video for Everybody model. See that site for fuller details.

Users can optionally use the VideoJS JavaScript library to outfit their videos with an attractive set of controls that includes a full screen option.

This plugin is not for everybody, even if the video tries to be. If I were not writing my own plugin, I would probably be using the Degradable HTML5 audio and video Plugin by Pavel Soukenik.

Detail

Vimeo Video Player WordPress Plugin with Playlist

This wordpress plugin will help you administrate the entire video player using a very friendly interface. You’ll be able to customize the player look & feel, playlist and CSS file.

Live preview | Detail

Video Player WordPress Plugin – YouTube/FLV/H264

This wordpress plugin will help you administrate the entire video player using a very friendly interface. You’ll be able to customize the player look & feel, playlist and CSS file.

Live preview | Detail

HTML5 and Flash Video Player

The html5 and flash video plugin for WordPress allows the addition of video (and other media) to a WordPress website, now you can also watch videos in your iPad or iPod. A full options menu is available with post-level overrides for endless customization. Installation is quick and easy, and no additional setup/coding/php knowledge is required. This plugin is low footprint, creating no tables, and uninstalling cleanly. Provides full support for Html5 Video, skinning the player, integration with Google Analytics, and the capability to display ads from LongTail Solutions.

Detail

Degradable HTML5 Audio and Video

Embed video and audio on your website using shortcodes. The plugin enables HTML5 native playback for users with compatible browsers while offering an elegant degradation to other users through very lightweight Flash players. For HTML5 playback, it auto-detects and offers different alternatives, or degrades to Flash, and (failing even that) to download links.

Typical usage is simply 

Detail | Degradable html5 audio and video plugin

The Wall – Media Gallery – WordPress Plugin

“The Wall” is the ultimate interactive media gallery for your site presentation. Now for WordPress!

The Wall – Features

  • neat effects for your presentations
  • powered by cross-browser js library jQuery
  • works with all media, not only images- inline content, videos, audios, divs with text -all are supported
  • lightbox support
  • DZS Admin Panel included

Live preview | Detail

WordPress Media

WordPress Media 1.3.1 allows the addition of an HTML 5 audio and/or video player to your theme. It requires PHP 5 .1 or higher. The player is an instance of the popular and stable jPlayer by Happyworm and can be inserted into posts via a shortcode, sidebar areas via a widget, or anywhere in your theme via a template tag. Multiple instances of the player on one page is supported.

Live preview | Detail

YouTube Pro

YouTube Pro is a great new plugin for WordPress 3.0! Upload, edit and delete your movies without leaving you blog! And that’s not all! You can change the appearance of your player.

Live preview | Detail

MyMedia for WordPress

WordPress plugin for adding metadata of multimedia items to your blog.
MyMedia is useful when you want to effortlessly:

  • import YouTube videos into your blog
  • catalog your movie collection using metadata from IMDb
  • catalog your music collection using metadata from Last.FM

If one of these apply, stop looking, MyMedia for WordPress has got you covered.

Live preview | Detail

Universal Video

Embed HTML5 video and on your website using shortcodes. The plugin enables HTML5 native playback for users with compatible browsers while offering a simple degradation to other users through the use of the Flowplayer flash player.

Detail

WP YouTube Lyte

WP YouTube Lyte allows you to “lazy load” your video’s, by inserting “Lite YouTube Embeds”. These look and feel like normal embedded YouTube, but only call the actual “fat” Flash or HTML5-player when clicked on, thereby reducing download size & rendering time substantially when embedding YouTube occasionally and improving page performance dramatically when you’ve got multiple YouTube video’s on one and the same page.

Detail

FlasHTML5 Video

A WordPress implementation of the FlasHTML5 Video Javascript Library featuring HTML5 / Flash Video with Mobile Fallback.

Detail

WP Video Music Box

WP Video Music Box – WordPress Plugin is first wordpress floating music player in the world. A music search box an player with the button “music” that will floating on the left of the web page. If the button click, the form will appear with slide effect. The form is using AJAX , so the page wont be reloaded.

Live preview | Detail

WordPress Videos Embedder PRO

The plugins adds automatically a button to WordPress’s default editor (Tinymce) that you can use directly from the post/ page editor or you can just use the shortcode.

Live preview | Detail

Others HTML5 Media Players


Following are the other excellent Media Players and this chart represent and compare the  features of different HTML5 video players.

  1. Acorn Media Player, Accessible and customizable HTML5 media player
  2. Akamai’s Open Video Player for HTML5 <video>
  3. Building a better HTML5 video player with Glow
  4. CwVideo – A Toolkit to handle HTML 5 video made with mootools
  5. Dplayer – the ultimate HTML5 video player
  6. FlareVideo – HTML5 video with Flash fallback
  7. FlasHTML5 Video: The JavaScript Library and WordPress Plugin
  8. FryPlayer– HTML5 Video Player
  9. HTML5 Media Player (Beta)
  10. HTML5 Video Player
  11. HTML5 video player
  12. Html5-video – Videoplayer in HTML5
  13. html5media – Enables <video> and <audio> tags in all major browsers.
  14. jMediaelement – not only just another html5 audio / video player
  15. jPlayer : HTML5 Audio & Video for jQuery
  16. jquery-video –jQuery UI video widget to enhance your HTML5 <video>
  17. JW Player for Flash & HTML5
  18. Kaltura HTML5 Video & Media JavaScript Library
  19. LeanBack Player – HTML5 Video Player with Subtitle-Support
  20. MediaElement.js – HTML5 video player and audio player with Flash and Silverlight shims
  21. Miro 3.5 – An amazing open-source, non-profit video player.
  22. MooPlay- HTML5 Video Player
  23. MooVES 1.0 – The MooTools Video Enhancement System
  24. Moovie
  25. OIPlayer jQuery plugin HTML5 audio and video player with fallback to Java and Flash
  26. Open Standard Media (OSM) Player
  27. Open Video Player for HTML5 <video>
  28. open-player – Cross-browser player for <video> and <audio>
  29. Player Uppod HTML5 video and audio
  30. Projekktor – HTML5 video player
  31. SublimeVideo HTML5 Video Player
  32. Video for Everybody!
  33. VideoJS – a free & open source HTML5 video player
  34. Vimeo HTML5 Video Player
  35. YouTube HTML5 VideoPlayer

HTML5 Audio Players


Accessible Audio Player (AAP) – Cross-Browser HTML5 Audio Player

AAP is an audio player that uses the HTML5 <audio> element for browsers that support it, and the Yahoo! Media Player for those that don’t. It’s available in a standalone version or (with an additional P) as a WordPress plugin called Accessible Audio Player Plugin (AAPP).

An HTML5 <audio> radio player

Previous to HTML5 coming on the scene, it was a fairly awkward task to add audio to web pages. For many years, Flash was the only way to provide audio in any kind of interactive way – but with the introduction of the <audio>element in HTML5, audio playback can now be done natively. It plays nicely with other open standards — you can create custom buttons using CSS and HTML, and give them appropriate functionality using the HTML5 audio API. It is nice not having to go back into Flash every time you want to make some changes to the audio content.

audio.js – Add HTML5’s audio Tag Anywhere

audio.js is a drop-in javascript library that allows HTML5’s <audio> tag to be used anywhere. It uses native <audio> where available and an invisible flash player to emulate <audio> for other browsers. It provides a consistent html player UI to all browsers which can be styled used standard css.

Scott Andrew’s HTML5 audio player

This player is very minimalist but works well. Great to use when you do not need playlists or any fancy effects!

Speakker: Crossbrowser Audio solution featuring HTML5

Comes out of the box in two variations and with incredible options of customization: Flexible dimensions, unlimited colors
and two different button sets for light and dark themes. Easy to set up. Just a few lines of Javascript and a quantum CSS.

Featuring the technology of Projekktor it comes with cross-browser compability, Flash-fall back plus optional
social- and artists information links.

MooTools HTML5 Audio Player

Made with HTML5 and the Mootools JavaScript framework. The player works perfectly on all recent browsers.

Universal HTML5 Audio Player

This player is the only one from the list which isn’t free. But it’s cheap ($5 only!) and works well. It have lots of useful features, such as a way to protect your audio from being hijacked by using a beep overlay, which is a great solution for commercial uses.

SoundManager 2

Using HTML5 and Flash, SoundManager 2 provides reliable cross-platform audio under a single lightweight (10 kb) JavaScript API.
Want to see what you can do with Sound Manager 2? Then visit http://wheelsofsteel.net/ for an awesome demo!

The jQuery HTML5 Audio / Video Library

jPlayer is the completely free and open source (GPL/MIT) media library written in JavaScript. AjQuery plugin, jPlayer allows you to rapidly weave cross platform audio and video into your web pages. jPlayer’s comprehensive API allows you to create innovative media solutions while support and encouragement is provided by jPlayer’s active and growing community.

HTML5 Audio Player Bookmarklet

Adds audio player to play linked audio files on any page. Supported file formats depend on the browser used. Use it on any page which has links to downloadable audio files, for example, you can  play music stored in your Dropbox – visit dropbox.com/m then navigate to folder with music files and use this bookmarklet.

ZEN – a single-song HTML5 Audio Player

HTML5 <video> Tutorials


Learn Flash To HTML5 Video Fallback

Learn how to provide an HTML5 fallback option for devices that don’t support the Flash Player. Tutorial Link:gotoandlearn

Simple HTML5 video player with Flash fallback and custom controls

Want to put video onto your web page? HTML5 enables us to do this as easily as placing images with an <img>element – and in this tutorial, we’ll show you how the magic is done.

HTML5 Video Facts & Fiction: New Whitepaper

This whitepaper cover everything you need to know about the current and future state of one of the most important emerging standards for cross-platform online video delivery, HTML5.

The State of Video on the Web

Developers all over the world recognized the gaping hole that Flash exposed in the HTML specification and devised the HTML5 spec to fill in the void. The web needed a first class citizen for video, much like images, that browsers could play natively –without having to rely on a plugin, be it Flash, Silverlight, Quicktime, or something else.

Cross-Browser HTML5 Video With Flash or Silverlight Fall-back

Until recently, playing video files in a web page was notoriously complicated. The user requires a Flash or Silverlight plug-in and even the simplest HTML is a confusing mess.

Getting Started with HTML5 Video

HTML5 Video. It just sounds sexy. Even typing it stirs an excitement inside me usually reserved for theme park rides and new episodes of Family Guy. It’s one of the most lauded features within the new HTML spec, and also one of the most divisive.

How to Include Video in HTML5

There are no restrictions on the video codec, audio codec, or container format you can use for your video. One <video>element can link to multiple video files, and the browser will choose the first video file it can actually play. It is up to you to know which browsers support which containers and codecs.

How to Build a Custom HTML5 Video Player with jQuery

As professional web designers, we want to create a video player that looks consistent across browsers. Each browser however provides its own different look and feel for the player, from the minimal approach of Firefox and Chrome, to the more shiny controls of Opera and Safari. If we want our controls to look the same across all browsers, and integrate with our own design, we’ll have to create our own controls from scratch. This is not as hard as it seems.

How to Building a custom HTML5 video player with CSS3 and jQuery

Opera Developer Community is sharing articles “Building a custom HTML5 video player with CSS3 and jQuery“. This is the first of a series in which we will look at building up an easily customizable HTML5 <video>  player, including packaging it as a simple
jQuery plugin, choosing control types and outputting custom CSS for your own situation.

How to Create an HTML5 Video Player

There is a lot of HTML5 Video player out there, but how about creating  HTML5 Video Player your self?.  Steveheffernan has writen tutorial  How to Create an HTML5 Video Player It’s meant to give you a basic understanding of the different options you have with the new video tag in HTML5, and the javascript needed to create some of the typicalvideo controls you’d find in other players.

Embed Videos In Your Web Pages Using HTML5

Not only has a very public (and contentious) debate unfolded on the web about the efficacy of presenting videos using HTML5 instead of Flash, but momentum is gathering behind the nascent web standard.

Quick Tip: HTML5 Video with a Fallback to Flash

This article will review how to work with HTML 5 video in your own projects. Because older browsers and Internet Explorer do not understand the <video> element, we must also find a way to serve a Flash file to viewers who are utilizing those browsers.

Detecting browser compatibility for HTML5 video and audio

Different browsers offer different levels of support for HTML5 audio and video. Where some browsers support one type of media file other browsers will fail to do so. While browser vendors continue to implement HTML5 features support should get better and better. However, the situation at the time of writing dictates that we cannot (and certainly should not) assume that a browser will play HTML5 media

Lazy Loading Video To Speed Up Your Web Page

When you have a web page containing a video that will not be played until clicked, you can speedup page loading by applying this quick tip which you may have seen on Facebook.

Making a Custom YouTube Video Player With YouTube’s APIs

Video presentations are a great addition to any product page. With a presentation you can showcase your product’s features without making the visitor read through long paragraphs of text. But apart from producing the video, you still need to manually convert it and find (or code) some sort of flash player that will display it on your site.

HTML5 <audio> Tutorials


How to Building a Custom HTML5 Audio Player with jQuery

Neutroncreations recently built an HTML5 audio player for Tim Van Damme‘s The Box, a new podcast where he interviews people who make cool stuff. Tim wanted an HTML5 audio player on the site, and they put together some jQuery to hook up the player interface he designed. Neutroncreations is sharing tutorial How to Building a Custom HTML5 Audio Player with jQuery through the code to explain how it works, covering a few caveats along the way.?

Building a Custom HTML5 Audio Player with jQuery

They have built an HTML5 audio player for Tim Van Damme‘s The Box, a new podcast where he interviews people who make cool stuff. Tim wanted an HTML5 audio player on the site, and we put together some jQuery to hook up the player interface he designed. In this article we’ll run through the code to explain how it works, covering a few caveats along the way.

Other useful Resources and References

11 Efficient HTML5 Video Players
HTML5 Video Tools
10 Best HTML5 Video Player
HTML5 & CSS3-Powered Audio Player – ZEN
HTML5 And Javascript Audio Interface: JAI
MooPlay – Build Your Own Custom HTML5 Video Player
HTML5 video players
Getting Started with HTML5 Video Players: Resources and Tutorials
HTML5 Video Player With Subtitle-Support – LeanBack Player
20 Excellent HTML5 Video Players
MooVES – MooTools Video Enhancement System
10 Amazing HTML5 Media Player Implementations (Inspiration)
5 Interesting HTML5 Video (Media) Players Implementation Across the Web
Adobe announces the HTML5 Video Player widget
Open Standard Media (OSM) Player – All-in-one Media Player For Web
23+ Useful HTML5 Open Source Online Video Players & Libraries
MediaElement.js – HTML5 Video Player
Moovie – MooTools HTML5 Video Player
A Collection of 20 HTML5 Video Players
10 HTML5 Video Players
10 Free Open Source Web Based Media Player Apps
5 Open Source HTML5 Video Players for Web Developers
7 Most Useful HTML5 Video Integrating Tools
Fresh Resources for HTML5 Video and Audio
HTML5 Video Player With Flash Fallback: FlareVideo
Best HTML5 Media Player Implementations
5 Tools For Integrating HTML5 Video in Your Website
YouTube Chromeless Video Player – jQuery Plugin
Review: Flowplayer
HTML5 video Libraries, Toolkits and Players
HTML5 Video Player
HTML5 Media Element API

Adding Custom Navigation Menus in WordPress Themes

Custom-Navigation-Menus-WordPress-Themes

The navigation bar is a very important part of  any website to attract the visitors. Some WordPress themes have very simple navigation bar, so there is a need to make to according to customer requirements which look good with the website design. Customization of  ready made  themes become very difficult if they have used function to control the Navigation bar. But Some themes like U-Design WordPress Theme with complicated structure give you very simple way to customize the whole theme design.

As well you can control the design with WordPress plugins and can design your own HTML and CSS based navigation bar, for that giving you some practices and suggestions along with useful references.

If you are using Thesis Theme, than you must watch this Video tutorial, in which they explained how to set up menu, and how to create a new design and control new menus.


Navigation Menu was introduced in WordPress Version 3.0 and in a new WordPress Version 3.4  you can  utilize these great features to customise the navigation menus into any theme. All you have to add few code segments in your theme. Following are the available function references to Register Navigation Menu:

 And Follow are the Functions to Show Navigation Menu:

How to Add New Register Menus

First of all add add following code segment into Theme’s function.php file to register a name of Menu:

function register_my_menus() {
  register_nav_menus(
    array( 'header-menu' => __( 'Header Menu' ) )
  );
}
add_action( 'init', 'register_my_menus' );

And  to appear two menu options add following code segment , header menu and extra menu -

function register_my_menus() {
  register_nav_menus(
    array(
      'header-menu' => __( 'Header Menu' ),
      'extra-menu' => __( 'Extra Menu' )
    )
  );
}
add_action( 'init', 'register_my_menus' ); [Source]

This means that you can create multiple menues and can add existing Catergories or  pages to the created Menu through Appearrance >> Menu Option, as well you can add custom links to the created menu with simple drag and drop option under Menu settings:

You can create multiple menus, add existing categories or pages to the menu, and you can add custom links to menu as well. You can organize the menus and create drop-down menus with a simple drag-and-drop feature.

How to Display Menus on Theme

After creating custom menu, now you want to add created menu into your theme. First you have to decide where you want to display your menu, normally n a header area (above or bellow the logo). So add the following code in the header.php file where you want to display it, but it not limited to header file, you can add where you want to display your menu:

<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>

or

<?php wp_nav_menu( array( 'sort_column' => 'menu_order', 'container_class' => 'menu-header' ) ); ?>

or

wp_nav_menu( array( 'theme_location' => 'extra-menu', 'container_class' => 'my_extra_menu_class' ) );

Just make sure that the theme_location points to the name  of  menu in the functions.php file.  In the 2nd example (Source), the main function is  wp_nav_menu, sort _column is used to order you pick in the options panel and container_class is the CSS style for created menu.

Design a Navigation Bar

Its all depends on your design, To understand the basic structure about illustration and design by using HTML and CSS in the different ways follow the following links:

WordPress navigation bar 1119
Top 5 WordPress navigation menu tutorials
How to make categories drop down menu
Simple navigation bar with css and xhtml
Goodbye headaches hello menus
Sliding doors WordPress navigation css technique
Best practices to design a perfect html navigation bar
Creating two tiered conditional navigation in WordPress
Simple glossy navigation bar design in photoshop

I have design the U-Design WordPress theme, if you want to add navigation bar in a header file,  create a style for navigation bar in style.css file and there is a  file custom_style.php in  a folder “u-design\styles\custom\”. Open this file and change the #navigation-menu  setting according to your own requirements.

WordPress Menu Plugins For Better Navigation


WordPress Plugins  provide a new and improved functionality to you Website, and For Navigation design there are lots of useful plugins which you can use in different situations. There are mainly two ways to use WordPress Plugins for Navigation bar, first to  design and improve the Front end navigation and second, how to manage  the Navigation bar.

WordPress Menu Plugin to improve Front end navigation

You can create and customize your theme by creating primary menu anywhere in your theme like in header or footer. As well if you are creating Content Management System style website, these WordPress plugins help a lot customize the sidebar.

UberMenu – WordPress Mega Menu Plugin

UberMenu is a user-friendly, highly customizable, responsive Mega Menu WordPress plugin. It works out of the box with the WordPress 3 Menu System, making it simple to get started but powerful enough to create highly customized and creative mega menu configurations.

Menu Management Enhancer for WordPress

Live preview | Detail

CSS3 Mega Menu WordPress Plugin

This CSS3 Mega Menu WordPress Plugin will help you to create easily your own “Mega Menus” with WordPress. It doesn’t use any javascript and relies only on CSS .

Adding a menu to your WordPress site can be done by either using the built-in functions directly in your theme files or by using the Mega Menu Widget and adding them to the preedefined widgetized areas. This item comes with 9 color variants and 2 drop down themes (light and dark) with a documentation to help you to start quickly.

Live preview | Detail

WP Sticky Menu Plugin

Sticky Menu Plugin has it’s own option panel from where you can select your styles, the alignment of the menu (Top or Bottom), the width of the menu (980px or Full Width). You can also select the animation effect for the sliding out and in of the menu.

Live preview | Detail

PBK Mega Menu for WordPress

PBK Mega Menu Plugin for WordPress is your easy way to add a functional and customizable Mega Menu to your WordPress website. Adding menu items and content is just like adding posts or pages… If you know how to use WordPress, then you already know how to use the Mega Menu plugin.

Live preview | Detail

CSS3 Sticky Footer Menu For WordPress

This CSS3 Sticky Footer Menu For WordPress will help you to create easily your own Sticky Footer with WordPress. It doesn’t use any javascript and relies only on CSS. Wordpress shortcodes and CSS classes allow you to create lists, paragraphs with (or without) images or make your menu items stick to the left or the right side.

Live preview | Detail

Fading Menu with Notification Bar and Social Icons

Fading Menu with notification Bar is a WordPress Plugin that will allow you to add your navigational menu (main menu or custom menu defined by you) along with notification bar at the top of your browser. Simply scroll down your browser a bit to see it in live action!

Live preview | Detail

niceMenu – WordPress Plugin

You can navigate on multiple levels very easy! Just a few clicks & the menu is installed on your wordpress website. It’s easy to position anywhere, as a widget sidebar. You can put custom links, website pages & categories.

Live preview | Detail

Sticklr WP – Sticky Side Panel WordPress Plugin

Stickr WP, a sticky side panel menu WordPress plugin. Inspired by Envato site-switcher, after released as CSS3 +jQuery, due to popular demand I decided to create this WordPress plugin version. The features are similar with jQuery version, only WordPress version has an intuitively easy administration panel, so you don’t have to know the coding behind it.

Live preview | Detail

Advanced Menu Widget

This plugin adds enhanced “Navigation Menu” widget. It offers many options which could be set to customize the output of the custom menu through the widget.

Features include:

  • Custom hierarchy – “Only related sub-items” or “Only strictly related sub-items”.
  • Starting depth and maximum level to display + flat display.
  • Display all menu items starting with the selected one.
  • Display only direct path to current element or only children of selected item (option to include the parent item).
  • Custom class for a widget block.
  • And almost all the parameters for the wp_nav_menu function.

Detail

SLMenuWidget

SLMenuWidget is a plug-in for WordPress. It provides an easy to use submenu widget that can be used for WordPress themes which doesn’t deal with sub pages. It renders nothing if the current page does not have sub pages. If you have any questions or if you need more information, please visit www.steffen-liersch.de/wordpress

Detail

Dropdown Menu Widget

Dropdown Menu widget adds a beautiful, CSS only dropdown menu, listing pages, categories of your blog. You can also turn your wordpress navigation menu into a beatiful dropdown menu using this plugin. It allows you to chose vertical or horizontal layout. It supports multiple instances. You can select a theme for your widget from the Dropdown Menu Settings page or you can CREATE YOUR OWN THEME WITHIN SAME PLUGIN!! You can also customize your dropdown menu using CSS. If you want a custom dropdown theme you can request one. Please visit plugin site for more information.

Detail

PixoPoint Menu Plugin

Adds an SEO friendly, accessible regular or dropdown menu to your WordPress blog. Visit the PixoPoint Menu Plugin page for more information about the plugin.

Features

  • Control content will be displayed in the menu
  • Easy to use interface for modifying the design
  • Animation drodpown menus
  • Up to two menus
  • Plus much more

Detail 

AllWebMenus WordPress Menu

The AllWebMenus WordPress Menu add-in & plugin combination is designed to retrieve information from your blog (such as posts, pages, etc.) and import it into the AllWebMenus application to create stylish, feature-rich navigation menus, and not only! Apart from creating menu items derived from your blog’s structure, fully customize your menus adding your own non-wordpress menu items with external or internal links, html-rich content, colors, borders, effects, designs of your choice and many more!

Detail

CMS Navigation

Our new plugin, WPML, includes the functionality of CMS Navigation and is recommended for new designs. It features much cleaner and simpler HTML and customization via the admin screen. Additionally, we recommend you checkout our new CMS enabling plugins Types andViews.

With Types and Fields, you can achieve the functionality of this plugin yourself and customize it in whatever way you like.

Detail

Multi-level Navigation Plugin

Adds an SEO friendly, accessible dropdown/flyout/slider menu to your WordPress blog. Visit the Multi-level Navigation Plugin page for more information about the plugin. Paid premium support for this plugin is available via the PixoPoint Premium Support service.

Detail 

Navigation Menu Widget

This is an advance widget that gives you total control over the output of your menus. Support multiwidget, resizeable page featured image, easy to customize and full features. Displays a list of menu as links. This widget is based on the WordPress function: wp_nav_menu()

Detail

Mashable Menu for WordPress

This is a WordPress version of Mashable Menu – Pure css (Redesigned) .

Features:

  • you can add 15 category and 7 subcategory !
  • Easy To Setup & Customize
  • CSS3 Effects;
  • JS jQuery

Detail

WordPress Menu Plugin for WordPress Menu management


Advanced Menu Manager System

Main feature about this application is the fact of using the nested set model hierarchical data structure instead of the old adjancy list. Nested set Modal is a much more robust and faster way of storing and retrieving hierarchical data on a database that strugles with relational calculus and relational algebra such as MySQL

Live preview | Detail

Menu Management Enhancer for WordPress

The WordPress 3 Menu Management System is excellent, but it can be a bit cumbersome if you’re managing many menu items. The Menu Management Enhancer for WordPress aims to improve the menu management user experience.

  • Manage large numbers of menu items with ease
  • Expand and collapse menu item trees
  • Quickly jump to any top level menu item
  • Enhanced drag & drop jump-to-item functionality
  • View menu item IDs
  • Child and descendant menu item counts at a glance

Live preview | Detail

Easy Menu Manager

Easy Menu Manager is an AJAX /PHP powered menu management system. You can add, edit, delete, and reorder menu items easily using this application.

Live preview | Detail

Gecka Submenu

Submenu enhances the WordPress 3.x navigation system. When you have a website based on WordPress with a lot of pages, but you need a custom menu, it can be tedious to have to add a menu entry for each page created. Submenu just does it automatically.

Detail

Admin Menu Tree Page View

Adds a CMS-like tree overview of all your pages and custom posts to WordPress – much like the view often found in a page-focused CMS. Within this tree you can edit pages, view pages, add pages, search pages, and drag and drop pages to rearrange the order.

CMS Tree Page View is a good alternative to plugins such as pageMash, WordPress Page Tree and My Page Order.

Detail

Admin Menu Tree Page View

This WordPress plugin adds all your pages to the admin menu, so all your pages will always be available within just one click, no matter where you are in the admin area. You can also add pages directly in the tree and you can quickly find your pages by using the search box.

Detail

WordPress Page Tree

Do you have a WordPress site with lots of pages in a hierarchical structure? Are you trying to use WordPress like a “real” CMS? Then this plugin is for you!

Page Tree gives you a much-needed overview of your pages in the admininstration panel using a common expand/collapse menu, which lets you navigate your page structure like a folder tree in Windows Explorer.

Detail

My Page Order

My Page Order allows you to set the order of pages through a drag and drop interface. The default method of setting the order page by page is extremely clumsy, especially with a large number of pages. The plugin also installs a replacement widget that exposes all the options of the wp_list_pages template function.

Detail

Obox Mobile – WordPress Mobile Plugin

Best and Free WordPress List Building plugin

Every blogger  want more targeted traffic and want their customers must be revisit by weekly or monthly.  Even those Website owners who have eCommerce site powered by WordPress want to increase their sale by generating more traffic on their online store.  As well, for email marketing, every site owner want to increase their subscribers list. In all above scenarios, if you are using WordPress than there are Free WordPress List building plugins, which help you to achieve these goals.  List building is the process of adding new subscribers to your mailing list. These plugins are very easy to implement on your site to use  and you can run unlimited campaigns in a single installation.

Best eBook on List Building for Bloggers: Proven Email Strategies that Build your Audience, Increase Engagement and Grow your Income

In the following list there are best and free WordPress  plugins which will help you to increase the number of your newsletter subscribers and gain return visitors.

WP Opt-in

This plugin can be used to send e-mail to users. The front side of the ‘WP Opt-in’ plugin is a simple form with an e-mail input field and a submit button. By entering an e-mail address into the field and pressing submit, an e-mail is sent automatically to the specified address.

Detail

WP Slide In

This plugin may not be 100% compatible with all WordPress themes or every possible browser out there. Generally speaking though, it works very well with MOST themes and most browsers.

The WP Slide InWordpress plugin allows you to create eye-catching opt in banners that stick to the base of your blog and virtually
attract your blog visitors to subscribe to your mailing list! You can load up as many Slide Ins as you want and you can customize where they enter from.

Detail

WordPress Mailing List Builder

This plugin allows you to easily insert GetResponse subscription forms into your WordPress content. You simply type in [mlb /]. But you can also specify a Call to Action by doing[mlb]Subscribe to Receive More Cool Articles About This Topic[/mlb]. You can see a live example here.

Detail

WP GetResponse

Uses the GetResponse JSON API ( no iFrames ) to add contacts to your specific campaigns automatically from your site.

Detail

GetResponse Footer SlideUp

Footer Slideup Form is one of the best ways to ask your user to subscribe to your list without any interruption or blocking and this plugin does exactly that. It adds GetResponse subscribe form in the footer of your WordPress blog. GetResponse (Aff Link) is an autoresponder which allows you to send series of email message to subscribers.

This plugin is only for GetResponse form and for AWeber please use AWeber Footer SlideUp form plugin.

Detail

G Power Plus List Building Plugin

G Power Plus Plugin is part of G Power Plus list building app. This plugin adds a customized link to posts, sidebar & footer to turn Google plus one into subscribers OR you can ask your users to SIGN IN with their Google OR Google Apps account for a bonus report or anything & in the background they will be automatically subscribed to your list. Supports Aweber, GetResponse, iContact, ImnicaMail & TrafficWave autoresponders.

Detail

Generate Box

The plugin adds more functionality to the StudioPress Generate Child Theme.
This plugin is a very handy tool for Generate Child Theme users, it allows you to display the Generate Box on front page, home page, single posts, and everywhere. It also has an option to switch between different color schemes with only a few clicks.
See live example of Generate Box.

Detail

Premium WordPress List Building Plugin


Subscriber Traffic Pop for WordPress

Subscriber Traffic Pop for WordPress takes the original jQuery version and puts it on steroids to create an awesome list building tool. Turn your traffic into an email list generating army by utilizing the Traffic Pop™ base as a way to generate tons of highly profitable email leads quickly and easily!

Live preview | Detail

MailChimp Comments

MailChimp Comments is a plugin for WordPress that allows you to subscribe commentators of your posts/pages via MailChimp. When a users comment something on your website, they are immediately added to your email subscription list. You can configure the plugin with respect to your users to avoid any mailing violations (spam). MailChimp Comments is a perfect way to build a list of your commentators.

Live preview | Detail

SubscribeTo Plugin

SubscribeTo is a poweful plugin to increase your lead generation. You can place your MailChimp or Constant Contact email subscribes form easily using SubscribeTo.

Live preview | Detail

WordPress Email Newsletter Plugin

The email newsletter plugin is an advanced bulk emailer designed especially for WordPress 3. It is very easy to use and feature rich. Heaps of features which allow you to quickly send professional newsletters to your existing wordpress user database.

Live Preview | Detail

AJDE Newsletter subscription form – WP Plugin

Easy newsletter signup form that runs from WordPress and store data to WordPress database. Also allow bulk emailing to the subscribers email list. This form uses real-time AJAX for form submission that makes subscriptions so easy for users. You can customize almost everything about this form very easily from the back-end.

Live preview | Detail

Newsletter Tycoon

This plugin allows users to subscribe and receive a newsletter containing the blog latest posts. The newsletter subscription system features a double opt-in system, with email confirmation. Administrators can also activate subscribers.

Live preview | Detail

Subscribe Popup

Subscribe Popup is a plugin for WordPress that allows you to add a highly customizable subscribe popup box to your blog or website. Once raised popup box asks visitors to submit their name and e-mail. These data is saved in database or submitted to MailChimp newsletter system. All saved data can be exported as CSV -file to be used with any other newsletter systems. Subscribe Popup is a perfect way to extend functionality of your website.

Live preview | Detail

Facebook Subscribe for WordPress

Facebook Subscribe for WordPress brings you full control and support of Facebook’s New Subscribe Button social plugin. FB Sub for WordPress is the only plugin offering full shortcode + template tag support for WordPress.

Live preview | Detail

Subscribe to Download for WordPress

Subscribe to Download for WordPress makes it super easy to add a cool freebie download system to your site, just like the popular resource site PremiumPixels and the new freebie section on tyler.tc. Subscribe to Download not only handles all of the emails and verification, it also has a list manager that can be exported with one click to any popular mail service.
Live preview | Detail

WooCommerce MailChimp Subscribe – WordPress Plugin

The SeedProd WooCommerce MailChimp Subscribe WordPress plugin displays a newsletter signup checkbox on checkout for WooCommerce integrated with MailChimp. Also includes a MailChimp List Health Dashboard Widget.

Live preview | Detail

How to Secure WordPress Pages or Posts with SSL (WordPress HTTPS )

How-Secure-WordPress-Pages-Posts-with-SSL-WordPress-HTTPS

We can use SSL certificate to secure your WordPress pages to increase the security of content. You can read about SSL (secure socket layer) on: SSL which explain, it is a protocol to send  data in an encrypted and secure form between browser (clients side ) and web server for secure communication and secure  (https://)  identification of a network server. HTTPS connects on port 443, while HTTP is on port 80.

Why use SSL (https://):


There are lots of reasons to use SSL on WordPress Powered websites and blogs pages. If you’re going to run an online store or ecommerce Web site developed on WordPress, you have to use  HTTPS for payment process. If you have very sensitive information and need to send to client in a secure way which can be packet sniffer for stealing items like credit card or login details.

In case if you are using WordPress for health Professional relatd website, need to secure patients details for online booking appointment to make it confidential. As well, if you are collecting donation and need to authorise the donation process. So its better to secure data on-line by requesting client to download certificate on your machine first and than continue the process of payment or for any other data transfer. In a simple way we should use SSL  to Boost Customer Confidence in your Web SitesGravity Forms is the best WordPress plugins for creating forms which gives a very high customization flexibility for content. In addition, you get the complete support once you have purchased the Gravity forms plugin form the website.

How to acquire and set-up   SSL work?


The most important and first thing is to have a Certificate on your hosting platform. Most of the hosting companies provide you to buy a certificate with different prices as follow:

HostGatorThere are two ways to obtain an SSL Certificate for your website.  You may obtain the SSL Certificate from HostGator, and we will install it for you for free, or you may obtain an SSL Certificate elsewhere, and we will install it for a $10 fee (in most cases).

WPWebHost: With GeoTrust SSL certificates you can start conducting secure online transactions with confidence, quickly and cost-effectively. All of our SSL certificates enable up to 256-bit encryption and can be used to secure servers used for Web sites, intranets, extranets and other online applications.

Go Daddy: Protect transactions and customer data with a SSL Certificate. Standard SSL £43.99/year - Verifies your domain control & secures your site.

Hostmonster:  eCommerce features will SSL secure server

There are other ways to get your SSL  certificate on your hosting , so you should consult with your hosting provider company. I am not going to in detail about how to get your own SSL certificate, although its possible to have create your own private and publick kies and install requesting publik key to install on client machine, but you for better understanding you can read this article Secure SSL Certificate.

Securing Posts and Pages Via SSL


After installing the certificate on your server to secure the sensitive resource, type your web page or post’s URL with https://,  It will ask you to install the valid certificate on client side’s browser.  you will see a padlock in your browser bar. There are WordPress Plugins to protect the posts or pages as follows:

WordPress HTTPS (SSL)

If you’re having partially encrypted/mixed content errors or other problems, please read the FAQ. If you’re still having trouble, please start a support topic and I will do my best to assist you.

Detail

SSL Insecure Content Fixer

 It’s quite common to use WordPress as the host for an online shop, and that often means having an order page that needs to be encrypted via SSL. You don’t want your customers providing credit card details or other sensitive information over an unencrypted connection! But some WordPress plugins don’t take SSL into account, and merrily load scripts and stylesheets without encryption. This plugin attempts to fix this problem, where there are simple solutions. How it does this is described in this blog post.

Detail

WPSSL (WordPress with SSL)

This plugin will force a WordPress post or page to use https instead of http. It is based off of “Dwamian’s Per Page Force SSL” plugin, but this has been updated for us with WordPress 3.x. Additionally, when a page is “forced” into SSL mode, it will make sure that all page elements are loaded via https (so that you won’t get warnings). If you have to link to a 3rd party external file, use the wpssl_showlink function (it will switch it between https and http).

Detail

Restrict Content Pro – Stripe Payment Gateway

When using this add-on, your subscribers will stay on your site throughout the entire registration process, instead of being redirected to an outside site, such as PayPal. The user simply enters their credit card information and clicks Register.

Securely Process Credit Cards: All credit card transactions are processed securely through Stripe and no sensitive information is ever stored on your server.

Note: you should still always have a valid SSL certificate installed on your registration page.

Detail

Admin SSL

Admin SSL secures login page, admin area, posts, pages – whatever you want – using Private SSL. Once you have activated the plugin please go to the Admin SSL config page to enable SSL, and read the installation instructions.

Detail

There is an other way to give the admin and login page to get SSL sertificate through adding two lines of code in wp-config file as it will force all admin and other users to login through secure httpts: page. The detail about Securing Admin on Administration_Over_SSL:

define(‘FORCE_SSL_LOGIN’, true);
define(‘FORCE_SSL_ADMIN’, true);

If you want to check your WordPress vulnerabilities, use the online security scanners that provide the web application security testing, network security testing and information gathering facilities: Vulnerability Scanners Online.

If you still required any information about WordPress security and want to secure your sensitive information on a WordPress more secure, feel free to leave a comment of  Wparena facebook fan’s page  or in a comment box below. For all inquires regarding theme development, SEO and Security issues related to WordPress, email: info at wparena.com.

How to Create Your Own Membership Site by Using WordPress

If you really want to earn money on-line than the easiest way is create your own Blog and start earning but at sometime point blogging can not give you enough money. So If you are interested to convert your blog into interactive website than develop a “Membership site” by using WordPress themes or plug-ins.
Having a membership website specially using WordPress, give you financial benefits along with repotition in the blogging market, instead of selling one time product, its better engage your site members for long run that give you recurring income stream.

On the following link you will find detail about how to create and why you should have a membership site for making money online.

How to Create a Membership site with WordPress

Hope by creating such kind of website, you can expand your aims and objective to attract more users by giving them exclusive membership option, can start paid forum, as well you can sell your design to paid subscribers.

WordPress Premium Content

Jigowatt’s WordPress Premium Content plugin allows you to easily set up a web site with content which is only accessible to users registered with an active PayPal subscription. You can easily manage your subscribers, change subscription prices and set up custom membership renewal options (annual, bi-annual or just month by month).

Live Preview | Detail

Restrict Content Pro – Premium Content Plugin

Restrict Content Pro is a complete subscription and premium content manager plugin for WordPress. Create an unlimited number of subscription levels, including free, trial and premium. Manage member’s and their subscriptions, track payments, offer discounts with a complete discount code system, and provide premium, members only content to your subscribers.

Live preview | Detail

WP-Membership Plugin

This is a WordPress plugin that helps you sell your content; you only need to install the plugin, create a category for your private content, setup the prices of your memberships and your Paypal account. Don’t hesitate and purchase it today

You can easily select the posts you want to sell, manage the memberships you acquire and is fully integrated with Paypal. All you have to do is activate the plugin, setup your memberships and your Paypal account.

Live preview | Detail

Free & Professional WordPress Security Service Free & Professional WordPress Security Service

We Love WordPress. WordPress Arena is a place for WordPress Developers and Designers, providing Tips, tricks, tools and resources to build a website or blog on WordPress. We also present The WordPress Showcase for all kind of WordPress Powered Websites.

Recent Comments

Tink Seagraves

|

Seems to have a little crush on G-Dub!