Override part template Orchard - orchardcms

I starting with orchard. I want to override MenuWidgetPart to render as i want. I've created Parts.MenuWidget-MenuWidget.cshtml into Views folder of current theme. But i do not know, how to i can get list menu from Model. Please look my code below:
<nav>
<ul>
#foreach(var m in listMenu){
<li>#m.Text</li>
}
</ul>
</nav>
How to i can get listMenu from Model ?

Templates for Menu and MenuItem are Menu.cshtml and MenuItem.cshtml. You can start by copying those files from /Core/Shapes/Views/ directory to your theme directory. You can modify them as you wish afterwards.
This will, actually modify all your menus on the site. If you want it to be specifically for your widget (Parts.MenuWidget-MenuWidget.cshtml) you can start by copying the contents from Menu.cshtml to your widget template and continue with modifications from there.
EDIT:
To iterate over items you can use the following syntax:
#foreach (var item in Model.Menu.Items){
#Display(item)
}

Related

add a custom view to JHipster app

Is there a Yeoman way of creating all the necessary templates required when adding a new view in a JHipster app? I want a simple static page, or a page that doesn't require a new entity. Let's say I want to add an "About" page, I believe I would need to do the following:
Add the "About" link to src/main/webapp/app/layouts/navbar/navbar.html:
<li ui-sref-active="active">
<a ui-sref="about" ng-click="vm.collapseNavbar()">
<span class="glyphicon glyphicon-wrench"></span>
<span class="hidden-sm" data-translate="global.menu.about">About</span>
</a>
</li>
Create the following new files:
src/main/webapp/app/about/about.controller.js
src/main/webapp/app/about/about.html
src/main/webapp/app/about/about.state.js
src/main/webapp/i18n/en/about.json, and any other language...
... and add the following lines in webapp/index.html:
<script src="app/about/about.state.js"></script>
<script src="app/about/about.controller.js"></script>
... and any necessary content to src/main/webapp/i18n/en/global.json.
Am I forgetting something?
Does this need to be done manually? Is there a Yeoman command for creating a new view that is independent of an entity? I know that this question has been asked, but I'm hoping that things have changed since then.
The jhipster module Nav Element do it automatically for us. In addition it creates an angular component too for the new item in the menu.
Here is instruction how to add static page:
https://codefitter2.blogspot.com/2016/09/how-to-add-new-menu-and-static-page-in.html
You may try creating an entity without any fields or relations and with "--skip-server" option.
yo jhipster:entity about --skip-server

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.

Overriding Widget View in Orchard

I setup a custom content definition, query and projection inside Orchard (1.8) and just about everything with it works great, including overriding the display view on the projection page's URL. The only issue I'm running into is when I put that same projection in a widget, I can't seem to figure out how to override the view for it. The automatically generated HTML is this:
<p class="text-field"><span class="name">Name:</span> <span class="value">/** Title from content item **/</span></p>
<p>more</p>
<p>asdfasdfasdrerfwerqaq324f421 more</p>
<p class="date-time-field date-time-field-date">
<span class="name">Date:</span>
<span class="value">/** Date from content item **/ </span>
</p>
I've tried using the Shape tracer to create an alternate view, but even when I only have #Display(Model.Content) in the new view, it still puts all of that extra stuff in it which is more than I need to show on this view. The shape tracer says the active template is my new one with only that value in it, so I'm not sure where all the extra HTML is coming from here (though it does show on the HTML tab of the Shape tracer).
How can I override the view for this widget?
If the extra HTML is only appearing when you post the projection as a widget it is probably due to wrapper tags added through code or through the widget wrapper template. Try either of these methods:
Check Widget.Wrapper.cshtml to see if that view template contain the extra HTML. I don't remember if this shape shows up in the shape tracer, it might show up under the wrappers section.
You can also try the trick below - this can remove unwanted markup in some cases, I use it for the menu navigation widget. It removes any wrappers that were added through code. Make your widget template look like this:
#Display(Model.Content)
#{
Model.Metadata.Wrappers.Clear();
}

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!

Layout based on Page - OrchardCMS

I have encountered an issue when using Orchard that I am sure there should be a fairly simple fix / solution for, but I have yet to find it.
I am trying to establish a specific width content area for my home page (580px), and a larger width for content pages (800px).
Layout.cshtml Snippet:
<div id='content'>
#Zone(Model.Content)
</div>
Style:
#Content
{
[...]
width: 580px;
}
Currently - the Content div wraps all of my content regardless of the page (either Home Page or Content). I am wondering if it is possible to use a different div to wrap the content based on the Page, as shown:
Layout.cshtml Idea:
#if(Model.Page != "Home")
{
<div id='fullcontent'>
#Zone(Model.Content)
</div>
}
else
{
<div id='content'>
#Zone(Model.Content)
</div>
}
I'm unsure if the above suggested method is possible (or I am unsure how to check for the current Page) - but any other suggestions would be appreciated.
You can use the Designer Tools module (built-in all recent Orchard versions) and enable the URL alternates feature. You'll then be able to create a layout-url-homepage.cshtml alternate for your layout.
You can use the Layout Selector Module to assign a custom layout to any content item.
http://gallery.orchardproject.net/List/Modules/Orchard.Module.Orchard.DesignerTools
You could use the Vandelay.Classy module to add custom tags to the page that represents your homepage, although it does add a lot of fields to the Page content editor.

Resources