Seguramente en algún punto de tu vida hayas querido empezar tu propio blog, en donde puedas compartir tus experiencias, conocimiento o cualquier cosa la cual te motive a escribir.

Hay muchas formas de poder empezar a escribir un blog, de las cuales hay tanto como beneficios, como desventajas, entre lo más popular encontramos WordPress, Medium, y Jekyll. Yo personalmente prefiero Ghost (Una poderosa plataforma dedicada solo a blogging).

En este artículo yo asumo que tú ya tienes conocimiento sobre Ghost, si no es así, puedes empezar con esta introducción, también te recomiendo: Cómo crear un blog desde cero con Ghost en DigitalOcean por Carlos Azaustre.

Ahora que ya conoces Ghost y como funciona, seguramente en algún momento vas a necesitar de algún buscador, esto con el propósito de que tus usuarios puedan buscar artículos de una forma mucho más fácil.

Para ello te presento GhostHunter el cual le permite a cualquier desarrollador agregar capacidades de búsqueda en su blog. A pesar de que GhostHunter fue diseñado específicamente para Ghost, este funcionará en cualquier sistema que utilice RSS.

Como usar GhostHunter

Antes de usar GhostHunter, debemos incluir JQuery:

<script src="js/jquery.min.js"></script>

Podemos descargar JQuery desde su página o usar Hosted Libraries de Google.

Una vez que ya este JQuery, ahora si podemos incluir GhostHunter:

<script src="js/jquery.ghostHunter.min.js"></script>

Puedes descargar GhostHunter desde su repositorio en Github.

Ahora en nuestro tema debemos tener un form que tenga dentro lo siguiente:

<form>  
  <input id="search-field" /> <!-- Input -->
  <input type="submit" value="search"> <!-- Botón de búsqueda -->
</form>

También es necesario un espacio para nuestros resultados y puede ser un div, article, section o cualquier etiqueta que nosotros queramos, lo importante es que tenga un ID para que lo identifiquemos:

<section id="results"></section>

Finalmente, solo queda activar el plugin:

$("#search-field").ghostHunter({
  results   : "#results" // ID de nuestro section
});

Una vez que ya tenemos todo esto, el motor de búsqueda debería funcionar.

Más opciones

Con GhostHunter no solo estamos limitados a lo que vimos en un principio, podemos agregar más opciones dependiendo de nuestras necesidades.

Incluir las páginas estáticas en la búsqueda

Si queremos que en nuestros resultados también se filtren las páginas estáticas solo basta que agreguemos includepages como true.

$("#search-field").ghostHunter({
    results         : "#results",
    includepages    : true
});

Resultados al mismo tiempo que escribimos

En el cazo de que nosotros queramos que los resultados de la búsqueda aparezcan al mismo tiempo que escribimos, solo agregamos onKeyUp como true:

$("#search-field").ghostHunter({
    results         : "#results",
    onKeyUp         : true 
});

Personalizar los resultados

Si necesitamos cambiar la forma en que nos arroga los resultados (creando una plantilla), lo podemos hacer con el siguiente código:

$("#search-field").ghostHunter({
    results         : "#results",
    result_template : "<a href='{{link}}'><p><h2>{{title}}</h2><h4>{{pubDate}}</h4>{{description}}</p></a>"
});

En result_template agregamos la forma en que queremos que aparezcan los resultados:

• link: Muestra el enlace de nuestro artículo.
• title: El título de nuestro artículo.
• pubDate: La Fecha de publicación de nuestro artículo.
• description: La descripción de nuestro artículo.

¿Qué sigue?

Ahora solo queda que llenes de artículos y contenido tu blog para que así tu motor de búsqueda pueda mostrar más y distintos resultados.

Si quieres saber más sobre este buscador te dejo el repositorio.