Live Wrapper Module

Root Folder > DNN (DotNetNuke) > DNN Common Modules > Live Wrapper
 The 'Live Wrapper' allows the user to wrap and create flexible layouts:
  • Audio – Upload your own MP3’s or link to existing one on the web.  User has the ability to show album art, specify height and width of audio player.
  • Content - User may wrap any text/html module within content itself and wrapping content within content.
  • Flash – Show flash applications, games, banners, and more.  Upload your own SWF file or link to an existing one and specify height and width for rendered flash content.
  • Frame – Allows wrapping existing websites or content by simply providing the URL and the ability to specify the height and width of the frame.
  • Modules – Allows wrapping any module and automatically hides the module on the same page.
  • Snippet – Allows wrapping any piece of code, embedding tags from sites, and user can also wrap javascript.
  • Video – User can upload videos or link to YouTube videos by providing the URL.  Wrapper has the ability to show album art and specify height and width of the video.




  • Add the 'Live Wrapper' from the module drop-down menu
  • Click 'Manage Content'


NOTE:
  Whether wrapping audio, content, flash, frame, module, snippet, or video, click on the appropriate tab at the bottom and then the + to add the content.  Using the [Tag Name] inserts media from wrapper within the Text/HTML area.




The following pages will show each tab and how to use the [Tag Name] to insert content in the wrapper.
  • Audio
  • Content
  • Flash
  • Frame
  • Module
  • Snippet
  • Video

Audio
Tab - Upload your onw MP3's or link to existing one on the web.  User has the ability to show album art, specify height and width of audio player.

Click the Audio Tab and the + to add audio (see previous screenshot)



Select Audio Source:  Internet URL or MP3 file (user created do not forget copyright laws)
  • Selected 'Internet URL'
  • Copy & Paste URL in the Audio URL space (must be a valid URL)
  • Add Name
  • Optional to change width & height
  • Add Tag Name (this is what is needed in order to wrap content)
  • Click Add
  • Go to the top Text/HTML box type information and [tag line] in correct location
  • Click 'Update'
  • Click 'Return' to see web page

View on the web page


Select Audio Source:  Internet URL or MP3 file (user created do not forget copyright laws)
  • Selected 'MP3'
  • Select File
  • Click Upload New File
  • Browse computer to find MP3
  • Click Upload
  • Optional to change width & height  and to add a preview URL image
  • Add Tag Name (this is what is needed in order to wrap content)
  • Click Add


Content
Tab Example - User may wrap any text/html module within content itself and wrapping content within content



Content Tab View on web page:



Flash Tab - Show flash applications, games, banners, and more.  Upload your own SWF file or link to an existing one and specify height and width for rendered flash content.

Select either Flash URL, or your own SWF file to display in the wrapper.  Name the flash and add a Tag Name.  Again, Tag Name will be placed within brackets as in previous screen-shots in the Text/HTML area.



Frame Tab - Allows wrapping existing websites or content by simply providing the URL and the ability to specify the height and width of the frame.

Below the OPS website has been added with Tag Name of OPS.  In the Text/HTML box [OPS] is used to wrap the website.

Frame Tab Example:



Frame Tab View on Web Page:



Module Tab - Allows wrapping any module and automatically hides the module on the same page
  • Select the Page from which the module will be obtained
  • Select the Module/Modules
  • Add a Tag name
  • Optional Start/End Date, Permissions, Show Module Container
  • Click Add
  • Add [Tag Name] in the Text/HTML area
  • Click Update
  • Click Return


Snippet Tab - Allows wrapping any piece of code, embedding tags from sites, and user can slo wrap java script
  • Place the code, embedded tag, or java script in the Content area
  • Add the Name
  • Add Tag Name
  • Click Add
  • Add [Tag Name] in the Text/HTML area
  • Click Update
  • Click Return


Video Tab - User can upload videos or link to YouTube videos by providing the URL.  Wrapper has the ability to show album art and specify height and width of the video.
  • Select Video Source
  • Add URL, or upload video
  • Optional Preview URL (album art)
  • Add Name
  • Add Width, Height
  • Add Tag Name
  • Add [Tag Name] in the Text/HTML area
  • Click Update
  • Click Return