Skip to content

Instantly share code, notes, and snippets.

@NistorCristian

NistorCristian/search-ghost-authors.html

Last active February 7, 2019 08:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save NistorCristian/77e2ea1599bf2f29172ca2d471541306 to your computer and use it in GitHub Desktop.
Save NistorCristian/77e2ea1599bf2f29172ca2d471541306 to your computer and use it in GitHub Desktop.
Download ZIP
Search Ghost Authors
Raw
search-ghost-authors.html
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<title>Search Ghost Authors</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="pt-md-5 text-center">Authors</h1>
<form action="/">
<div class="form-group pt-md-3">
<input id="ghost-search-field" class="form-control">
</div>
<ul class="list-group" id="ghost-search-results"></ul>
</form>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
<script src="https://unpkg.com/@tryghost/content-api@1.0.0/umd/content-api.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/ghost-search@1.0.1/dist/ghost-search.min.js"></script>
<script type="text/javascript">
let ghostSearch = new GhostSearch({
host: 'https://demo.ghost.io', // replace with your Ghost admin url
key: '22444f78447824223cefc48062', // replace with your integration key
defaultValue: ' ',
options: {
keys: [
'name',
],
limit: 1000,
},
api: {
resource: 'authors',
parameters: {
fields: ['name', 'slug'],
},
},
template: function(result) {
let url = ghostSearch.host + '/ghost/#/team/';
return '<li class="list-group-item"><a href="' + url + result.slug + '/">' + result.name + '</a></li>';
},
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment