diff --git a/docs/basic-filter.md b/docs/basic-filter.md
new file mode 100644
index 0000000..258aa45
--- /dev/null
+++ b/docs/basic-filter.md
@@ -0,0 +1,55 @@
+---
+id: basic-filter
+title: Column Filter
+sidebar_label: Column Filter
+---
+
+`react-bootstrap-table2` separate the filter core code base to [`react-bootstrap-table2-filter`](https://github.com/react-bootstrap-table/react-bootstrap-table2/tree/develop/packages/react-bootstrap-table2-filter), so there's a little bit different when you use column filter than `react-bootstrap-table`. In the following, we are going to show you how to enable the column filter:
+
+-----
+
+## Install
+
+```sh
+$ npm install react-bootstrap-table2-filter --save
+```
+
+You can get all types of filters via import and these filters are a factory function to create a individual filter instance. Currently, we support following filters:
+
+* TextFilter
+* **Coming soon!**
+
+## Text Filter
+Following is a quick demo for enable the column filter on **Product Price** column!!
+
+```js
+import filterFactory, { textFilter } from 'react-bootstrap-table2-filter';
+
+// omit...
+const columns = [
+  ..., {
+  dataField: 'price',
+  text: 'Product Price',
+  filter: textFilter()
+}];
+
+<BootstrapTable keyField='id' data={ products } columns={ columns } filter={ filterFactory() } />
+```
+
+In addition, we preserve all of the filter features and functionality in legacy `react-bootstrap-table`, but in different way to do it:
+
+```js
+import filterFactory, { textFilter, Comparator } from 'react-bootstrap-table2-filter';
+// omit...
+
+const priceFilter = textFilter({
+  placeholder: 'My Custom PlaceHolder',  // custom the input placeholder
+  className: 'my-custom-text-filter', // custom classname on input
+  defaultValue: 'test', // default filtering value
+  comparator: Comparator.EQ, // default is Comparator.LIKE
+  style: { ... }, // your custom styles on input
+  delay: 1000 // how long will trigger filtering after user typing, default is 500 ms
+});
+
+// omit...
+```
\ No newline at end of file
diff --git a/website/i18n/en.json b/website/i18n/en.json
index 0b6267d..0d9cb7e 100644
--- a/website/i18n/en.json
+++ b/website/i18n/en.json
@@ -8,6 +8,8 @@
     "About": "About",
     "basic-column": "Work on Column",
     "Work on Column": "Work on Column",
+    "basic-filter": "Column Filter",
+    "Column Filter": "Column Filter",
     "basic-row-select": "Row Selection",
     "Row Selection": "Row Selection",
     "basic-sort": "Table Sort",
diff --git a/website/sidebars.json b/website/sidebars.json
index 59cb140..93ea8a9 100644
--- a/website/sidebars.json
+++ b/website/sidebars.json
@@ -7,7 +7,8 @@
     "Basic Usage": [
       "basic-column",
       "basic-sort",
-      "basic-row-select"
+      "basic-row-select",
+      "basic-filter"
     ]
   },
   "api": {