how to use youtube plugin, mp3 plugin

[jrkishore4u]

Hi to all,

I installed the following plugins in GetSimple 3.1ver

1. You tube plugin
2. ultimate mp3 player
3. dominion mp3 player
4. mp3 extended
By extracting these files in plugin folder

But i dont know how to use these plugins in the site... i tired the tags in source page of my html site in editor page{youtube_wpKrUiwzt1u}. but i didn't get the output please tut me how to use this plugin...

my requirement is as follows:
1. adding mp3 flies in my html site
2. adding video in my html site

i dont know whether it is correct plugins for my site or not but i have to know how to use the above plugins (any example sites are using)

Pls help me... sorry for any bad english..

Thank is advance... and also thanks for giving nice CMS freely...

[alienee2]

Hi to all,

I installed the following plugins in GetSimple 3.1ver

1. You tube plugin
2. ultimate mp3 player
3. dominion mp3 player
4. mp3 extended
By extracting these files in plugin folder

But i dont know how to use these plugins in the site... i tired the tags in source page of my html site in editor page{youtube_wpKrUiwzt1u}. but i didn't get the output please tut me how to use this plugin...

my requirement is as follows:
1. adding mp3 flies in my html site
2. adding video in my html site

i dont know whether it is correct plugins for my site or not but i have to know how to use the above plugins (any example sites are using)

Pls help me... sorry for any bad english..

Thank is advance... and also thanks for giving nice CMS freely...

1. You tube plugin

- i would recommend just using dynpages for this; no need for the youtube plugin; other option is to install the youtube ck editor plugin; but in my experience, the dynpages is the way to go.

2. ultimate mp3 player
3. dominion mp3 player
4. mp3 extended

i wouldn't use any of these (as good as they might be); i would just get a good mp3 player from codecanyon and then integrate it with dynpages.... here's a GREAT player and fairly easy to get it to work in GS:
http://codecanyon.net/item/fancy-music-p...iew/498071

or use something like mediaelement.js, yahoo web player...these are all REALLY easy to integrate and more flexible, current, compatible, than a fixed plugin...

-marc

[jrkishore4u]

Thanks alienee2 for ur reply

how to integrate the Fancy Music Player V2.0 in GetSimple 3.1 can u give instructions to install in GetSimple?
pls

[alienee2]

Thanks alienee2 for ur reply

how to integrate the Fancy Music Player V2.0 in GetSimple 3.1 can u give instructions to install in GetSimple?
pls

if you buy the player, then there are instructions for how to put it in a site; basically you first have to include the jquery files in the header; i seem to recall that it worked best to create a js folder for the scripts in the root and then include the files like below and not in the theme folder:

Code:

<link rel="stylesheet" type="text/css" href="<?php get_theme_url(); ?>/css/jquery.fancyMusicPlayer-white.css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="/js/soundmanager2-nodebug-jsmin.js" type="text/javascript"></script>
<script src="/js/jquery.fancyMusicPlayer.min.js" type="text/javascript"></script>

in the footer of the template you have to put this:

Code:

<script type="text/javascript">
    $(document).ready(function(){
        $('#fancyMusicPlayer').fancyMusicPlayer({playlistHeight:130,playlistInitOpen:true,swfFolder:'/swf/',trackColorNormal: '#0D0E10', trackColorHover: '#aeaec6', trackColorSelected: '#625A71'});
    });
</script>

and specify the location of the swf folder after the swfFolder: ... again i think it works best if that is relative to the root;

then you can setup the players like this:

Code:

<div id="fancyMusicPlayer">
  <a href="path/to/mp3/file.mp3" title="Audio File Title" target="path/to/mp3/file.mp3"></a>
   ...here you can keep adding files and the will all appear in the playlist.... (repeat the anchor code)
</div>

you might find it easier to use yahoo web player if that is too complex;

for each playlist, i created a component for each playlist - this is easier to maintain and the code doesn't get messed up in the editor; so then you can call the audio players in your site using the dynpages plugin..

-marc

[jrkishore4u]

Thank you... alienee2

ok i have one more question i.e. i installed ultimate mp3 player in my GetSimple CMS and i upload a mp3 file from file management to project's upload folder. And i use a mp3 tag to play the file.... like that Is there any possibility to upload a video file into upload folder and display/play in a page using video player.

