Git Product home page Git Product logo

theme-faq's Introduction

GitBook FAQ Theme

Theme for using GitBook to publish an FAQ or Knowledge Base. This theme works perfectly with search plugins (as the default one or algolia).

Usage

This theme requires GitBook version 3 or later.

Add the theme to your book's configuration (book.json):

{
    "plugins": [
        "theme-faq",
        "-fontsettings",
        "-sharing"
    ]
}

NOTE theme-faq is not compatible with plugins that modify the toolbar (since there is no toolbar). Embedded search will not work as a result. This includes the default plugins fontsettings and sharing that need to be disabled explicitly (add a minus flag "-" before each plugin parameter).

Add relations between articles

Suggestions for other articles can be shown at the bottom of an article.

Relationships are specified in the YAML frontmatter of a page:

---
related:
    - some/other/page.md
    - another_related_article.md

---

Content of my article!

Add logo to header

Extend the theme by creating a file _layouts/website/page.html in your book with:

{% extends template.self %}

{% block faq_header_brand %}
<img src="https://mywebsite.com/logo.png" height="30" />
{% endblock %}

Add navigation links to the header

Extend the theme by creating a file _layouts/website/page.html in your book with:

{% extends template.self %}

{% block faq_menu %}
<ul class="nav navbar-nav navbar-right">
    <li><a href="#">Contact us</a></li>
    <li><a href="#">Return to SuperWebsite</a></li>
</ul>
{% endblock %}

Add a short description on the home page

The content of your README is used as a short description for the home page of your FAQ.

If you wish use a specific file for this description instead of your project's README, you can configure your book.json to do so:

{
  "structure": {
     "readme": "home-page-description.md"
  }
}

theme-faq's People

Contributors

jaredmorgs avatar maxwebmecanik avatar reverland avatar samypesse avatar soreine avatar xldrkp avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

theme-faq's Issues

i18n not loaded

I created a folder _i18n/ in a language subfolder de/ and put a file inside called de.json. This file is a copy of en.json that comes with the theme-faq. Unfortunately, it is not loaded. But: If I change it from de.json to en.json in the same folder, the translations work. Could not find out, why it's not loaded, but the workaround helps at the moment.

Is theme-faq compatible with both Markdown and AsciiDoc?

I'm getting some issues with the related block not rendering in files and I suspect it is because it is expecting .md files not .adoc files.

Is it possible to make the FAQ compatible with AsciiDoc just as GitBook as a whole is?

Is it a matter of declaring gitbook.asciidoc in the template?

And adding in gitbook-asciidoc-css (or equivalent) into:

"devDependencies": {
    "gitbook-markdown-css": "^1.0.1",
    "less": "2.6.0",
    "less-plugin-clean-css": "^1.5.1"

Show a small "New" label for updated articles

We love the FAQ theme at Wingtra.com and use it for internal documentation, manuals. In house users requested to be able to see better, what content was updated or is new.

Would be nice to get gitbook to display an "updated" or "new" label next to articles which recently changed (e.g. last 4 weeks) and then disappears automatically again.

Could be as a plugin working with many gitbook themes or a theme function which you can turn on via config options of the theme.

Keep going guys!

gitbook_screenshot

Add logo header with a relative path

In the Add Logos to the header example,
everything works fine when I use a complete URL path, but I want to use a relative path.

I tried to put the image in the same folder as the page.html , but it did not work.
Any ideas on how to solve this?

Access to a whole section's articles

For now, the generated sections display up to 6 articles, while there can be more in a section.
We should allow to display a whole section's article by clicking on the section name.

Remove embedded CDN hosting

It appears that this theme is leveraging embedded CDN hosting for some CSS assets:

The problem with this is that if you are behind a proxy / firewall these requests will fail.

These dependencies should likely be installed via npm so that they can be served locally

Extension of the theme doesn't work when defining the content in another directory

I figured out that when you don't put the files in the root of the folder, the theme change doesn't take effect.

For reference, inside my book main folder I created an example folder, put all my markdown files there and set "root" : "./example_folder" in the books.json file. When I did this, all the modifications inside _layouts/website/page.html was ignored.

Subchapters are not Shown

If we have article and subarticles (chapter and subchapters) I offer to render all up to one level deep.
In the theme code I found:

<div class="list-group">
{% for article in part.articles %}
  {% if article.path != readme.file.path %}
  <a href="{{ article.path|resolveFile }}" class="list-group-item">
    <i class="fa fa-file-o" aria-hidden="true"></i> {{ article.title }}
  </a>
  {% endif %}
{% endfor %}
</div>

But for some reason this code doesn't work and subchapters are not rendered.
Possible result (with very bad design):
subchapters

You may even go more than one level deep it will be even better to have a wider choice.

Generation fails with empty summary entry

Summary.md

# Part 1
* [Intro](README.md)
* Empty entry

Error message is

error: error while generating page "README.md": 

Template render error: (/Users/nicolas/.gitbook/versions/3.2.2/node_modules/gitbook-plugin-search/_layouts/website/page.html)
  TypeError: Path must be a string. Received undefined

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.