> For the complete documentation index, see [llms.txt](https://help.shopifas.com/manual/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.shopifas.com/manual/website/help.naviplus.io/development/add-walk-through-to-navi+.md).

# Add walk-through to Navi+

You’ll need to use a library like TourGuideJS, a JavaScript library that can be embedded into your website to add step-by-step walkthrough guides through an attribute format like \<div data-tg-tour="\<span>My first tour\</span>"> ... \</div>. It’s completely free. Follow the instructions below to add walkthroughs through the Navi+ menus, either for the entire menu or for individual menu items.

<figure><img src="/files/hZdarG9ivOIOgIxUhBTl" alt=""><figcaption></figcaption></figure>

```
<!-- Navi+ insert Tour Guide library --->
<script src="https://unpkg.com/@sjmc11/tourguidejs/dist/tour.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://unpkg.com/@sjmc11/tourguidejs/dist/css/tour.min.css">
 
<script>
  setTimeout(function() {
      const tg = new tourguide.TourGuideClient();
      tg.start();        
  }, 2000);
</script>
<!-- Navi+ insert Tour Guide library --->
```

<figure><img src="/files/Q53tiUTf8hPsaRMTCjiv" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/UVYgt49IQ3roeCmjvBmh" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/9A91g4IdgsyuZsAHFhoZ" alt=""><figcaption></figcaption></figure>