What should i do?

[alienee2]

The html5 video plugin for CK editor works great; you just need an mp4 and webm file for the video and ck editor will create the necessary markup - also you need to include the videojs script on the page; i will try to post instructions at some point...

-marc

[jrkishore4u]

Thank you alienee2... i'm waiting for your reply (instructions)

[alienee2]

here is how to install the html5 video for ck editor and then use videojs to display them:

1.) Download ck editor plugin here:

http://martinezdelizarrondo.com/fckplugi...o1.2.1.zip

2.) upload that folder that you unzip into:
admin > template > js > ckeditor > plugins
(put the whole 'video' folder there

3.) add these to gsconfig:

Code:

define('GSEDITOROPTIONS', "extraPlugins:'video'
        ");

Code:

define('GSEDITORTOOL',"['Source'],
                        ['Cut','Copy','Paste','PasteText','PasteFromWord'],
                        ['Bold','Italic','Underline','Strike'],
                        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
                        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
                        ['Link','Unlink','Anchor'],['Video'],
                        ['Image','Flash','Table','HorizontalRule','SpecialChar'],
                        '/',
                        ['Format','Font','FontSize'],
                        ['TextColor','BGColor','Maximize']");

3.) Add this to the head tag of your template.php file:

Code:

<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/c/video.js"></script>

4.) Upload the webm and mp4 versions of the video you wish to display into your uploads folder, and also a 'poster' which is like the first frame of the video or something else of the same dimensions as the video... i think the poster might be optional.

5.) create the page and click on the video button on the editor; enter the URLs to the videos you uploaded as well as the poster.

Click save and see if your video displays.

make sure to enter the absolute URL to the video files; they can be local or any URL to a video.


-marc

[jrkishore4u]

Hi

I just wanted to thank you for taking the time to reply to my problem in such a prompt manner.
Thank you so much for responding so quickly. It really helped me.

I installed html5 video for ck as per your instructions. I get video icon in the editor tool bar. And i upload an mp4 video file into my upload folder.... And I clicked on the video button on the editor to enter the URLs to the videos. I uploaded video as well as the poster and save updated... But i got the message "no video with supported format and mime type found" and poster is coming. I Google the issue "no video with supported format and mime type found" and i found "AddType video/mp4 .mp4" to add this on .htaccess file (template/js/ckeditor/.htacess) I add in .htaccess file still same problem?? How to resolve this issue..

I'm using Firefox 11 ver. Is it browser compatible issue....

What should i have to do....?

[alienee2]

Hi

I just wanted to thank you for taking the time to reply to my problem in such a prompt manner.
Thank you so much for responding so quickly. It really helped me.

I installed html5 video for ck as per your instructions. I get video icon in the editor tool bar. And i upload an mp4 video file into my upload folder.... And I clicked on the video button on the editor to enter the URLs to the videos. I uploaded video as well as the poster and save updated... But i got the message "no video with supported format and mime type found" and poster is coming. I Google the issue "no video with supported format and mime type found" and i found "AddType video/mp4 .mp4" to add this on .htaccess file (template/js/ckeditor/.htacess) I add in .htaccess file still same problem?? How to resolve this issue..

I'm using Firefox 11 ver. Is it browser compatible issue....

What should i have to do....?

1.) Add the following to your root htaccess (not the one in templates/js/ckeditor):

Code:

AddType video/webm .webm
AddType video/mp4 .mp4

2.) Make sure you have both mp4 and webm versions uploaded and specified in the ck editor pop up box (firefox does not support html5 for mp4)

clear the browser cache before testing again, or test in a different browser - safari, chrome, IE, etc..

[jrkishore4u]

Thank you alienee2 for replying

i tried as per your instructions i get the video in chrome browser only...

and one more doubt i have the following code:

Code:

