ZK Bootstrap Theme

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
Menupopup	Dropdown Menu	bs	Demo
Panel	Panel	bs	Demo
Paging	Pagination	bs	Demo
Navbar	Navbar	bs	Demo
Navbar	Tabs	bs-tabs	Demo
Navbar	Pills	bs-pills	Demo

For more usage example, please refer to this demo