ZK Bootstrap Theme"

From Documentation
m (remove empty version history (via JWB))
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{ZKDevelopersReferencePageHeader}}
 
{{ZKDevelopersReferencePageHeader}}
 
+
{{Deprecated Content}}
 
__TOC__
 
__TOC__
  
ZK Bootstrap theme is a ZK addon to provide a set of molds for [http://getbootstrap.com/ Bootstrap V3], and developer can apply this addon to combine ZK with Bootstrap styling seamlessly.
+
ZK Bootstrap theme is a ZK addon to provide a set of molds for [http://getbootstrap.com/ Bootstrap V3], and developers can apply this addon to combine ZK with Bootstrap styling seamlessly.
  
 
=Installation=
 
=Installation=
Line 44: Line 44:
 
= Component Mapping Table =
 
= Component Mapping Table =
  
{| border="1"
+
{| class='wikitable' | width="100%"
 
! scope="col" | ZK Component
 
! scope="col" | ZK Component
 
! scope="col" | Bootstrap Component
 
! scope="col" | Bootstrap Component
Line 96: Line 96:
 
For more usage example, please  refer to [http://www.zkoss.org/zk-bootstrap this demo]
 
For more usage example, please  refer to [http://www.zkoss.org/zk-bootstrap this demo]
  
=Version History=
+
 
{{LastUpdated}}
 
{| border='1px' | width="100%"
 
! Version !! Date !! Content
 
|-
 
|  
 
|  
 
|  
 
|}
 
  
 
{{ZKDevelopersReferencePageFooter}}
 
{{ZKDevelopersReferencePageFooter}}

Latest revision as of 10:26, 5 February 2024

Icon info.png Note: The content of this page has been deprecated/removed in the latest version.

ZK Bootstrap theme is a ZK addon to provide a set of molds for Bootstrap V3, and developers can apply this addon to combine ZK with Bootstrap styling seamlessly.

Installation

  1. Download the ZK Bootstrap jar file from Github or use #Maven Installation
  2. Put the zk-bootstrap.jar file under WEB-INF/lib folder
  3. Specify the following setting in zk.xml. (Note: if you don't want to apply for all default mold, you can skip this step.)
<library-property>
	<name>org.zkoss.zul.Button.mold</name>
	<value>bs</value>
</library-property>
<library-property>
	<name>org.zkoss.zul.Menupopup.mold</name>
	<value>bs</value>
</library-property>
<library-property>
	<name>org.zkoss.zkmax.zul.Navbar.mold</name>
	<value>bs</value>
</library-property>
<library-property>
	<name>org.zkoss.zul.Paging.mold</name>
	<value>bs</value>
</library-property>
<library-property>
	<name>org.zkoss.zul.Panel.mold</name>
	<value>bs</value>
</library-property>

Note: we use the word bs as bootstrap's nickname for the extra zk component molds.

Maven Installation

    <dependency>
      <groupId>org.zkoss.addons</groupId>
      <artifactId>zk-bootstrap</artifactId>
      <version>1.0.0</version>
    </dependency>

Component Mapping Table

ZK Component Bootstrap Component Mold Name Demo Sketch
Button Button bs Demo Zk-bootstrap-button.PNG
Menupopup Dropdown Menu bs Demo Zk-bootstrap-menupopup.PNG
Panel Panel bs Demo Zk-bootstrap-panel.PNG
Paging Pagination bs Demo Zk-bootstrap-paging.PNG
Navbar Navbar bs Demo Zk-bootstrap-navbar.PNG
Navbar Tabs bs-tabs Demo Zk-bootstrap-tabs.PNG
Navbar Pills bs-pills Demo Zk-bootstrap-pills.PNG

For more usage example, please refer to this demo




Last Update : 2024/02/05

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.