ADP Video plugin demo

January 20, 2010 in ADP WordPress Popup Plugin, Advanced DHTML Popup | Please leave a comment

A demo using the video plugin of ADP in wordpress – see here for instructions (and in the knowledgebase)

Click here to see demo

These instructions apply to the video plugin with example at here
but may also be useful for general iframe’d content
projects where the paths must be set similarly to here.

Note also that as of version 1.04 the interface has
a special section used for transparent player projects but which can also be used here for simplicity.

From version 1.05 all projects will use this method of upload.

  1. It is assumed that you already have an ADP video project working, if not see here or the help file and do this step first. Ensure that the path for the close/resize images (if used) is set in the advanced reference form to “wp-content/plugins/adp-pro/images”.

  2. In addition, change the path of the source of the iframe (src) to match your blog path and project folder (see next point). In the demo
    this is “wp-content/plugins/adp-pro/defaultvideo/default_player_content.html”. So the content in ADP now looks like


    <iframe src="http://www.dpopup.com/blog/wp-content/plugins/adp-pro/defaultvideo/default_player_content.html" name="adpiframe" id="adpiframe" width=100% height=100% align="center" Frameborder="0" Scrolling="no" marginheight="0" marginwidth="0" allowtransparency="true"></iframe>

  3. Create a folder under the “adp-pro” plugins folder and upload all the project files directly into it. The path
    in the example given here is “blog/wp-content/plugins/adp-pro/defaultvideo” and all the ADP project files
    were uploaded into “defaultvideo”.

  4. Choose a free numeric id in the plugin interface using ADP-pro mode and insert the script lines as supplied
    in the compile form of ADP when you compiled your project
    (these lines are also in the preview page generated at the same time) into the large text box at the end (make sure to
    check the check box next to it.

  5. Modify the paths to point to the folder that you created – in this demo these are then like this:


    <script type="text/javascript" src="wp-content/plugins/adp-pro/defaultvideo/WPSdefaultvideo_adplib.js"></script>
    <script type="text/javascript" src="wp-content/plugins/adp-pro/defaultvideo/WPSdefaultvideo.js"></script>

  6. Create a post and follow the instructions in the plugin interface (very simple, just enter e.g. or whatever
    the numeric id of the project is). Publish the post and test.

  7. To make a link triggered video simply enter the link syntax provided by ADP into the body of the post with one small modification:- add in “adpContent(‘ADPAlphaFlash’,htmlstring);” to the syntax. The whole code might then look like this:


    <a style="font-weight: bold; color: #1c5ea2;" onclick="adpContent('ADPAlphaFlash',htmlstring);adpShow('ADPAlphaFlash');return false;" href="#">Click here to see demo</a>

    Where it is assumed that the unique ID of the ADP project is the default “ADPAlphaFlash”.