diff --git a/packages/create-app/templates/default-app/packages/app/src/components/search/SearchPage.tsx b/packages/create-app/templates/default-app/packages/app/src/components/search/SearchPage.tsx
index 7b3c2b29d4..50ffbadb76 100644
--- a/packages/create-app/templates/default-app/packages/app/src/components/search/SearchPage.tsx
+++ b/packages/create-app/templates/default-app/packages/app/src/components/search/SearchPage.tsx
@@ -2,10 +2,13 @@ import React from 'react';
 import { makeStyles, Theme, Grid, List, Paper } from '@material-ui/core';
 
 import { CatalogResultListItem } from '@backstage/plugin-catalog';
+import { DocsResultListItem } from '@backstage/plugin-techdocs';
+
 import {
   SearchBar,
   SearchFilter,
   SearchResult,
+  SearchType,
   DefaultResultListItem,
 } from '@backstage/plugin-search';
 import { Content, Header, Page } from '@backstage/core-components';
@@ -39,6 +42,11 @@ const SearchPage = () => {
           </Grid>
           <Grid item xs={3}>
             <Paper className={classes.filters}>
+              <SearchType
+                values={['techdocs', 'software-catalog']}
+                name="type"
+                defaultValue="software-catalog"
+              />
               <SearchFilter.Select
                 className={classes.filter}
                 name="kind"
@@ -64,6 +72,13 @@ const SearchPage = () => {
                             result={document}
                           />
                         );
+                      case 'techdocs':
+                        return (
+                          <DocsResultListItem
+                            key={document.location}
+                            result={document}
+                          />
+                        );
                       default:
                         return (
                           <DefaultResultListItem
diff --git a/packages/create-app/templates/default-app/packages/backend/src/plugins/search.ts b/packages/create-app/templates/default-app/packages/backend/src/plugins/search.ts
index 7fc317d23d..5f8ac204ba 100644
--- a/packages/create-app/templates/default-app/packages/backend/src/plugins/search.ts
+++ b/packages/create-app/templates/default-app/packages/backend/src/plugins/search.ts
@@ -6,6 +6,7 @@ import {
 } from '@backstage/plugin-search-backend-node';
 import { PluginEnvironment } from '../types';
 import { DefaultCatalogCollator } from '@backstage/plugin-catalog-backend';
+import { DefaultTechDocsCollator } from '@backstage/plugin-techdocs-backend';
 
 export default async function createPlugin({
   logger,
@@ -17,12 +18,19 @@ export default async function createPlugin({
   const indexBuilder = new IndexBuilder({ logger, searchEngine });
 
   // Collators are responsible for gathering documents known to plugins. This
-  // particular collator gathers entities from the software catalog.
+  // collator gathers entities from the software catalog.
   indexBuilder.addCollator({
     defaultRefreshIntervalSeconds: 600,
     collator: DefaultCatalogCollator.fromConfig(config, { discovery }),
   });
 
+
+  // collator gathers entities from techdocs.
+  indexBuilder.addCollator({
+    defaultRefreshIntervalSeconds: 600,
+    collator: DefaultTechDocsCollator.fromConfig(config, { discovery, logger }),
+  });
+
   // The scheduler controls when documents are gathered from collators and sent
   // to the search engine for indexing.
   const { scheduler } = await indexBuilder.build();