Hi There,
I have modified the base Luminis 5.1 theme to include Bootstrap CSS and Javascript so that a responsive template (like Dustin Sier's) can be used. It's available here:
https://github.com/dnase/lp5-theme-bootstrap
Feel free to post a reply if you need any help.
Cheers,
Drew
Comments
Question
The responsive template that Dustin Sier wrote, where would that go in the code? I was able to take what you put on github and build out the war file. Thanks for help and the modified Luminis theme.
Mike
Answer
Hi Mike,
To get Dustin's template to work, you would take the .tpl files that Dustin provided, and put them in this directory:
$CP_ROOT/products/tomcat/tomcat-[admin|portal]/webapps/ROOT/layouttpl/custom/
Then you need to modify liferay-layout-templates.xml in:
$CP_ROOT/products/tomcat/tomcat-[admin|portal]/webapps/ROOT/WEB-INF/
And add the XML that Dustin provided in the copy of liferay-layout-templates.xml on his github. I added mine to the end of the section, inside the tags.
Also note that for whatever reason, the template marked "3 column bootstrap" is only 2 columns.
Don't forget to bounce your servers after making these changes!
Regards,
Drew
Thanks and one more question
Drew,
Thanks for the steps to add Dustin template. I figured out my issues and now the repsonsive theme works. I noticed that there are some changes between 5.1 and 5.1.1 that were messing me up. Now to figure out what I need to change to get the 3 column working for the responsive theme. Thanks again for posting this.
Mike
3 column layout
Did you get the 3 column layout working? If yes, how??
I can only get 2 columns of portlets using that layout.
Any hints will be most appreciated.
Karen
Yes we did get it working
Yes we did get it working. From my reading about using bootstrap for the responsive themes the "col-md-insert_number" must equal 12. Below is the code, hope it helps.
Code in the file Bootstrap_3col.tpl
<div class="container-fluid" id="main-content" role="main">
<div class="row">
<div class="col-md-4" id="column-1">
$processor.processColumn("column-1", "portlet-column-content portlet-column-content-first")
</div>
<div class="col-md-4" id="column-2">
$processor.processColumn("column-2", "portlet-column-content portlet-column-content")
</div>
<div class="col-md-4" id="column-3">
$processor.processColumn("column-3", "portlet-column-content portlet-column-content-last")
</div>
</div>
</div>
Code in the file Bootstrap_3col.wap.tpl
<div>
<div>
$processor.processColumn("column-1")
</div>
<div>
$processor.processColumn("column-2")
</div>
<div>
$processor.processColumn("column-3")
</div>
</div>
Luminis freezes
Hi,
After installing the responsive theme and the template, on both my Luminis 5.1 and 5.2.1 installations, Luminis just freezes went I try to select the bootstrap theme.
Has this happened to anyone else? Do you know about any solutions?