Publishing Flash (SWF) in a flexible way using the Liferay CMS

Many people ask how to build portlets which display Flash (SWF) content in the portal with options for changing and controlling that content.

Well, you don't have to build a portlet to handle this. I mean, you can... but you don't have too. Liferay provides all the tools you need to do this right out of the CMS and you can give yourself as much control as you like while still making it simple for non-techincal people...

- First, make sure that the Document Library portlet is configured to allow SWF files (should by default in recent versions).

in portal(-ext).properties:

dl.file.extensions=...,.swf,...

- Upload a file.

- Next, in the Journal portlet, create a Journal Structure with the following basic schema (add more params as you see fit).

Journal Structure:
<root>
  <dynamic-element name='swf-file' type='document_library'></dynamic-element>
  <dynamic-element name='width' type='text'></dynamic-element>
  <dynamic-element name='height' type='text'></dynamic-element>
</root>

- Create a Journal Template which will process the values defined in the Structure.

Journal Template (Velocity - VM):
<object width="${width.getData()}" height="${height.getData()}">
  <param name="movie" value="http://@portal_url@${swf-file.getData()}"></param>
  <param name="wmode" value="transparent"></param>
  <embed src="http://@portal_url@${swf-file.getData()}"  type="application/x-shockwave-flash" wmode="transparent" width="${width.getData()}" height="${height.getData()}"></embed>
</object>

Associate this template with the structure above.

Now create articles which use the above structure and you'll have a file selection dialog available to select a file from Document Library (select your file). Set the desired height, width, "Save", "Approve".

Now all you need to do is add a Journal Content portlet to any page and then select the Article you just created.

The beauty is now that changing the swf is as easy as uploading a new file, and then editting the article and choosing the new file.

Hope that helps!

[Ed Shin]

Thanks, my client needed this info!

[delang j]

hi ray,
what about flv file? can i do the same way.

[Glen K Brown]

Thanks for the info. I have been trying this for some time now and it appears that I need to encode the DL uri or it won't play. Any ideas on how to do that without a rebuild of LR? As well any velocity lines in this, preceding the <object> tag seems to break it.

thanks

[delang j]

why when i tried on LR511, nothing happen. it said movie not loaded.

[Adam T]

This worked great for us, thanks!

[Justin CCT]

I have been using the method as described above to insert flash content in my Liferay site.

Do you have any idea how Flash load the xml files in Liferay? I have my flash and xml files uploaded to the same directory in document library. However, flash doesn't load it's xml file with relative path.

[Tim Lewis]

Hi Ray,
Perhaps you could comment on this: I am finding that I have some Camtasia-generated content that consists of an SWF file *and* and MP4 file. How does one server this kind of Video content using the Document Library?

[Smile85 Always]

Ray,

Thanks post is simple to follow. But I am not able to display the swf file. I tried earlier to embedd the swf, bu it was not getting deployed and then I tried this still not working for me.
When I double click the swf file it is working jsut perfect Please help nas I am stuck as I cant even load a simple swf file with a label in it

any thoughs

[Ray Augé]

The issues likely lies in the urls used to setup the <object> tags. Make sure your resources are available at the url you are using the reference them.

Are you doing in in Web Content? Where are the swf files housed?

[Smile85 Always]

Ray,

Initially I maed a portlet and I put swf file under docroot and did an embed with hardcoding the loation in src. It didnot work.
Then I found your blog and I copied the swf to document library and created structure and template and accessed the swf from the DLF. But in vain. Is there any steps missing

Thanks

[Smile85 Always]

It is taking a lot of time to select the swf file form DLF. Now when I am checking the log file, I am getting the following error,
17:20:17,572 INFO [PortalImpl:3489] Current URL /c/document_library/get_file?uuid=4667807c-1904-45fd-909b-12738223
670a&groupId=18 generates exception: null
17:20:17,645 WARN [PortalImpl:3495] com.liferay.portal.security.auth.PrincipalException
com.liferay.portal.security.auth.PrincipalException
at com.liferay.portlet.documentlibrary.service.permission.DLFileEntryPermission.check(DLFileEntryPermission
.java:42)
at com.liferay.portlet.documentlibrary.action.GetFileAction.getFile(GetFileAction.java:165)
at com.liferay.portlet.documentlibrary.action.GetFileAction.strutsExecute(GetFileAction.java:83)
at com.liferay.portal.struts.PortletAction.execute(PortletAction.java:102)
at org.apache.struts.action.RequestProcessor.processActionPerform(RequestProcessor.java:431)

[Ray Augé]

The exception should be clear you that the file doesn't allow unauthenticated access. You need to make sure that the file, and all it's parent folders allow Guest to VIEW.

[Smile85 Always]

http://www.liferay.com/community/forums/-/message_boards/message/7677345?_19_preview=false

[Ray Augé]

Sorry for the very later reply.

Really the only difficulty lies in constructing the <object> reference. As for support for actual streaming of media resources like mp4, we don't quite support that yet. But if they are not too large, it shouldn't be overly bad to serve them directly from their doclib url.

[Keith Allen]

I followed the above three steps namely

STEP 1 :dl.file.extensions=...,.swf,...

- Upload a file.

- Next, in the Journal portlet, create a Journal Structure with the following basic schema (add more params as you see fit).

STEP 2: Journal Structure:
<root>
<dynamic-element name='swf-file' type='document_library'></dynamic-element>
<dynamic-element name='width' type='text'></dynamic-element>
<dynamic-element name='height' type='text'></dynamic-element>
</root>

STEP 3:- Create a Journal Template which will process the values defined in the Structure.

Journal Template (Velocity - VM):
<object width="${width.getData()}" height="${height.getData()}">
<param name="movie" value="http://@portal_url@${swf-file.getData()}"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://@portal_url@${swf-file.getData()}" type="application/x-shockwave-flash" wmode="transparent" width="${width.getData()}" height="${height.getData()}"></embed>
</object>

However I just see a blank page when try to see the web content.

I have uploaded an MP4 video.

Will my STEP-2 and STEP-3 code change? If YES, what would be those changes?

thanks a lot.

[Jignesh Vachhani]

Hi ,

I am trying this code with liferay 5.2.1 and unfortunately it's not working with this version.
Do you have any alternative solutions ?

[Gabriel Leon Leyva]

II Also have a blank page with mp4 following the above steps, any advance..? thanks