<div class="my-col2">

            <div id="text-5" class="widget-area widget_text">

              <h4>Enquiry Form</h4>

              <div class="textwidget">

                <div class="wpcf7" id="wpcf7-f1-w1-o1">
                
                    <form id="jform" name="jform" action="enquiryform.php" method="post" class="wpcf7-form" >

                    <div style="display: none;">

                      <input name="_wpcf7" value="1" type="hidden">

                      <input name="_wpcf7_version" value="2.4.3" type="hidden">

                      <input name="_wpcf7_unit_tag" value="wpcf7-f1-w1-o1" type="hidden">

                    </div>

                    <div class="fleft">

                      <p class="field"><span class="wpcf7-form-control-wrap text-467">

                        <input name="name" id="name" value="First & Last Name:" class="" size="40" title="First & Last Name:" type="text" onFocus="if(this.value=='First & Last Name:'){this.value=''}" onBlur="if(this.value==''){this.value='First & Last Name:'}">

                        </span></p>

                      <p class="field"><span class="wpcf7-form-control-wrap text-467">

                        <input name="phoneno" id="phoneno" value="Phone No:" class="wpcf7-text wpcf7-validates-as-required wpcf7-use-title-as-watermark watermark" size="40" title="Phone No:" type="text" onFocus="if(this.value=='Phone No:'){this.value=''}" onBlur="if(this.value==''){this.value='Phone No:'}">

                        </span></p>

                      <p class="field"><span class="wpcf7-form-control-wrap text-467">

                        <input name="emailid" id="emailid" value="Email:" class="wpcf7-text wpcf7-validates-as-required wpcf7-use-title-as-watermark watermark" size="40" title="Email:" type="text" onFocus="if(this.value=='Email:'){this.value=''}" onBlur="if(this.value==''){this.value='Email:'}">

                        </span></p>

                      <p class="field"><span class="wpcf7-form-control-wrap text-258">

                        <input name="businessname" id="businessname" value="Business Name:" class="wpcf7-text wpcf7-validates-as-required wpcf7-use-title-as-watermark watermark" size="40" title="Business Name:" type="text" onFocus="if(this.value=='Business Name:'){this.value=''}" onBlur="if(this.value==''){this.value='Business Name:'}">

                        </span></p>

                    </div>

                    <div class="fleft marg-left">

                      <p class="field"><span class="wpcf7-form-control-wrap textarea-606">

                        <textarea name="comments" id="comments" class="wpcf7-use-title-as-watermark watermark" cols="40" rows="10"  onfocus="if(this.value=='Comments:'){this.value=''}" onBlur="if(this.value==''){this.value='Comments:'}"">Comments:</textarea>

                        </span></p>

                      <p class="submit-wrap">

                        <input value="Send" id="send" class="wpcf7-submit" type="submit"></p>

                      <p class="submit-wrap">

                        <input value="Reset" class="wpcf7-submit" type="reset">

                      </p>

                    </div>

                    <img class="ajax-loader" style="visibility: hidden;" alt="Sending ..." src="images/ajax-loader.gif">

                    </p>

                    <div class="wpcf7-response-output wpcf7-display-none"></div>

                  </form>

                </div>

              </div>

            </div>

            </div>

          </div>

        </div>

      </div>

    </div>

Before inserting the above code in my new created page (cms) i insert an image, it can be able to edit size..

After inserting the above code in the image page.. image is not going to adjustable or re-size... not only image entire page is not able to edit in "edit page"


what i have to do?

[alienee2]

you should either put all of that code into a component and then call it using DynPages, with a tag; or just use p01 contact, which is a great forms plugin and can handle most contact form needs; you can also match the styling of any template form to p01 contact with some adjustment to the css.

[daverosewebworks]

I followed the steps of installing the html 5 video plug in. The link above did not work so i went straight to the ck editor site and placed the video folder here: admin > template > js > ckeditor > plugins

Then edited my gsconfig.php file like so... the toolbar does not appear at all now

Code:

define('GSEDITORTOOL',"['Source','-','Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo','Find','Replace','-','SelectAll','RemoveFormat'],
    '/',
    ['Bold','Italic','Underline','Strike','-','Subscript','Superscript','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
    ['TextColor','BGColor','-','Rule','PageBreak'],['NumberedList','BulletedList','-','Outdent','Indent'],
    '/',
    ['Blockquote','-','Smiley'],['Link','Unlink'],
    ['Image','Flash','Table','HorizontalRule','SpecialChar'],['youtube'],['Video'],
               '/',
    ['Styles','Format','Font','FontSize']
    ");

Code:

define('GSEDITOROPTIONS', "extraPlugins:'youtube','Video'
    ");

This is where I got the plug in from

http://cksource.com/forums/viewtopic.php?f=18&t=23606