diff --git a/src/Handler/Utils/Table/Pagination.hs b/src/Handler/Utils/Table/Pagination.hs
index e87d4a405..a45c5fb86 100644
--- a/src/Handler/Utils/Table/Pagination.hs
+++ b/src/Handler/Utils/Table/Pagination.hs
@@ -33,6 +33,7 @@ module Handler.Utils.Table.Pagination
   ) where
 
 import Handler.Utils.Table.Pagination.Types
+import Handler.Utils.Table.Pagination.Utils (getTableWidget)
 import Handler.Utils.Form
 import Utils
 import Utils.Lens.TH
@@ -349,6 +350,7 @@ data DBStyle = DBStyle
                     -> Widget
                     -> Widget
     -- ^ Filter UI, Filter Encoding, Filter action, table
+  , dbsCellTemplate :: String  -- TODO: wip
   }
 
 instance Default DBStyle where
@@ -362,6 +364,7 @@ instance Default DBStyle where
           <!-- No Filter UI -->
           ^{scrolltable}
         |]
+    , dbsCellTemplate = "table/cell/body"
     }
 
 defaultDBSFilterLayout :: Widget -- ^ Filter UI
@@ -765,9 +768,11 @@ dbTable PSValidator{..} dbtable@DBTable{ dbtIdent = dbtIdent'@(toPathPiece -> db
       wHeaders <- maybe (return Nothing) (fmap Just . genHeaders) pSortable
 
       wRows <- forM rows $ \row' -> forM (oneColonnadeEncode <$> getColonnade dbtColonnade) $ \(($ row') -> cell') -> do
-        widget <- cell' ^. cellContents
-        let attrs = cell' ^. cellAttrs
-        return $(widgetFile "table/cell/body")
+        -- TODO: remove
+        -- widget <- cell' ^. cellContents
+        -- let attrs = cell' ^. cellAttrs
+        -- return $(widgetFile "table/cell/body")
+        getTableWidget dbsCellTemplate cell' cellContents cellAttrs
 
       return $(widgetFile "table/colonnade")
 
diff --git a/src/Handler/Utils/Table/Pagination/Utils.hs b/src/Handler/Utils/Table/Pagination/Utils.hs
new file mode 100644
index 000000000..33e61dfde
--- /dev/null
+++ b/src/Handler/Utils/Table/Pagination/Utils.hs
@@ -0,0 +1,29 @@
+module Handler.Utils.Table.Pagination.Utils
+  ( getTableWidget
+  ) where
+
+import Import
+
+import Control.Lens (Getting, (^.))
+
+import Control.Monad.Writer ()
+
+-- getTableWidget :: forall (m :: * -> *) x a s. HandlerSite m ~ UniWorX => String -> s -> Getting (WriterT x m a) s (WriterT x m a) -> Getting [(Text, Text)] s [(Text, Text)] -> WriterT x m Widget
+getTableWidget :: (ToWidget site a, MonadIO m2, MonadThrow m2, MonadBaseControl IO m2, Monad m1, site ~ UniWorX) => String -> s -> Getting (m1 a) s (m1 a) -> Getting [(Text, Text)] s [(Text, Text)] -> m1 (WidgetT site m2 ())
+getTableWidget widgetName cell' cellContents cellAttrs = case widgetName of
+  "table/cell/course-teaser" -> do
+    -- TODO: get course and deconstruct here
+    let courseId = "courseId" :: Text
+        courseTitle = "Some courseTitle" :: Text
+        courseShorthand = "cTShort" :: Text
+        courseLecturer = "Some courseLecturer" :: Text
+        courseSchoolName = "Some courseSchoolname" :: Text
+        isRegistered = False
+        courseDescription = "Some courseDescription" :: Text
+        courseRegisterTo = "Some courseRegisterTo" :: Text
+    return $(widgetFile "table/cell/course-teaser")
+  _ -> do  -- defaults to "table/cell/body"
+    -- TODO: wip
+    widget <- cell' ^. cellContents
+    let attrs = cell' ^. cellAttrs
+    return $(widgetFile "table/cell/body")
diff --git a/templates/widgets/course-teaser/course-teaser.hamlet b/templates/table/cell/course-teaser.hamlet
similarity index 100%
rename from templates/widgets/course-teaser/course-teaser.hamlet
rename to templates/table/cell/course-teaser.hamlet
diff --git a/templates/table/cell/course-teaser.julius b/templates/table/cell/course-teaser.julius
new file mode 100644
index 000000000..c86caa94c
--- /dev/null
+++ b/templates/table/cell/course-teaser.julius
@@ -0,0 +1,25 @@
+var COURSE_TEASER_EXPANDED_CLASS = 'course--expanded';
+var COURSE_TEASER_CHEVRON_CLASS = 'course-chevron';
+
+document.addEventListener('DOMContentLoaded', function() {
+  var courseTeaserId = #{String courseId};
+  var courseTeaser = document.querySelector('#course-' + courseTeaserId);
+
+  courseTeaser.addEventListener('click', function(event) {
+    var isLink = event.target.tagName.toLowerCase() === 'a';
+    var isChevron = event.target.classList.contains(COURSE_TEASER_CHEVRON_CLASS);
+    var isExpanded = courseTeaser.classList.contains(COURSE_TEASER_EXPANDED_CLASS);
+
+    if ((!isExpanded && !isLink) || isChevron) {
+      courseTeaser.classList.toggle(COURSE_TEASER_EXPANDED_CLASS);
+    }
+  });
+
+  courseTeaser.addEventListener('keydown', function(event) {
+    var eventKey = event.key;
+    if (eventKey === ' ' || eventKey === 'Enter') {
+      event.preventDefault();
+      courseTeaser.classList.toggle(COURSE_TEASER_EXPANDED_CLASS);
+    }
+  });
+});
\ No newline at end of file
diff --git a/templates/widgets/course-teaser/course-teaser.lucius b/templates/table/cell/course-teaser.lucius
similarity index 100%
rename from templates/widgets/course-teaser/course-teaser.lucius
rename to templates/table/cell/course-teaser.lucius
diff --git a/templates/table/colonnade.hamlet b/templates/table/colonnade.hamlet
index 9ccea4ef8..fb4be4ba5 100644
--- a/templates/table/colonnade.hamlet
+++ b/templates/table/colonnade.hamlet
@@ -17,5 +17,4 @@ $newline never
         $forall row <- wRows
           <tr .table__row>
             $forall widget <- row
-              $# cell/body.hamlet
               ^{widget}
diff --git a/templates/table/course-table.hamlet b/templates/table/course-table.hamlet
new file mode 100644
index 000000000..9e52b134b
--- /dev/null
+++ b/templates/table/course-table.hamlet
@@ -0,0 +1,21 @@
+$newline never
+<div .scrolltable>
+  <table *{dbsAttrs'}>
+    $maybe wHeaders' <- wHeaders
+      <thead>
+        <tr .table__row.table__row--head>
+          $forall widget <- wHeaders'
+            $# cell/header.hamlet
+            ^{widget}
+    $nothing
+    <tbody>
+      $if null wRows && (dbsEmptyStyle == DBESHeading)
+        <td .table__row>
+          <td .table__td colspan=#{show columnCount}>
+            _{dbsEmptyMessage}
+      $else
+        $forall row <- wRows
+          <tr .table__row>
+            $forall widget <- row
+              $# cell/course-teaser.hamlet
+              ^{widget}
\ No newline at end of file