|
33 | 33 | Initial setup Search depends on additional output content type of JSON in config.toml ``` [outputs] home = [“HTML”, “JSON”] ```"> |
34 | 34 | <meta property="og:locale" content="cn"> |
35 | 35 | <meta property="og:type" content="article"> |
36 | | - <meta property="article:section" content="notes"> |
| 36 | + <meta property="article:section" content="search"> |
37 | 37 | <meta property="article:published_time" content="2010-06-08T08:06:25+06:00"> |
38 | 38 | <meta property="article:modified_time" content="2010-06-08T08:06:25+06:00"> |
39 | 39 |
|
|
77 | 77 | </script> |
78 | 78 | </head> |
79 | 79 |
|
80 | | - <body class="type-notes kind-page" data-spy="scroll" data-target="#TableOfContents" data-offset="80"> |
| 80 | + <body class="type-search kind-page" data-spy="scroll" data-target="#TableOfContents" data-offset="80"> |
81 | 81 | <div class="container-fluid bg-secondary wrapper"> |
82 | 82 |
|
83 | 83 |
|
|
244 | 244 | </form> |
245 | 245 | <div class="sidebar-tree"> |
246 | 246 | <ul class="tree" id="tree"> |
247 | | - <li id="list-heading"><a href="/cn/notes" data-filter="all">Notes</a></li> |
| 247 | + <li id="list-heading"><a href="/cn/search" data-filter="all">Search</a></li> |
248 | 248 | <div class="subtree"> |
249 | 249 |
|
250 | 250 |
|
|
258 | 258 |
|
259 | 259 |
|
260 | 260 |
|
| 261 | +<script> |
| 262 | + document.body.classList.replace('kind-page', 'kind-section'); |
| 263 | +</script> |
261 | 264 | <section class="content-section" id="content-section"> |
262 | 265 | <div class="content container-fluid" id="content"> |
263 | | - <div class="container-fluid note-card-holder" id="note-card-holder"> |
264 | | - <p>This file exists solely to respond to /search URL with the related <code>search</code> layout template.</p> |
265 | | -<p>No content shown here is rendered, all content is based in the template layouts/page/search.html</p> |
266 | | -<p>Setting a very low sitemap priority will tell search engines this is not important content.</p> |
267 | | -<p>This implementation uses Fusejs and mark.js</p> |
268 | | -<h2 id="initial-setup">Initial setup</h2> |
269 | | -<p>Search depends on additional output content type of JSON in config.toml |
270 | | -``` |
271 | | -[outputs] |
272 | | -home = [“HTML”, “JSON”] |
273 | | -```</p> |
274 | | -<h2 id="searching-additional-fileds">Searching additional fileds</h2> |
275 | | -<p>To search additional fields defined in front matter, you must add it in 2 places.</p> |
276 | | -<h3 id="edit-layouts_defaultindexjson">Edit layouts/_default/index.JSON</h3> |
277 | | -<p>This exposes the values in /index.json |
278 | | -i.e. add <code>category</code> |
279 | | -``` |
280 | | -… |
281 | | -“contents”:{{ .Content | plainify | jsonify }} |
282 | | -{{ if .Params.tags }}, |
283 | | -“tags”:{{ .Params.tags | jsonify }}{{end}}, |
284 | | -“categories” : {{ .Params.categories | jsonify }}, |
285 | | -… |
286 | | -```</p> |
287 | | -<h3 id="edit-fusejs-options-to-search">Edit fuse.js options to Search</h3> |
288 | | -<p><code>assets/scripts/pages/search.js</code> |
289 | | -``` |
290 | | -keys: [ |
291 | | -“title”, |
292 | | -“contents”, |
293 | | -“tags”, |
294 | | -“categories” |
295 | | -] |
296 | | -```</p> |
| 266 | + <div class="container-fluid post-card-holder" id="post-card-holder"> |
| 267 | + <div id="search-results" style="display: flex; flex-wrap: wrap;"> |
| 268 | + |
| 269 | + <script id="search-result-template" type="text/x-js-template"> |
| 270 | + <div class="post-card"> |
| 271 | + <div class="card"> |
| 272 | + <div class="card-head"> |
| 273 | + <a href="${link}" class="post-card-link"> |
| 274 | + <img class="card-img-top" src="${hero}" alt="Card Heading Image"> |
| 275 | + </a> |
| 276 | + </div> |
| 277 | + <div class="card-body"> |
| 278 | + <a href="${link}" class="post-card-link"> |
| 279 | + <h5 class="card-title">${title}</h5> |
| 280 | + <p class="card-text post-summary">${summary}</p> |
| 281 | + </a> |
| 282 | + |
| 283 | + <div class="tags"> |
| 284 | + <ul style="padding-left: 0;"> |
| 285 | + ${tags} |
| 286 | + </ul> |
| 287 | + </div> |
| 288 | + |
| 289 | + </div> |
| 290 | + <div class="card-footer"> |
| 291 | + <span class="float-left">${date}</span> |
| 292 | + <a href="${link}" class="float-right btn btn-outline-info btn-sm">Read</a> |
| 293 | + </div> |
| 294 | + </div> |
| 295 | + </div> |
| 296 | + </script> |
297 | 297 |
|
| 298 | + </div> |
298 | 299 | </div> |
299 | 300 | </div> |
300 | 301 | </section> |
|
0 commit comments