what is the easiest way to filter articles in liferay theme - liferay

Excuse me if I'm asking silly or easy question, but I just can't figure it out.
So, I have a theme, I want to render only portlets, skipping any journal articles.
Which is the most appropriate way to do it?

In your theme's resources, there is a portlet.vm template available in the _diffs/template directory. This template allows you to override the default presentation of portlets in general (e.g. change the configuration icons, remove the title bar, ...).
However, inside portlet.vm Liferay injects a predefined variable called $portletDisplay. This is an instance of the com.liferay.portal.theme.PortletDisplay class and represents the portlet that is currently printed.
You can use the $portletDisplay.portletName attribute to check for 56, which is the ID for all Web Content Display portlets. So, in short, encapsulate the parent <div> inside portlet.vm with the following condition:
#if($portletDisplay.portletName == '56')
<div class="portlet" ...>
...
</div>
#end

Related

Liferay 7.3: How to preconfigure a portlet embedded in a page fragment?

We're using Liferay 7.3 (CE) and are trying to embrace the relatively new feature of "Content Pages" with "Page Fragments". We're able to develop page fragments that already include portlets (named "widgets" in the context of content pages), using the <lfr-widget-WIDGETALIAS> tag. So far, that works.
Now we're trying to prepare page fragments that embed portlets with special portlet configuration applied. For example, we want to prepare a page fragment that just shows an asset publisher portlet configured to list WebContent articles from a pre-defined category. The user should be able to just put that fragment onto the page without having to care about the configuration of the asset publisher portlet.
We did not find any direct way to achieve that -- our first guess that the configuration could be written as attributes or content of the <lfr-widget-...> tag was deterred by a hint in the liferay docs that there are no valid attributes or content to attach to that tag.
Does anybody have an inkling of an idea on how to achieve embedding portlets in page fragments with pre-defined portlet configuration applied? (including out-of-the-box Liferay portlets?)
I figured it out myself.
That one thing that the Fragment Editor does not tell you is that the HTML part of a fragment actually is interpreted as a Freemarker template, with the caveat that only Freemarkers alternative syntax is allowed.
That, in turn, means that Liferays taglibs are available, which means we can use the tag <liferay-portlet:runtime> (ported to freemarker alternative syntax, of course), which does accept a defaultPreferences attribute. Now we can just configure the portlet once, find its portletPreferences XML data in the DB (see table PortletPreferences), remove values we do not want to preconfigure and then just use the resulting preferences XML as a value for the defaultPreferences attribute of the <liferay-portlet:runtime> tag.
Care has to be taken for any IDs (e.g. if you want to preconfigure an AssetCategory filter). Better fetch the corresponding object from the corresponding service and get the ID from that object.
This example provides the HTML part for a page fragment that places an AssetPublisher onto the page, preconfigured to show 12 items (instead of the default 20). (CSS, JS and Configuration of the fragment is the default as given by the Page Fragment editor.)
<div class="fragment-12345">
[#assign assetPublisherPortletPreferences="<portlet-preferences>
<preference>
<name>delta</name>
<value>12</value>
</preference>
</portlet-preferences>" /]
[#liferay_portlet["runtime"]
instanceId="${fragmentEntryLinkNamespace}assets"
portletName="com_liferay_asset_publisher_web_portlet_AssetPublisherPortlet"
defaultPreferences="${assetPublisherPortletPreferences}"
/]
</div>
Thank you for this, #orithena. You saved me a lot of trouble.
Another option, to achieve the same result but with simpler syntax, is to use the built-in freeMarkerPortletPreferences:
[#assign assetPublisherPortletPreferences=freeMarkerPortletPreferences.getPreferences({
"delta": "12",
} /]

Footer in Liferay

