Combination View Flat View Tree View
Threads [ Previous | Next ]
toggle
Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda November 29, 2013 3:10 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap M J December 1, 2013 11:04 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda December 2, 2013 12:54 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap M J December 2, 2013 5:08 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Edgar Trania December 16, 2013 4:53 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap M J December 17, 2013 3:40 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Rohit Gupta February 25, 2014 12:50 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap M J February 26, 2014 3:57 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda February 26, 2014 4:05 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Nate Cavanaugh December 2, 2013 8:35 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda December 2, 2013 10:04 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Nate Cavanaugh December 3, 2013 8:22 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda December 3, 2013 11:30 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Jack Bakker December 3, 2013 3:44 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 10, 2013 4:26 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Miguel Ángel Pau December 10, 2013 5:21 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 10, 2013 6:02 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Miguel Ángel Pau December 10, 2013 8:00 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 10, 2013 11:27 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Miguel Ángel Pau December 11, 2013 12:45 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Moisés Belda December 11, 2013 1:03 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 12:39 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Miguel Ángel Pau December 11, 2013 1:14 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 1:27 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 3:34 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 10:53 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap M J December 11, 2013 9:12 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 10:25 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Sebastian Wikholm December 11, 2013 11:47 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Jack Bakker December 2, 2013 10:09 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Eduardo Lundgren December 2, 2013 4:53 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Nish K December 4, 2013 9:26 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Ahmed bouchriha December 7, 2013 9:40 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Nish K December 11, 2013 1:23 PM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Mithun Salinda February 28, 2014 12:46 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Daniel Tyger April 9, 2014 8:20 AM
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap Mithun Salinda April 10, 2014 3:22 AM
Moisés Belda
Liferay 6.2 Bootstrap support and alloy-bootstrap
November 29, 2013 3:10 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

Hi

I'm testing bootstrap theme development with new Liferay 6.2.0

I have seen that bootstrap javascript components/libraries (carrousell, collapse, dropdown) hasn't been included in 6.2.0 release.

alloy-bootstrap-2.3.2.zip file included in portal-web/third-party, only has bootstrap css files.

https://github.com/liferay/liferay-portal/tree/6.2.x/portal-web/third-party

But I see that alloy-bootstrap project has bootstrap js files for that components:

https://github.com/liferay/alloy-bootstrap/tree/master/js

Why is not included those libraries in 6.2.0?
How can I use bootstrap js / components in a theme for Liferay 6.2.0? Including manually those js?

Thanks
M J
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 1, 2013 11:04 AM
Answer

M J

Rank: Regular Member

Posts: 184

Join Date: March 1, 2013

Recent Posts

