Google Embedded Document Viewer in Liferay Portlet
Objective: To show documents in liferay portlet
Download Liferay Document
Viewer portlet from following location
You can find source
and war file
Note: Portlet developed in Liferay 6.1GA2 EE
version
If you want deploy
in CE version you just do changes in liferay-plugin-package.properties
Liferay 6.1 EE version
name= LiferayDocumentViewr
module-group-id=liferay-ee
module-incremental-version=1
tags=
short-description=
change-log=
page-url=http://www.liferay.com
author=Liferay, Inc.
licenses=EE
liferay-versions=6.1.20
|
Liferay 6.1 CE version
name = LiferayDocumentViewr
module-group-id=liferay
module-incremental-version=1
tags=
short-description=
change-log=
page-url=http://www.liferay.com
author=Liferay, Inc.
licenses=LGPL
liferay-versions=6.1.1
|
Google provides document viewer so that we can display liferay documents
in Google document viewer.
This viewer can display PDF and MS Documents (doc, docx, ppt, xsl, xslx) without
any configurations.
It’s simple URL request we need to pass document source to the URL so that
we can view the document.
In life ray we store our documents in Document
Media Library portlet .
So each document have unique web
URL to access document so that we can pass this URL to Google document viewer
from that can view document in portlet. This
document is visible in iframe in portlet.
Generally in liferay its bit tricky to view MS Documents to view MS
Documents in liferay we have to do some
configuration then only we can view documents .
Liferay 6.1x have this configurations but before 6.1x we can view only PDF
documents.
So Google document viewer can give best and easy way to view document in
portlet. Here only one thing is its iframe.
Before Liferay 6.1x also we can
see documents by following way.
Already we have option in liferay can see PDF documents.
Here we can covert DOC to PDF so that we can view documents but for this
we need to do some programming.
To convert DOC to PDF we have JOD converter from this converter we can
convert DOC to PDF. This is all for before 6.1x version.
From 6.1x we can view PDF and MS Documents but we have to configure open
office .
This all about view documents in liferay.
But Google Document viewer not worries about anything it’s just URL
request and we can view in iframe.
Request URL for Google
document viewer
http://docs.google.com/gview?url=http://www.ezconf.net/docs/SOLI%202008/sample.doc&embedded=true
|
Request Parameters:
url: it is source of document
embedded: this is value is true.
The following is Sample code for to Google Document viewer in IFrame
<iframe frameborder="0"
border="0"
scrolling="no"
src="http://docs.google.com/gview?url=http://www.ezconf.net/docs/SOLI%202008/sample.doc&embedded=true"
style="width:800px;
height:800px;"
frameborder="0"
id="iframe">
</iframe>
|
Important Attributes:
src: this is URL request to
get Google document viewer.
height: height of iframe
width: width if iframe
Complete example for liferay
portlet:
<%@page import="com.liferay.portal.kernel.util.ParamUtil"%>
<%@page import="java.util.List"%>
<%@page import="java.util.ArrayList"%>
<%@ taglib uri="http://liferay.com/tld/aui"
prefix="aui" %>
<%@ taglib uri="http://liferay.com/tld/portlet"
prefix="liferay-portlet" %>
<%@ taglib uri="http://liferay.com/tld/theme"
prefix="liferay-theme" %>
<%@ taglib uri="http://liferay.com/tld/ui"
prefix="liferay-ui" %>
<%@ taglib uri="http://liferay.com/tld/util"
prefix="liferay-util" %>
<%@ taglib uri="http://java.sun.com/portlet_2_0"
prefix="portlet" %>
<portlet:defineObjects />
<liferay-theme:defineObjects />
<%
List<String> urlList=new
ArrayList<String>();
urlList.add("http://docs.liferay.com/portal/6.0/official/liferay-developer-guide-6.0.pdf");
urlList.add("http://www.ezconf.net/docs/SOLI%202008/sample.doc");
urlList.add("http://docs.liferay.com/portal/6.0/official/liferay-developer-guide-6.0.pdf");
String
documentUrl=ParamUtil.getString(renderRequest,"docUrl");
%>
<style>
#documentViewrTable{
vertical-align: top;
}
#documentViewrTable td {
padding-left:10px;
vertical-align: top;
padding-right: 25px;
font-family: "Helvetica
Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: bold;
}
</style>
<table id="documentViewrTable">
<tr> <td>
<%for(String
url:urlList){ %>
<portlet:renderURL var="documentRenderURL">
<portlet:param
name="docUrl" value="<%=url%>"/>
</portlet:renderURL>
<a
href="<%=documentRenderURL%>"><div class="documentURL"
>Document1</div></a> <%}
%>
</td> <td>
<%if(documentUrl!=null&&!documentUrl.isEmpty()){
%>
<iframe
frameborder="0" border="0" scrolling="no"
src="http://docs.google.com/gview?url=<%=documentUrl%>&embedded=true"
style="width:800px; height:800px;"
frameborder="0" id="iframe">
</iframe>
<%}%>
</td>
</tr>
</table>
|
Reference Links
Author:
Meera Prince
I understand that documents must be publicly accesible?
ReplyDeleteYes...
ReplyDeleteYes...
ReplyDeleteI feel very grateful that I read this. It is very helpful and very informative and I really learned a lot from it. narrowband-iot
ReplyDelete