I need to make a footer in Liferay and use theme for it. What's the simpliest way to do it?
I have created new theme, filled _diffs folder with other folders, but it's empty and I couldn't find relevant docs about this. Should I copy all basic files there? What should I change to create footer?
In Liferay, theme's portal_normal.vm serves as the template to
construct HTML structure of the page. There you define your header,
body and footer includes.
When you will look at the portal_normal.vm of classic theme, you will observe following HTML snippet:
<footer id="footer" role="contentinfo">
<p class="powered-by">
#language ("powered-by")
Liferay
</p>
</footer>
This is the footer of the page. This is what you need to implement. However, it's not necessary to use footer tag at all, as you can simply use div or table based structure with bootstrap or customized CSS classes for your footer, it's upto your requirement.
Remember! Classic theme is just like a sample provided by Liferay, so, it's not good idea to directly customize it.
Everybody needs a whole customized view of the site, and for this the best idea is to create a custom theme (that's what you are doing!), that will give you full control over your look-n-feel.
To kick-start, you can initially copy required folders from classic theme to your customized theme's (_diffs folder) and start changing bit by bit.

Conflicts between Custom theme CSS and Liferay CSS

I am trying to customize the Liferay UI by using custom theme using base as as "_Styled" theme.
I have my own css files which I coped to _diff/css folder of theme and imported them "custom.css" file .However its breaking the presentation of liferay.In my custom CSS I have styles defined for all the standard tags like body,div etc which is impacting the liferay UI too.
How can I resolve this conflict? Thanks in advance!
Quick (and not the best) solution is to remove contents of liferays css file (for example "base.css") and save this empty file in /diff/css/ folder of your theme. This way the base.css will get overriden with your new empty file and thus no styles will get loaded. And your custom.css will be the only stylesheet that is taken into account.
Well, of course it all has an effect on the rest of Liferay as well. Liferay provides quite a bit of the HTML DOM of your page, and if you change the presentation of all of those elements, you'll have to take care to style Liferay's elements too.
Is this a conflict? No. Let's go for the simplest case: You declare div {color:green;}. Of course, now everything, your components as well as Liferay's components, use green text. If you only want to style your own portlets, you might want to specify some portlets: div.portlet-my-own-application {color:green;}
I know that color is a too simple usecase, but I hope it illustrates the solution strategy.
Rather than following Artem Khojoyan's suggestion to override Liferay's base.css, I'd recommend to take a look at the resulting css, what's effective etc., and simplify your own css - adapt it to be used within Liferay - by inspecting the effective CSS for every elements that looks off. Firebug or any of it's relatives are your friend.
I'm afraid, with the details "I'm doing something which has an effect on Liferay UI" there's nothing much more to help you. In fact, I'd hope that what you do has an effect on Liferay's UI... You'll just need to find the proper CSS code
Ideally if your styles are loaded from custom.css, then will overwrite liferay default styles.
In some cases, to overwrite a style in css, you can use !important
for example, liferay default style
body {
background-color: #fff
}
You can specify your style to consider irrespective of order of loading
body {
background-color: red !important;
}

rendering Liferay page URLs inside of portlets Liferay 6.1

I'm new to liferay and I'm almost positive this is blazingly simple to do: Using velocity markup, I want to be able to generate links to pages within my Liferay website and embed them inside of my portlets on different pages.
I have a vague idea of how it might be done so I searched around figuring it would be posted somewhere, but I can't find anything on it. Incidentally, I want to put whatever code I come up with inside the view.jsp of the portlet. I would use velocity markup here but I don't think (don't know for sure) if that is allowed inside of a jsp.
Please let me know if you need more information to respond.
I would use velocity markup here but I don't think (don't know for sure) if that is allowed inside of a jsp.
Why would you want to use Velocity mark-up inside a JSP (view.jsp)? I don't see any advantages in doing that apart from the argument that you are really great at velocity.
Though here is a link that would help you embed velocity inside of JSP.
Note: In my opinion it is not a good practice to embed velocity within JSP in a portlet
In JSP:
You will need a Layout object which you can get with the help of static methods in LayoutLocalServiceUtil.
After you get the Layouts, you can use the static methods of com.liferay.portal.util.PortalUtil like getLayoutFriendlyURL or getLayoutFullURL etc to build the URL.
In VM (these would be *.vm files in themes):
You can follow all the same steps as mentioned in JSP. The things you would need to do that are:
Instance of LayoutLocalService, can be found out by using the following code (taken from this answer):
#set($layoutLocalService = $serviceLocator.findService("com.liferay.portal.service.LayoutLocalService"))
now you can use the velocity variable $layoutLocalService to make calls to service methods for getting the layouts.
Then you can call methods of PortalUtil class by using the variable $portalUtil available for *.vm files in themes.
You can check-out the following files for more details (if you are interested):
docroot/html/themes/_unstyled/templates/init.vm, this contains all the velocity variables available in themes. Variables of interest might be $theme, $theme_display, $layout, $navItems.
docroot/html/themes/_unstyled/templates/portlet.vm, this file is a template to display the individual portlets.
docroot/html/themes/_unstyled/templates/navigation.vm, contains code for displaying the navigation menu with page links.
docroot/html/themes/_unstyled/templates/portal_normal.vm, this file represents a page-template in liferay and this contains the other files like navigation.vm & portlet.vm.
For Velocity:
Okay so for generating the links for Liferay pages in velocity take a look at the following file in the Liferay source code:
/portal-web/docroot/html/themes/_unstyled/templates/navigation.vm
In there you'll see how the default Liferay theme generates the navigation structure for your site. To make life easier for you here it is:
<nav class="$nav_css_class" id="navigation">
<h1>
<span>#language("navigation")</span>
</h1>
<ul>
#foreach ($nav_item in $nav_items)
#if ($nav_item.isSelected())
<li class="selected">
#else
<li>
#end
<a href="$nav_item.getURL()" $nav_item.getTarget()><span>$nav_item.icon() $nav_item.getName()</span></a>
#if ($nav_item.hasChildren())
<ul class="child-menu">
#foreach ($nav_child in $nav_item.getChildren())
#if ($nav_child.isSelected())
<li class="selected">
#else
<li>
#end
<a href="$nav_child.getURL()" $nav_child.getTarget()>$nav_child.getName()</a>
</li>
#end
</ul>
#end
</li>
#end
</ul>
So the Velocity is looking through a collection called $nav_items, and then calls the getURL() method on each item to generate the link.
For JSP:
You'll need to make use of the LayoutLocalServiceUtil class, and in
particular one of the getLayouts() methods.You'll have to pick the one that best suits your need.
This will return the list of Layouts (your pages), and then you can
call getFriendlyURL() on each of these layouts to return it's url
This will be a relative url to your site, so something like
/my-site-home-page.
Let me know if you have any more questions!

how to hide Showing result text in liferay Search Container?

I am using liferay search container to display list of information, but in that liferay search container by default display number of records like "Showing 2 results". But in my case i don't want to display this. How can I remove this? Also attached the image of search container.
Suggestions are welcome.
You can do this with Javascript as suggested by Felix Christy:
Here are the quick steps :
Go to "Manage Page" section of the desired page (page on which you
dont want to show this text)
Go to javascript section add the following, its Alloy UI javascript framework which comes bundled with liferay:
AUI().ready(
function(customA) {
customA.all('.taglib-page-iterator').hide(); // this would hide **all** the elements which have the class "taglib-page-iterator"
}
);
The above javascript code can be included in the custom portlet's JSP itself (note the method and selector which I have changed), like:
<aui:script>
AUI().ready(
function(customA) {
customA.one('#my-portletID .taglib-page-iterator').hide(); // this would hide only **one** element (the first it finds) which has the css class "taglib-page-iterator" under an element with id="my-portletID".
}
);
</aui:script>
Another possible solution through Hook:
You can create a hook as mentioned by Sandeep Nair to hide the results-text but you can put a condition to check to hide only if the URL of the page is for which you want to hide this or can have a condition to check for the particular portlet you want to hide this result-text.
So it will work normally for other pages and portlet, but will hide for your page and certain portlets which you define. This is an idea and have not tried it yet, but I think it would work. You can use the themeDisplay object which is available on JSP pages to retrieve the portlet-id.
Hope this helps.
Thanks to Felix Christy for suggesting the solution through Javascript.
I thought of converting my comments to an answer for better visibility to other members of this wonderful community.
It is because you are using page-iterator in your search container. When the records exceeds the default delta the message above will be replaced by showing-x-of-y-results alongside page numbers and controls for navigating to next pages.
If you dont want this then you have to modify the jsp page using hook. The name of the jsp is showing_x_results.jspf and following snippet is what you are looking for to modify in that.
<c:otherwise>
<c:choose>
<c:when test="<%= total != 1 %>">
<%= LanguageUtil.format(pageContext, "showing-x-results", numberFormat.format(total)) %>
</c:when>
<c:otherwise>
<%= LanguageUtil.format(pageContext, "showing-x-result", numberFormat.format(total)) %>
</c:otherwise>
</c:choose>
</c:otherwise>
In order to remove that String for some specific page, please put a jQuery/javascript on the page, which will hide that particular div/span which is showing that text.
In this case, it will not be shown on that page, but it will be available and will be rendered elsewhere.
Here are the quick steps :
Go to "Manage Page" section of the desired page (page on which you dont want to show this text)
Go to javascript section add this $('.taglib-page-iterator').hide();
This will only work, if you have included jquery.js in your theme. So please do it.
At present, hook (or ext if you want an extreme solution) is the only way you can do it.
Override the showing_x_results.jspf Fragment and comment/remove what's unnecessary.
The only "properties" that are configurable through the portal-ext.properties are these (LR 6.0.5)
#
# Set the available values for the number of entries to display per page. An
# empty value, or commenting out the value, will disable delta resizing.
# The default of 20 will apply in all cases.
#
# Always include 20, since it is the default page size when no delta is
# specified. The absolute maximum allowed delta is 200.
#
search.container.page.delta.values=5,10,20,30,50,75
#
# Set the maximum number of pages available above and below the currently
# displayed page.
#
search.container.page.iterator.max.pages=25
#
# Set this to false to remove the pagination controls above or below
# results.
#
search.container.show.pagination.top=true
search.container.show.pagination.bottom=true
You can find the latest (LR 6.1GA) Search Container properties explained here: http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/search-container
I wouldn't recommend hiding it from the client end as it will most likely break if you decide to upgrade your Liferay Installation. Hook is a safe way out.

Resources