Skip to content

Getting Started

Jonas Gossens edited this page May 23, 2019 · 5 revisions

Before you start using our API, we recommend you to start with some preparations. The following will help you to set up your index.html in a proper way and allow you an easy start.

  • Include the .css file at the end of your head tag. This allows you to use the styles that are used in our Tapps and provides you with a uniform design on all devices.
  • Include the .js file at the end of your body tag. This script is required for some style ( e.g. accordion ) and offers some useful functions in addition.
  • Include the Meta-Tags at the start of your head tag. The viewport meta-tag is responsible for the sizing of your Tapp. It automatically resizes it to your viewport size and guarantees a perfect integration into your app/website.
<!DOCTYPE html>
<html>
 <head>
  <!--Add Meta-Tags for scaling etc.-->
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1, maximum-scale=1"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <meta charset="utf-8">

  <title>Tapp</title>

  <!--Load the chayns styles-->
  <link rel="stylesheet" href="https://api.chayns.net/css/v4.2/">
 </head>
 <body>
 
 <div class="tapp">
 
   <div class="tapp__intro">
   </div>
 
   <div class="tapp__content">
   </div>
 
 </div>

  <!--Load the js chayns API-->
  <script src="https://api.chayns-static.space/js/v4.0/chayns.min.js"></script>
 </body>
</html>

If you are looking for a uniform design similar to our usual tapps, you can use the class structure set up in the code snippet. See more at our wiki entry about container classes.

Clone this wiki locally