Follow for free plugins, new theme releases and theme news
Plugin Description
Now you can easily embed the FLV Flash videos in your WordPress Blog. I have packaged the three FLV Flash player – OS FLV , FlowPlayer v2, v3, and v5 , and MediaElement.js (for HTML5 player support). So you can use them freely without worries even for the commercial purpose unlike the JW player. (You can also use FLV Player Maxi but it is no longer included by default because it is licensed under non GPL compatible licenses starting from v2.7.1. You need to download it and unzip it under hana-flv-player plugin path manually to use it.)
Mobile device (iPod, iPhone, iPad, and Android phones and tablets) support
How about iPod, iPad, and iPhone support? Flash is not supported under iPod, iPhone, and iPad. So the flash FLV players (Flowplayer 2 & 3, OS FLV player, and FLV Player Maxi) will not work with Apple devices. So I have added MediaElement.js and FlowPlayer5 HTML5 players to support Apple devices. They both support Android phones and tablets, too. So here are the current requirements to support Apple and Android devices.
- You must select MediaElement.js or FlowPlayer5 as the player if you want to support Apple devices.
- Apple browser HTML5 function does not support FLV videos. So to be compatible 100% with Apple devices, you must encode video as h.264 (and give it mp4 extension) since it is supported by both Apple browser and Flash player.
- Also, please note that older Android OS versions 2.x only able to play specifically encoded video files. I discussed more about this in my forum.
Skin support
MediaElement.js and FlowPlayer v5 HTML5 players provides predefined skins which helps to change the design of the video player controls. Hana FLV Player has the capability to support these skin functions. You can easily change the skin by assigning ‘skin’ attribute.
Usage Example
You can place the specific tag element [hana-flv-player] in your wordpress article to show the video. The ‘video’ attribute is mandatory. There are other optional attributes. Default values for the options can be defined in this pages. See the bottom of the page for the example.
[hana-flv-player
video="http://yourwebsite.com/wp-content/plugins/hana-flv-player/babyhana.flv"
width="400"
height="320"
description="Sarah is having fun in a merry-go-round"
clickurl="http://yourwebsite.com/"
clicktarget="_blank"
player="5"
autoplay="false"
loop="false"
autorewind="true"
splashimage="http://yourwebsite.com/wp-content/plugins/hana-flv-player/splash.jpg"
skin="mejs-wmp"
/]
Attributes explained:
- video: URL of the flv video file. This is mandatory.
- width: Width of the Flash player.
- height: Height of the Flash player. If not defined, automatically calculated using 4:3 ratio. If 16:9 ratio is needed, use ‘autow’ as height.
- description: Description of the video. This will be shown when
the_excerpt() is used. Also it is used within the SWF objects or javascripts, so search engines can read it.
- clickurl: If you want to open a website when a user clicks on the video, you can define the target website URL here.
- clicktarget: The target of the URL when clicking on the video. Same window:
_self, New window _blank
- player: If set to “1” , OS FLV will be used. If set to “2”, FlowPlayer v2 will be used. “3” is for FLV Player Maxi. “4” is the new FlowPlayer v3. “5” is for the latest MediaElement.js HTML5 player. “6” is for the FlowPlayer v5 HTML5 player.
- autoload: If true, the movie will be loaded (downloaded). If false, the starting screen will be blank since no video is downloaded.
- autoplay: If true, the movie will play automatically when the page is loaded.
- loop: If Loop is true, the movie will replay itself constantly.
- autorewind: If AutoRewind is true, the cursor will be reset to the start of the movie when the movie is ended.
- skin: Automatically used if player 5 (MediaElement.js) or player 6 (FlowPlayer 5) is used. Example: mejs-ted, mejs-wmp
- splashimage: Only works with FlowPlayer, Maxi, and MediaElement.js. When autoload is off, this splash image will be shown in the player. It only supports JPEG images.
- more_2: more options for Flow Player v2.
- more_3: more options for FLV player
- more_4: more options for FLV player v3
- more_5: more options for MediaElement.js
Event Tracking in Google Analytics
Starting from version 2.7 , Event Tracking in Google Analytics function is supported. It only works with Flow Player v3 and MediaElement.js. Also, you must add the Google Analytics tracking code manually in the theme files or by using other plugins such as ‘WP Hooks’. Once you turn on the Event Tracking feature by setting to ‘Yes’ under Default Settings screen, you will be able to see the result in the Google Analytics screen. (Check out the screenshots 5 ) For more information, please check http://wpmarketing.org/forum/topic/howto-google-analytics-event-tracking-with-hana-flv-player
- Category:”Videos”
- Actions:”Play”,”Pause”,”Stop”,”Finish”
- Additional played time information is availabe for “Pause” and “Stop”
More Attributes (more_2, more_3, more_4, more_5) Sample Generator:
By using ‘more_2’, ‘more_3’, ‘more_4’, ‘more_5’ attributes, you can use advanced features of the each players. There are tons of other options for the customization. You can use most of the options through these attributes. You can start testing by using the javascript generated provided in the settings menu. It is mainly focused on the interface design option. After selecting the options you want, you can click the ‘Generate’ button to generate the sample usage in the output textarea.
Insert flv into template theme files (such as sidebar.php):
Okay, here is the function that you can use in the theme template files to show FLV movie. Basically you need to use hana_flv_player_template_call method. The method takes a single argument. The argument should be just the string of the attributes of usage explained the above. Just copy below code into your theme file and edit red colored attributes accordingly.
<?php
if (function_exists('hana_flv_player_template_call')){
$hana_arg="
video='http://localhost/wp/wp-content/plugins/hana-flv-player/babyhana.flv'
player='2'
width='180'
height='150'
more_2="showStopButton: false, showScrubber: false, showVolumeSlider: false,showMuteVolumeButton: false,
showFullScreenButton: false, showMenu: false, controlsOverVideo: 'locked',controlBarBackgroundColor: -1,
controlBarGloss: 'none', usePlayOverlay:false "
";
echo hana_flv_player_template_call($hana_arg);
}
?>
Note: Be careful when you use other website’s video file as the video source. Since video files are usually large is size they can use up the bandwidth quickly. So you should ask for the owner’s permission before using that link to the file.
Thank you for using my plugin. – HanaDaddy
Have Questions? Hana Flv Player Plugin Forum
Screenshots
-
Plugin Settings Page.
-
Adding the hana-flv-player tag in an article.
-
Example video working.
-
New Popup Dialog for Tag creation. It can be accessed from posting tool bar button.
-
Google Analytics Event Report Screen
-
Skin Samples (Only for MediaElement.js and FlowPlayer5)
