Bloggers recientes

Yasuyuki Takeo

Staff
2 Mensajes
18 de octubre de 2017

David H Nebinger

63 Mensajes
14 de octubre de 2017

Anderson Perrelli

Staff
1 Mensajes
9 de octubre de 2017

Kyle Joseph Stiemann

Staff
11 Mensajes
6 de octubre de 2017

Petteri Karttunen

Staff
2 Mensajes
5 de octubre de 2017

James Hinkey

Staff
8 Mensajes
5 de octubre de 2017

Sushil Patidar

10 Mensajes
4 de octubre de 2017

Bryan Cheung

Staff
37 Mensajes
4 de octubre de 2017

Olaf Kock

Staff
120 Mensajes
3 de octubre de 2017

Ivan Zaera

Staff
1 Mensajes
2 de octubre de 2017
« Atrás

Embedding a portlet in web content

Company Blogs 8 de diciembre de 2010 Por Barrie Selack

 Many people have asked, "How can I embed a portlet in web content". It's actually quite simple, once you know how. So I'll walk you through it.

It;s done via a runtime-portlet tag. The actual syntax looks like this:

<div id="embedded-welcome-portlet">
  <runtime-portlet name="47" instance="4433" queryString=""/>
</div>

(47 is the Hello World portlet)
 
The divs are not necessary, but in order to style the embeded portlet later we need them there.
 
So here is the Structure for the web content with the three pieces of information to pass to the runtime-portlet tag. (If you want, you can use hard coded values in the template of the web content)
 
 
And the template for the web content..
 
 
The template contains...
 
<p>
This is web content, with an embedded portlet!
</p>
 
<div id="embedded-welcome-portlet-$instance-id.getData()">
   <runtime-portlet name="$portlet-id.getData()" instance="$instance-id.getData()" queryString="$query-string.getData()"/>
</div>
 
Where the values from the template are passed in. We're not using the query string for this example.
 
So when rendered, it looks like this...
 
 
And there we have the Hello World portlet in our web content. But I really don't like that frame and title, so lets use CSS to style it.
 
In the web content use the configuration (little wrench) and select "Look and Feel"
 
Then we'll put the CSS under "Advanced Styling" This will use standard portlet CSS styles to change the look. Below is what gets set. Here's where we use the div id to make sure we only style out portlet.

 

 

Then the rendered web content will look like this.

 

But what if you want to use your own portlet? No problem, just use the name it is given by Liferay. In this case we'll use the Web Form portlet since it's not a Liferay built in portlet.

 

 

And now the web content looks like...

 

If the embedded portlet has a configuration option, you can configure it like any portlet to have different values on every page. You can also use the portlet's own Look and Feel to remove the borders or set a custom title. The WebForm portlet does have it's own configuration options (Hello World does not) Unfortunately at this time, you cannot use it's own configuration Look and Feel to style it, as the Web Content that contains it, overrides it's styling. 

 

Since one of the parameters is an instance-id, you can have multiple embedded instances of the same portlet on the page as below.

And there you are! A portlet embedded in web content.

If you're interested in more leave a comment. Thanks for reading.

 

