TimelineJS/website/templates/_help.html

<section id="help" class="container">
  <h2>Help</h2>
  <p>Have a question? Look for it in the FAQ below. No luck there? Try the <a href="https://knightlab.zendesk.com/forums/22551396-TimelineJS" target="_blank">support forum</a>.</p>
  <div class="row">
    <div class="span12">
      <div id="accordion-faq" class="accordion">
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-02" class="accordion-toggle collapsed">What browsers does TimelineJS support?</a></div>
            <div id="faq-02" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner"><p>All modern browsers are supported as well as Internet Explorer 8 and above.</p><p>If you run into problems with IE8, IE9 or IE10 and get a error message saying IE7 is not supported, it may be because you are running the browser in IE7 compatibility mode. Here are <a href="http://www.sevenforums.com/tutorials/1196-internet-explorer-compatibility-view-turn-off.html">directions on how to change the compatibility mode</a>.</p></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-03" class="accordion-toggle collapsed">Why is my timeline not displaying or why is it stuck at the parsing data screen?</a></div>
            <div id="faq-03" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">If you&#x27;re using a Google Spreadsheet as your source, make sure your Google spreadsheet is public and published. Also make sure you don&#x27;t have any empty rows in the spreadsheet since this can sometimes cause problems.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-04" class="accordion-toggle collapsed">How many entries will work best in TimelineJS?</a></div>
            <div id="faq-04" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Timeline is optimized for 20-30 entries. If you have more entries, you run a risk of slow loading times, so test and make sure you are satisfied, or edit your timeline into less entries or a series of smaller timelines. La Naci&oacute;n created a <a href="http://blogs.lanacion.com.ar/data/herramientas/todos-los-papas-en-un-timeline-js/">timeline of all of the popes</a> with over 250 entries.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-05" class="accordion-toggle collapsed">How do I change the height of the timeline?</a></div>
            <div id="faq-05" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner"><a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/how-to/qSPDO2iJt34%5B1-25%5D">See here.</a></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-06" class="accordion-toggle collapsed">How do I embed audio or video?</a></div>
            <div id="faq-06" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner"><a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/how-to/51D-CgbAcg0%5B1-25%5D">See here.</a></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-07" class="accordion-toggle collapsed">Can I change the TimelineJS font?</a></div>
            <div id="faq-07" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner"><a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/how-to/EAaBttHnF-g%5B1-25%5D">See here.</a></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-08" class="accordion-toggle collapsed">How do I hide the bottom timeline?</a></div>
            <div id="faq-08" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">If this is your end goal it may be easier for you to use a slider tool rather than TimelineJS. Here are <a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/how-to/QyAxN2qLP0Y%5B1-25%5D">some</a> <a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/feature-request/S00FJp9uFds%5B1-25%5D">ways</a> you can remove the timeline bar.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-09" class="accordion-toggle collapsed">How do I use TimelineJS with Wordpress?</a></div>
            <div id="faq-09" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner"><p>There is a <a href="https://github.com/VeriteCo/Timeline-Wordpress-Plugin">plugin for Wordpress</a>.</p><p>Here is a link with <a href="http://wordpress.org/support/topic/plugin-verite-timeline-getting-wordpress-posts-into-timeline">some coding instructions.</a></p><p>If the Wordpress plugin is out of date you can use the <a href="#embed">iFrame embed method</a></p></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-10" class="accordion-toggle collapsed">Why aren&#x27;t there thumbnails on my events?</a></div>
            <div id="faq-10" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Thumbnails are only shown from Flickr, Youtube, Vimeo etc. That was done for performance reasons. Having a very large image file as a thumbnail really slows down the timeline. Flickr, Youtube etc have actual thumbnail sized images that can be used that don&#x27;t cause performance issues. You can also create your own thumbnails.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-12" class="accordion-toggle collapsed">Can TimelineJS be set up with time denominators other than calendar dates?</a></div>
            <div id="faq-12" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Yes. See <a href="https://groups.google.com/forum/?hl=en&fromgroups#!category-topic/verite-timeline/hOfQwmzXA30[1-25]">here for a hacking idea</a>.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-13" class="accordion-toggle collapsed">Can I change the vertical position of an event in TimelineJS?</a></div>
            <div id="faq-13" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Yes. See <a href="https://groups.google.com/forum/?fromgroups#!category-topic/verite-timeline/how-to/FB8u56wFAsE">here for how</a>.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-14" class="accordion-toggle collapsed">Why does the timeline not show days or hours etc?</a></div>
            <div id="faq-14" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">The display of the timeline is dynamic. It chooses a time interval that best matches the number of events there are with the amount of time that is covered.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-21" class="accordion-toggle collapsed">What are tags?</a></div>
            <div id="faq-21" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Tags are essentially categories. You can have up to 6 of them to categorize events on the timeline. The events on the timeline will align with their category row. <em>See the screenshot below</em> <br/><img src="{{ static_url }}/img/TimelineJSTags.jpg"></div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-15" class="accordion-toggle collapsed">Is it possible to have more than 6 tags?</a></div>
            <div id="faq-15" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Not at the moment.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-16" class="accordion-toggle collapsed">Can I change the number of rows on the timeline?</a></div>
            <div id="faq-16" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">The default number of rows is 3. If you are using tags and you have more than 3 tags, the number of rows increases to 6.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-17" class="accordion-toggle collapsed">Why does the event display Month instead of Month, Day?</a></div>
            <div id="faq-17" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">If the event is on the first day of the month and no time is specified it shows only the month. The same is true for year. If the event date is the first day of the first month of the year, it only shows the year.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-18" class="accordion-toggle collapsed">Can I use an Excel spreadsheet instead of Google Spreadsheets?</a></div>
            <div id="faq-18" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">No, but it&#x27;s pretty easy to copy rows into a Google Spreadsheet. TimelineJS uses Google&#x27;s API to access the data from the Google Spreadsheet and turns it into native TimelineJS json.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-19" class="accordion-toggle collapsed">Can I use a database as the data source for TimelineJS?</a></div>
            <div id="faq-19" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Yes. JSON is the best and safest format for feeding information into TimelineJS from a database. Just use your language of choice to create a json file from your database.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-20" class="accordion-toggle collapsed">Can my language be added?</a></div>
            <div id="faq-20" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">Yes! Just grab a copy of <a href="https://github.com/VeriteCo/StoryJS-Core/blob/master/Language/locale/en.js">the template</a> and replace the language with the language you want to create. You can find your language&#x27;s <a href="http://spreadsheets.google.com/pub?key=p9pdwsai2hDMsLkXsoM05KQ&gid=1">two letter code</a> here. Save the file and post it to the Google Group or you can do a pull request on GitHub.</div>
            </div>
          </div>
          <div class="accordion-group">
            <div class="accordion-heading"><a data-toggle="collapse" data-parent="#accordion-faq" href="#faq-22" class="accordion-toggle collapsed">How do I add B.C. dates?</a></div>
            <div id="faq-22" style="height: 0px;" class="accordion-body collapse">
              <div class="accordion-inner">You can add dates that are B.C. by using negative years. For example, -100 would be 100 B.C.</div>
            </div>
          </div>
      </div>
    </div>
  </div>
</section>