Integrating Bootstrap 3 with Liferay 6.1?

掲示板

10年前に Nicole Justice によって更新されました。

Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 1 参加年月日: 12/05/03 最新の投稿

Hello! My team and I are trying to create a responsive theme based on Bootstrap 3 in Liferay 6.1. Does anyone here have any experience with creating a responsive layout and theme based on Bootstrap 3? Your feedback would be greatly appreciated.

Regards,

Nicole

10年前に Bradley Wood によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

10年前に Riccardo De Stefani によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Junior Member 投稿: 41 参加年月日: 13/10/15 最新の投稿

Bradley Wood:

My recommendation is to convert all OOTB Liferay Layouts to use the boostrap 3 markup, and place them in the theme so when the theme is used the markup will be correct. Then in the Portal_normal.vm in the <head> of the html include the CSS and JS that is needed for twitterbootstrap3 to work with.

Sorry but i am newbo in liferay, can you explain this better?
I want to develop liferay 6.2 theme using bootstrap 3 but i've found these problems:
- theme inherited from _styled: bootstrap 2 "hits" with bootstrap 3 when i include bootstrap 3 in head tag of portal_normal.vm. My html elements inherits some properties from bootstrap2, some from bootstrap3
- theme inherited from _unstyled: i am free to include bootstrap3 (no hits with bootstrap2) but dockbar now has no style and, more important, no behavior. Add, Edit, Preview not working or with no style
- theme inherited from _unstyled: i can include bootstrap3, rewrite dockbar overriding jsp pages in a custom hook, giving it bootstrap3 markup and classes. It work for dockbar in portal pages, but not for dockbar in "control center" pages of liferay. Dockbar is the same, but there i have no reference to bootstrap3 and dockbar gets no style. Control center has its own theme

My goal is to write a theme using only bootstrap 3, keeping dockabar working (primarily its behavior) in portal pages and in control center pages.
Thanks

10年前に M J によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Regular Member 投稿: 184 参加年月日: 13/03/01 最新の投稿

Riccardo,

Check the zip file attached to the previous message, it has all the stuff you needed for Bootstrap 3 theme.

MJ.

10年前に Riccardo De Stefani によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Junior Member 投稿: 41 参加年月日: 13/10/15 最新の投稿

Thank you MJ.
Now i want to create a modal login dialog, like the dialog one in the classic theme of Liferay 6.2, but login liferay portlet is written using aui tags (bootstrap 2), so dialog doesn't get the right style from bootstrap 3 library to show.
What is the right way to do modal dialog login in Liferay 6.2, using only bootstrap 3?
Thanks

10年前に M J によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Regular Member 投稿: 184 参加年月日: 13/03/01 最新の投稿

Nicole,

I developed a custom theme based on Bootstrap 3 R2. If you want, I can share the code. Let me know.

MJ

10年前に Mithun Salinda によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 12 参加年月日: 12/03/09 最新の投稿

Hi can you send me the code?

10年前に M J によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Regular Member 投稿: 184 参加年月日: 13/03/01 最新の投稿

@Mithun @Nicole

Here is the custom theme based on Bootstrap 3 RC1. I only included the contents of the _diffs folder. I hope it helps.

MJ

10年前に Mithun Salinda によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 12 参加年月日: 12/03/09 最新の投稿

M J:

@Mithun @Nicole

Here is the custom theme based on Bootstrap 3 RC1. I only included the contents of the _diffs folder. I hope it helps.

MJ

Thanks MJ ,, Great ! emoticon

10年前に R DS によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

Junior Member 投稿: 41 参加年月日: 13/10/15 最新の投稿

Do you know the right way to override login portlet (in a custom hook) to change aui tags in bootstrap 3 markup?
example: <aui:form> in <form>

Thanks

10年前に Nnalue Henry によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 3 参加年月日: 13/05/12 最新の投稿

M J:

@Mithun @Nicole

Here is the custom theme based on Bootstrap 3 RC1. I only included the contents of the _diffs folder. I hope it helps.

MJ

I took your _diff folder and used it to create a new theme on liferay 6.1. It worked to an extent but when I tried using bootstrap 3 html tags, it was not able to reference all from the css provided. ie it appeared in a disjointed manner. does it mean this would work on 6.2 only? please i really need help on how I can build a liferay theme on 6.1 using Bootstrap 3.

Regards

10年前に Nnalue Henry によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 3 参加年月日: 13/05/12 最新の投稿

M J:

@Mithun @Nicole

Here is the custom theme based on Bootstrap 3 RC1. I only included the contents of the _diffs folder. I hope it helps.

MJ

I have successfully integrated bootsrap 3 into liferay 6.1 but I hit a road block. When I create a page using WCD (web content display), the content of the page seem not to responsive. but things like message board and blog portlet is responsive. Please how can i solve this problem.

Thank You

8年前に Jorge Pineda によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 9 参加年月日: 14/12/16 最新の投稿

M J:

@Mithun @Nicole

Here is the custom theme based on Bootstrap 3 RC1. I only included the contents of the _diffs folder. I hope it helps.

MJ

Thank You!!!

8年前に dharmesh Mistry によって更新されました。

RE: Integrating Bootstrap 3 with Liferay 6.1?

New Member 投稿: 22 参加年月日: 14/07/09 最新の投稿

@ M J
Thanks for sharing code ,

Can i use in my custom theme which i developed on base of an classic theme,

I am eager to integrate an develop custom theme using bootstrap for liferay 6.1, is that possible ? if yes then kindly share Knowledge ..