Respuestas anidadas Autor Fecha
It is a good inception explained: Unraveling... Shepherd Ching 8 de diciembre de 2010 20:10
Ok, so I can put portlet instance in my... Szymon Gołębiewski 9 de diciembre de 2010 3:48
I added a section to the blog to explain this.... Barrie Selack 9 de diciembre de 2010 4:51
Same Web Content can be displayed automaticaly... Szymon Gołębiewski 9 de diciembre de 2010 5:18
Can you give me an example of what you would... Barrie Selack 9 de diciembre de 2010 5:44
For example I have news portal with such... Szymon Gołębiewski 9 de diciembre de 2010 10:44
this is very cool.. .thanks for sharing! Chris Whittle 9 de diciembre de 2010 5:52
Nice article, Barrie! Thanks for sharing Juan Fernández 9 de diciembre de 2010 9:55
very cool article. thanks barrie! Wilson Man 9 de diciembre de 2010 10:00
Thanks for sharing Barry. This is one of the... Mika Koivisto 9 de diciembre de 2010 17:23
Good article and good example how you can use... Sampsa Sohlman 10 de diciembre de 2010 2:12
Hi Barrie, we are using this runtime portlet... Olaf Fricke 15 de diciembre de 2010 12:47
Nice example.... Dhrutika Vyas 15 de diciembre de 2010 21:37
Wonderful example.. I tried this its working... Mohammed Azam 15 de diciembre de 2010 23:13
Hello, can You give a simple example how to... gofri _ 16 de diciembre de 2010 0:46
Like! Scott Lee 18 de enero de 2011 11:09
Hello Everybody! I'm a student come from... ly tm 19 de enero de 2011 19:14
Cool feature, but how do you set portlet... Francesco Marangi 28 de enero de 2011 6:22
I'm have real trouble getting this to work. I'm... Phill Pover 21 de marzo de 2011 7:47
Okay, I fixed the first issue I was having... Phill Pover 21 de marzo de 2011 9:35
A serious question... Can this runtime-portlet... Dave Weitzel 23 de marzo de 2011 6:51
Hi, Thanks for Good Article.But I am not... vasv kumar 19 de julio de 2011 0:05
[...] Take a look at this blog entry Als... Anónimo 26 de julio de 2011 6:54
[...] Hi philip, you are right...you can also... Anónimo 27 de julio de 2011 0:14
What about WSRP: could both the embedding... P F 4 de agosto de 2011 2:10
Hi I was wondering how you would use this to... Mat Gritt 21 de agosto de 2011 17:50
[...] Please check this blog which explains how... Anónimo 10 de septiembre de 2011 8:56
[...] Here's another link that may help... Anónimo 14 de noviembre de 2011 9:57
do anyone say me how i search name and instance... Miguel Ángel González 23 de octubre de 2012 9:13
Hi, All the pictures are gone. Thanks, Akos Ákos Gábriel 17 de diciembre de 2013 7:22

It is a good inception explained: Unraveling the portlet within the dream

http://www.cinemablend.com/new/inception-explained-unraveling-the-dream-wit­hin-the-dream-19615.html
Publicado el día 8/12/10 20:10.
Ok, so I can put portlet instance in my webcontent. Does it mean that on every page that web content is displayed that portlet will have the same configuration? An when I change this portlet config will it change on all sites? As I recall I can have many pages with same portlet instance (for example by using Page Templates) but their configuration is separated for every page
Publicado el día 9/12/10 3:48.
I added a section to the blog to explain this. If the embedded portlet has a configuration option, you can configure it like any portlet to have different values on every page. Thanks for your question.
Publicado el día 9/12/10 4:51 en respuesta a Szymon Gołębiewski.
Same Web Content can be displayed automaticaly on different pages of Portal. In such case you will have to configure you portlet on multiply pages. In websites as big as news portals you want have time to do that. Is there any way to prepare global configuration for portlet instance?
Publicado el día 9/12/10 5:18 en respuesta a Barrie Selack.
Can you give me an example of what you would you are trying to do?
Publicado el día 9/12/10 5:44 en respuesta a Szymon Gołębiewski.
this is very cool.. .thanks for sharing!
Publicado el día 9/12/10 5:52.
Nice article, Barrie! Thanks for sharing
Publicado el día 9/12/10 9:55.
very cool article. thanks barrie!
Publicado el día 9/12/10 10:00.
For example I have news portal with such sitemap:
- home page
-- Sport
---- football
---- tennis
-- Moto
---- Cars
---- Vans