I have been trying to create a custom theme in Liferay 6.2 based on Bootstrap 3.0. Liferay 6.2 shipped with Bootstrap 2.3.2 ( I don't know what Liferay Team was thinking about selecting v2.3.2 over version 3). On top of that, Liferay 6.2's bootstrap version uses the ugliest javascript framework called "AUI". I don't know why they abandoned jQuery and chose AUI!. And the funny thing is Bootstrap uses jQuery and Liferay Team had to "secretly" include jQuery inside AUI (like a wrapper) in order to work the bootstrap in Liferay. What a convoluted design? This is what happens if you choose the wrong technology (AUI over jQuery). We can see this kind of design selections happening through out Liferay. Velocity and Freemarker. Now Liferay is leaning towards Freemarker but they still have to support Velocity for legacy reasons. So, even if liferay selects jQuery over AUI tomorrow, they will end up supporting AUI for the same legacy reasons. To answer your question, I am somewhat successful in creating the theme based on Bootstrap 3, however, there are lot of tweaks I have to do in the .css files.
Moisés Belda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 12:54 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

Hi M J

Hidden jquery? really? I investigated source code and founded that liferay 6.2 only has implemented bootstrap css, not bootstrap javascript ( bootstrap-collapse.js, etc). Similar components like responsive collapsing menu I think are implemented with boostrap css and AUI code, not jquery. You can see that in liferay aui taglibs ( <aui:nav> and <aui:nav-item> )

The problem is when we want to implement that components with themes. Themes uses Freemarker or Velocity, and you cannot use aui taglibs easily. I try to make a simple theme with collapse menu (bootstrap based) but I think there are some css conflicts.

Can you share with us any sample of that css tweaks?
M J
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 5:08 AM
Answer

M J

Rank: Regular Member

Posts: 184

Join Date: March 1, 2013

Recent Posts

I am attaching the _dffs folder of my custom theme based on Bootstrap 3. It's not completed, I am still tweaking the css files.
Attachments: _diffs.zip (234.8k)
Nate Cavanaugh
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 8:35 AM
Answer

Nate Cavanaugh

LIFERAY STAFF

Rank: Junior Member

Posts: 87

Join Date: November 27, 2006

Recent Posts

Hi guys,
I'm currently writing a blog post explaining how we are bringing in Bootstrap, as well as the thinking behind some of the decisions.

But to answer some questions here:

1. We are only supporting the HTML/CSS portion of Bootstrap, not the JS portion.
2. However, there are some that are useful, and we've created modules in Alloy to supply that functionality (such as Tooltip, Modal, as well as some others, which you can find examples for on AlloyUI.com).
If there are any particular ones that are missing that you would like us to include, let us know, and we can prioritize those.
3. We *do not* include a "secret" or "wrapped" jQuery. We are not using the JS components from Bootstrap because of that fact (not that there's anything wrong with jQuery, but it just wouldn't be very efficient to be including multiple libraries with different API's).
AlloyUI is based on YUI3, and will be staying that way emoticon
4. The Bootstrap JS files you see in the Alloy Bootstrap project are there because we forked the Bootstrap SASS version. We only bring in the CSS however.

Lastly, as for why we switched from jQuery to YUI3, we made the switch roughly 4 years ago, and were made for a variety of reasons. Some of those reasons no longer apply, and jQuery has improved some in that time, however, there are still major reasons, especially around performance, that still lead us to prefer YUI3.
You're able to also include jQuery without any conflict (though you do have the extra cost of downloading another library), so if you have plugins or code that require it, you can safely do so without running into any issues with the portal including a conflicting version.
YUI isn't perfect, and there is some added complexity, but you can kind of think of it as Python or Java vs. PHP.
In Python and Java, you have some common language functionality, but you have the concept of sandboxes and importing modules. In PHP, everything is loaded up front, so you don't need to import any libraries.
This makes it much easier to get started and up and running. But it also makes it harder to scale for larger applications.
It's not a perfect analogy, but I think it captures the spirit of it.

Hopefully that answers your questions emoticon
Moisés Belda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 10:04 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

Great post Nate.

You confirm my suspictions about bootstrap js components.

Then... How can I get a responsive menu bar with collapsed elements (like the one included at aui taglib) in theme context? (for example velocity navigation.vm)

Liferay Aui taglib has the next elements....
1
2<aui:nav-bar>
3    <aui:nav>
4            <aui:nav-item href="url" />       
5                        <aui:nav-item href="url" />
6    </aui:nav>


Very easy.... Is there any easy way to archieve this in theme context with AUI, or I need a future ALLOY UI MODULE that implements that navbar navigation in html +css?

Please, ALLOY UI TEAM, priorize this!

Thanks a lot
Jack Bakker
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 10:09 AM
Answer

Jack Bakker

Rank: Liferay Master

Posts: 882

Join Date: January 3, 2010

Recent Posts

I haven't explored twitter bootstrap over Liferay 6.2 much yet ; tho am much into it over v6.1

tho I like AUI for custom MVCPortlets for many reasons. For theme however, I grab jquery for better carousels, responsive via twitter and more... so far I can use AUI in custom portlets fine and use various versions of jquery fine...

Liferay has embraced/absorbed much out there for better integration, and likely AUI vs. jquery should become a AUI and/or jquery discussion not an either/or.
Eduardo Lundgren
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 2, 2013 4:53 PM
Answer

Eduardo Lundgren

LIFERAY STAFF

Rank: Junior Member

Posts: 25

Join Date: June 18, 2008

Recent Posts

To clarify about Bootstrap 3 support on Liferay. Liferay 6.2.0 will not support Bootstrap 3 officially. We have plans to start AlloyUI changes on a separate branch in order to prepare that to the future, maybe Liferay 7.0.
Nate Cavanaugh
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 3, 2013 8:22 AM
Answer

Nate Cavanaugh

LIFERAY STAFF

Rank: Junior Member

Posts: 87

Join Date: November 27, 2006

Recent Posts

Hi Moisés,
If you use Freemarker, one of the reasons why we chose to support it was is because it supports using taglibs.

For instance, if you use the following:

1<#assign aui = PortalJspTagLibs["/WEB-INF/tld/aui.tld"] />
2<@aui["nav-bar"]>
3    <@aui.nav>
4        <@aui["nav-item"] href="url" label="Value 1" />
5        <@aui["nav-item"] href="url" label="Value 2" />
6    </@>
7</@>


It will output a responsive menu for you.

However, if you're on Velocity, you would have to add the collapsible element itself, as well as the JavaScript, which is kind of large.
We'll definitely add this to our list of items to prioritize.

Thanks Moisés,
Moisés Belda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 3, 2013 11:30 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

Thanks to you Nate

Great alternative with freemarker and good news about that AUI module for navbar. We waiting for it with great expectation!

P.S. => You are my heroes!
Jack Bakker
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 3, 2013 3:44 PM
Answer

Jack Bakker

Rank: Liferay Master

Posts: 882

Join Date: January 3, 2010

Recent Posts

freemarker... gotta learn freemarker...

https://www.liferay.com/web/mika.koivisto/blog/-/blogs/using-freemarker-in-your-theme-templates
Nish K
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 4, 2013 9:26 AM
Answer

Nish K

Rank: New Member

Posts: 20

Join Date: May 16, 2012

Recent Posts

Hi Nate,

I read one of your Blogs about aui-viewport and developed in this way on Liferay 6.1.1 but now in the Default Theme of Liferay 6.2 all my css with .aui-view-x are ignored. How can I force the Theme to work just like on Liferay 6.1.1 with aui-view-x classes in css files?

your blog url: http://www.liferay.com/de/web/nathan.cavanaugh/blog/-/blogs/liferay-com-mobile-sites-and-responsive-layouts
Ahmed bouchriha
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 7, 2013 9:40 AM
Answer

Ahmed bouchriha

Rank: Junior Member

Posts: 55

Join Date: May 4, 2012

Recent Posts

Hi Nish K

Your .aui-view-x classes are ignored with LR6.2 because the new alloy viewport use .view-x classes instead so try to remove the aui- prefix from you css
so all your .aui-view-x classes became .view-x.

Best Regards
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 10, 2013 4:26 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Nate Cavanaugh:
Hi Moisés,
If you use Freemarker, one of the reasons why we chose to support it was is because it supports using taglibs.

For instance, if you use the following:

1<#assign aui = PortalJspTagLibs["/WEB-INF/tld/aui.tld"] />
2<@aui["nav-bar"]>
3    <@aui.nav>
4        <@aui["nav-item"] href="url" label="Value 1" />
5        <@aui["nav-item"] href="url" label="Value 2" />
6    </@>
7</@>


It will output a responsive menu for you.

However, if you're on Velocity, you would have to add the collapsible element itself, as well as the JavaScript, which is kind of large.
We'll definitely add this to our list of items to prioritize.

Thanks Moisés,


Is there any documentation of how to use that? How about dropdowns? How about a header part as in a bootstrap navbar. I was just going to use a normal bootstrap navbar, but it seems that Liferay does something strange with collapsed menus? Anybody know how i could get a normal bootstrap menu to work correctly in a theme? Wanted to use Yamm for the menu too (http://geedmo.github.io/yamm/) But i still cant get it to work, and cant figure out why..
Miguel Ángel Pau
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 10, 2013 5:21 AM
Answer

Miguel Ángel Pau

Rank: Regular Member

Posts: 157

Join Date: April 26, 2005

Recent Posts

Hi Sebastian!
I was in the same case like you and I did many tests but seems that if you don't want to add bootstrap javascript libraries you must use a jsp or freemarker theme at the moment like you can read in Nate's comments.
If you want to use velocity theme you can add only Collapse, Dropdown and Transitions Bootstrap components customizing the .js file here http://getbootstrap.com/customize/

This work for me and at the moment I don't have any problems with other dropdown features.
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 10, 2013 6:02 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
Hi Sebastian!
I was in the same case like you and I did many tests but seems that if you don't want to add bootstrap javascript libraries you must use a jsp or freemarker theme at the moment like you can read in Nate's comments.
If you want to use velocity theme you can add only Collapse, Dropdown and Transitions Bootstrap components customizing the .js file here http://getbootstrap.com/customize/

This work for me and at the moment I don't have any problems with other dropdown features.


If i use freemarker, can i use everything bootstrap has to offer? Or can iuse aui:nav-bars? I've been just adding the whole bootstrap.js file, when testing this out, and it seems that liferay does something to bootstrap collapse, and the collapsed menu just does not work with bootstrap included. Just wondering if i would be able to get yamm to work (http://geedmo.github.io/yamm/). The plan is to use journalContentUtil to get some articles in the global scope that would have the hand built menu items in them, then put them in a yamm megamenu.
Miguel Ángel Pau
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 10, 2013 8:00 AM
Answer

Miguel Ángel Pau

Rank: Regular Member

Posts: 157

Join Date: April 26, 2005

Recent Posts

If you use freemarker you can use aui nav taglibs, the comments are not related to bootstrap.js.
Try to make a _style theme with default dropdown bootstrap html structure and customized javascript. Look at the browser javascript console to debug if you still having problems.
Sorry but I can't help you with yamm.

Regards!
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 10, 2013 11:27 PM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
If you use freemarker you can use aui nav taglibs, the comments are not related to bootstrap.js.
Try to make a _style theme with default dropdown bootstrap html structure and customized javascript. Look at the browser javascript console to debug if you still having problems.
Sorry but I can't help you with yamm.

Regards!


is there documentation how to use aui:navbar, aui:nav, aui:nav-item, and all the attributes it takes and what they do?
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 12:39 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
If you use freemarker you can use aui nav taglibs, the comments are not related to bootstrap.js.
Try to make a _style theme with default dropdown bootstrap html structure and customized javascript. Look at the browser javascript console to debug if you still having problems.
Sorry but I can't help you with yamm.

Regards!


BTW the collapsed dockbar (ie when the dockbar has a width where the menu is replaced by a button) in the _styled default theme does not work. Try it, reduce the width of the page until the button appears, try clicking it, one would expect that "administration" and "my places" would appear there, but no, dont know if it is by design but in that styled default theme them navigation of the dockbor is not functional
Miguel Ángel Pau
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 12:45 AM
Answer

Miguel Ángel Pau

Rank: Regular Member

Posts: 157

Join Date: April 26, 2005

Recent Posts

As Nate says just above... they are going to prioritize the documentation about aui nav emoticon
Moisés Belda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 1:03 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

Sebastian Wikholm:
Miguel Ángel Pau:
If you use freemarker you can use aui nav taglibs, the comments are not related to bootstrap.js.
Try to make a _style theme with default dropdown bootstrap html structure and customized javascript. Look at the browser javascript console to debug if you still having problems.
Sorry but I can't help you with yamm.

Regards!


is there documentation how to use aui:navbar, aui:nav, aui:nav-item, and all the attributes it takes and what they do?



Sebastian, There aren't documentation about <aui:nav> yet, but, you can see how it works with jukebox portlet developed by Liferay Engineers for Symposium demo.

github jukebox portlet
Miguel Ángel Pau
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 1:14 AM
Answer

Miguel Ángel Pau

Rank: Regular Member

Posts: 157

Join Date: April 26, 2005

Recent Posts

I tried! I have a 6.2 _styled responsive theme ^_^
You have the dropdown button in the dockbar only if you are logged into the portal by default, with a _styled theme, for this reason I used my own dropdown button following the bootstrap html structure:
1
2<button class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse" type="button">
3 <span class="icon-bar"></span>
4 <span class="icon-bar"></span>
5 <span class="icon-bar"></span>
6</button>
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 1:27 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
I tried! I have a 6.2 _styled responsive theme ^_^
You have the dropdown button in the dockbar only if you are logged into the portal by default, with a _styled theme, for this reason I used my own dropdown button following the bootstrap html structure:
1
2<button class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse" type="button">
3 <span class="icon-bar"></span>
4 <span class="icon-bar"></span>
5 <span class="icon-bar"></span>
6</button>


Well the problem still remains, even if you include the whole bootstrap.js, or parts like bootstrap-collapse.js and do a normal bootstrap navbar, something in liferay disables the collapsed menu button functionality, which works in a bootstrap only example page.
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 3:34 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
I tried! I have a 6.2 _styled responsive theme ^_^
You have the dropdown button in the dockbar only if you are logged into the portal by default, with a _styled theme, for this reason I used my own dropdown button following the bootstrap html structure:
1
2<button class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse" type="button">
3 <span class="icon-bar"></span>
4 <span class="icon-bar"></span>
5 <span class="icon-bar"></span>
6</button>


Btw thats the whole problem that collapse button does not work, if i include or do not include collapse. I get the menu to be hidden only if i give it a id="navigation" with the dockbar menu, a button seperate like in your example does not work. No javascript errors are given, hard as heck to find why it isnt working
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 10:53 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

Miguel Ángel Pau:
I tried! I have a 6.2 _styled responsive theme ^_^
You have the dropdown button in the dockbar only if you are logged into the portal by default, with a _styled theme, for this reason I used my own dropdown button following the bootstrap html structure:
1
2<button class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse" type="button">
3 <span class="icon-bar"></span>
4 <span class="icon-bar"></span>
5 <span class="icon-bar"></span>
6</button>


Ok, ive debugged this far:

-Other bootstrap js things are working, bootstrap dropdown and carousel tested
-Bootstrap collapse is loaded and fired, tested with chrome developer tools and putting some breakpoints in the javascript
-It should be adding and removing css classes in two divs and change a div style, it only changes the classes partially

These are all tested with themes created in eclipse and using the parent themes _unstyled, _styled, classic both with velocity and freemarker. The navbars have been added both to the themes and as articlecontent.. bootstrap js files are loaded just before the </body>, also tested with js files loaded in <head> part of the html. jquery is loaded too before bootstrap

All the bootstrap html code is tested without liferay first, and are all working, they only stop working when put in liferay, ie there seems to be some sort of conflict that disabled the correct functionality of a bootstrap navbar.

Its easy to test, create whatever empty theme, add jquery and bootstrap.js or bootstrap-dropdown.js and bootstrap-collapse.js at the bottom of the html code before </body>. Add any form of navbar, resize the window until the responsive navbar collapses to a button and try to get the button to show the navbar items as it should, it wont. Hence liferay is not really supporting the usage of bootstrap. It would be a good design strategy to see that there will never be any form of conflict between bootstrap and aui or whatever the heck is happening (been banging my head against the wall for four days trying to figure out whats happening in this thing).
M J
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 9:12 AM
Answer

M J

Rank: Regular Member

Posts: 184

Join Date: March 1, 2013

Recent Posts

Ditch the Liferay 6.2 dockbar and do your own dockbar through hook and modify the dockbar.css file.
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 10:25 AM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

M J:
Ditch the Liferay 6.2 dockbar and do your own dockbar through hook and modify the dockbar.css file.



If it only was the dockbar, doing any sort of navbar independent of the dockbar doesnt work either. Ie bootstrap navbars are not functioning in liferay 6.2, not working now but going to continue tomorrow trying to sort out why the boostrap-collapse.js is not working inside of liferay.
Nish K
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 1:23 PM
Answer

Nish K

Rank: New Member

Posts: 20

Join Date: May 16, 2012

Recent Posts

Thank you very much Ahmed Bouchriha. This is exactly what went wrong with my code!!!!
Sebastian Wikholm
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 11, 2013 11:47 PM
Answer

Sebastian Wikholm

Rank: Junior Member

Posts: 76

Join Date: March 10, 2011

Recent Posts

ok found it, a little less stress and stuff like that helps emoticon

was just a css problem:

added to custom.css:


.navbar .container .nav-collapse {
display: block;
}


it seems to be sett in navbar.css to display:none..
Edgar Trania
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 16, 2013 4:53 PM
Answer

Edgar Trania

Rank: Junior Member

Posts: 37

Join Date: November 13, 2010

Recent Posts

M J:
I am attaching the _dffs folder of my custom theme based on Bootstrap 3. It's not completed, I am still tweaking the css files.


Hi Mj what will happen to the alloy ui can i still use it with the tweak?
M J
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
December 17, 2013 3:40 AM
Answer

M J

Rank: Regular Member

Posts: 184

Join Date: March 1, 2013

Recent Posts

[quote=Hi Mj what will happen to the alloy ui can i still use it with the tweak?

I am still working on it. Liferay team really bastardized bootsratp 2.3.2 with AUI. It looks like I have to rename the classes that I want to use with Bootstrap 3.
Rohit Gupta
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
February 25, 2014 12:50 PM
Answer

Rohit Gupta

Rank: New Member

Posts: 1

Join Date: January 11, 2012

Recent Posts

Hi MJ,

Any luck with Bootstrap 3 emoticon, please give me some tips as i am also struggling with the same.
M J
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
February 26, 2014 3:57 AM
Answer

M J

Rank: Regular Member

Posts: 184

Join Date: March 1, 2013

Recent Posts

BS 3.x WILL NOT WORK with Liferay 6.2. I started with classic theme and started modifying the changes in the _diffs folder for the custom theme based on Liferay BS 2.3.2. This is the ONLY way you can customize theme, anything else would be wasting your time.
Moisés Belda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
February 26, 2014 4:05 AM
Answer

Moisés Belda

Rank: Junior Member

Posts: 74

Join Date: April 20, 2013

Recent Posts

As Eduardo said before....
To clarify about Bootstrap 3 support on Liferay. Liferay 6.2.0 will not support Bootstrap 3 officially. We have plans to start AlloyUI changes on a separate branch in order to prepare that to the future, maybe Liferay 7.0.


You have to use bootstrap 2.3.2!

More info => Nate Cavanaugh's blog
Mithun Salinda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
February 28, 2014 12:46 AM
Answer

Mithun Salinda

Rank: New Member

Posts: 12

Join Date: March 9, 2012

Recent Posts

Is there anyway to disable responsive in liferay 6.2, because in our site we don't need it we planed to introduce separate app for mobile devices
So Is it possible to disable responsive?
Daniel Tyger
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
April 9, 2014 8:20 AM
Answer

Daniel Tyger

Rank: Junior Member

Posts: 79

Join Date: February 5, 2013

Recent Posts

Mithun Salinda:
Is there anyway to disable responsive in liferay 6.2...
So Is it possible to disable responsive?


Hi Mithun Salinda: Not sure which aspects of responsive features you want to disable... On one extreme, you can start with the _unstyled theme as your parent.theme in your build.xml file to give you an idea of everything in its stripped-down presentation. To see the changes added on at the _styled level, create a theme with that parent and you will see the layout templates (columns / rows) become responsive, but the rest of the navigation and UI is modest. The classic theme introduces the most responsive features and is tightly woven with bootstrap and aui / yui. The /webapps/ROOT/layouttpl/custom holds the layouts that are styled and become collapsible or not... I suppose you could also drop back to 6.1/earlier versions of base themes and port them forward...

Also, I saw someone reference this site on disabling responsive features of bootstrap: http://getbootstrap.com/examples/non-responsive/ but note also the repercussions...-daniel
Mithun Salinda
RE: Liferay 6.2 Bootstrap support and alloy-bootstrap
April 10, 2014 3:22 AM
Answer

Mithun Salinda

Rank: New Member

Posts: 12

Join Date: March 9, 2012

Recent Posts

Daniel Tyger:
Mithun Salinda:
Is there anyway to disable responsive in liferay 6.2...
So Is it possible to disable responsive?


Hi Mithun Salinda: Not sure which aspects of responsive features you want to disable... On one extreme, you can start with the _unstyled theme as your parent.theme in your build.xml file to give you an idea of everything in its stripped-down presentation. To see the changes added on at the _styled level, create a theme with that parent and you will see the layout templates (columns / rows) become responsive, but the rest of the navigation and UI is modest. The classic theme introduces the most responsive features and is tightly woven with bootstrap and aui / yui. The /webapps/ROOT/layouttpl/custom holds the layouts that are styled and become collapsible or not... I suppose you could also drop back to 6.1/earlier versions of base themes and port them forward...

Also, I saw someone reference this site on disabling responsive features of bootstrap: http://getbootstrap.com/examples/non-responsive/ but note also the repercussions...-daniel


Hi Daniel,,, Thanks for the reply, Actually we got a problem when we moved to liferay 6.2 from 5.2. basically what we need was remove responsive in 6.2 so we removed some styles from navigation.vm and added our styles and removed view port meta and also removed content styles from portal normal.i know this is one of the best feature in liferay ,But that was client needed. Thanks Again for your advice..