In news portals same web content is displayed in various places. In this case My article will be shown on pages like Cars, Moto and Home Page (beacuse it's about Batmans new batmobile). Now I want to show under that article a lists of other articles related to this one by tags. So I embedded Asset Publisher and configure it (using Cars page) to show "Web contents containing any tag: batmobile, car".

The problem is I want to define this configuration just once and for every place this article will be shown at (home page and Moto). Is there any way to do that?
Publicado el día 9/12/10 10:44 en respuesta a Barrie Selack.
Thanks for sharing Barry. This is one of the cool features that got me started using Liferay back in version 3.x.
Publicado el día 9/12/10 17:23.
Good article and good example how you can use web content.

Adding portlet to wcm template was new for me - anyway with same principles, it is possible to integrate iframe, flash .. youtube.. etc. to Liferay also. This is just by clever using of Web content as configuration repository (which already have editor also).

Btw, how this effect on Liferay and page caching, mainly to cache filter, which does not recognize if the page has embedded portlets on resources (like theme)?
Publicado el día 10/12/10 2:12.
Hi Barrie, we are using this runtime portlet tag since two years in our web sites as well. In most cases, it is just working fine.

But we encountered some limitations you should be aware of:
1. The tag can only be used in templates; raw HTLM articles just ignore it.
2. The portlets that are included via the runtime portlet tag are not considered when exporting a community into a lar file, doing staging or remote publishing.
3. If you include a web content portlet, it will not be found by a community search, because the entry in the JournalArticleSearchEntry table is missing.
4. You must not include a web content portlet into itself (i.e. use the instance id of the web content portlet that contains the runtine portlet tag as value). If you do so, you will end up with a stack overflow due to infinite recursion.

Best regards,
Olaf
Publicado el día 15/12/10 12:47.
Publicado el día 15/12/10 21:37 en respuesta a Olaf Fricke.
Wonderful example.. I tried this its working .But My question is is that possible to show the embedded portlet only to the user who has logged in
Publicado el día 15/12/10 23:13.
Hello,
can You give a simple example how to embed (core) portlet in another portlet (in view.jsp)? Which libs and tld will be needed?
Publicado el día 16/12/10 0:46.
Publicado el día 18/01/11 11:09.
Hello Everybody!
I'm a student come from VietNam!
I'm studying about Richface framework!
I had got a problem in JSF(Richface) Portlet when I used JavaScript!
That problem is : I could not get a value into a <h:inputText /> with JavaScript!
Can anybody help me?
Thank you very much!

This is my code:

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">

<f:view>
<script type="text/javascript">
function check() {
var result = document.getElementById("myform:form").value;
alert(result);
}
</script>

<h:form id="myform">

<h3>Hello :</h3>

<h:inputText value="" id="form" />

<h:commandButton value="OK" onclick="check();"/>

</h:form>

</f:view>

</ui:composition>
Publicado el día 19/01/11 19:14 en respuesta a Scott Lee.
Cool feature, but how do you set portlet preferences? I saw the runtime-portlet tag has a defaultPreferences attribute... how would you pass preferences in a VM journal article template?
Publicado el día 28/01/11 6:22.
I'm have real trouble getting this to work. I'm running this from a development system, so the potential for a permissions issue is there, but even copying the Hello World example code above is not letting me put the portlet into my template.

What am I missing here? The portlet-runtime tag is coming through, but it doesn't appear to be getting parsed into an actual portlet.
Publicado el día 21/03/11 7:47.
Okay, I fixed the first issue I was having (this ONLY works through the web content portlet, not asset manager or any of the others), but now I'm having an issue with the queryString parameter. I'm trying to invoke the webProxy portlet in a template and set the url of the page that the portlet is proxying, but no matter how I format the queryString, this is not working.

<runtime-portlet name="66" instance="1284" queryString="initUrl=http://somewebaddress.com"/>

Please help.
Publicado el día 21/03/11 9:35 en respuesta a Phill Pover.
A serious question...

Can this runtime-portlet tag be used in all other portlets (eg document and image "properties" or blogs and wiki)? I alos think it needs a bit more information - or a link to another blog/wiki article about the query string and other parameters that can be passed to the runtime-portlet tag.

You will see form my forum postings I have been trying to add a pagelet from a new portlet (handling Dublin Core categorization items) into a lot of other portlets but no one even suggested this tag. I would need to pass the current groupId and object Id (blog post etc) to make it work.
Publicado el día 23/03/11 6:51.
Hi,
Thanks for Good Article.But I am not getting my custom portlets.I am getting Default portlets.
Publicado el día 19/07/11 0:05 en respuesta a Dave Weitzel.
[...] Take a look at this blog entry Als Antwort markieren [...] Read More
Publicado el día 26/07/11 6:54.
[...] Hi philip, you are right...you can also customize that if you are embedding OOTB portlets for not showing icons and borders, Refer this link,... [...] Read More
Publicado el día 27/07/11 0:14.
What about WSRP: could both the embedding portlet and the embedded portlet be WSRP portlets?
Thanks.
Publicado el día 4/08/11 2:10.
Hi I was wondering how you would use this to insert a webform portlet in to the theme. specifically portal_normal.vm.

any help gratefully received
Publicado el día 21/08/11 17:50 en respuesta a Veronym Kroun.
[...] Please check this blog which explains how we can add or link a portlet from the Web Content . ~Kamesh Mark as an Answer [...] Read More
Publicado el día 10/09/11 8:56.
[...] Here's another link that may help http://www.liferay.com/web/barrie.selack/blog/-/blogs/embedding-a-portlet-in-web­-content You can embed one web content within another... Flag Please sign in to flag... [...] Read More
Publicado el día 14/11/11 9:57.
do anyone say me how i search name and instance of my runtime-portlet?

thanks you in advance
Publicado el día 23/10/12 9:13 en respuesta a .
Hi,

All the pictures are gone.

Thanks,
Akos
Publicado el día 17/12/13 7:22.