index.html

---
layout: default
---
<!-- Carousel -->
  <div class="row-fluid">
    <div id="myCarousel" class="carousel slide">
      <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
        <li data-target="#myCarousel" data-slide-to="3"></li>
      </ol>
      <div class="carousel-inner">
        <div class="item active">
          <img src="/img/carousel/carousel1.png">
          <div class="carousel-caption">
            <h2 style="font-weight:bold">Seul face au code?</h2>
            <a href="/candidats"><button type="button" class="btn btn-default btn-md">Rejoins-nous!</button></a>
          </div>
        </div>
        <div class="item">
          <img src="/img/carousel/carousel3.png">
          <div class="carousel-caption">
            <h2 style="font-weight:bold">Tu as un projet</h2>
            <a href="/projets-des-eleves"><button type="button" class="btn btn-default btn-md">Parlons-en!</button></a>
          </div>
        </div>
        <div class="item">
          <img src="/img/carousel/carousel4.png">
          <div class="carousel-caption">
            <h2 style="font-weight:bold">Latin? Hiéroglyphe?</h2>
            <a href="/programme"><button type="button" class="btn btn-default btn-md">Viens décrypter!</button></a>
          </div>
        </div>
        <div class="item">
          <img src="/img/carousel/carousel2.png">
          <div class="carousel-caption">
            <h2 style="font-weight:bold"></h2>
            <a href="http://wildhackathon.fr/" target="_blank"><button type="button" class="btn btn-default btn-md">Venez Participer!</button></a>
          </div>
        </div>
      </div>
      <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
      <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
    </div>
  </div>

<!-- Trois -->
  <div class="trois">
    <div class="sheandytroischiffres">
      <div class="container">
        <div class="row-fluid">
          <div class="col-xs-4 text-center"><p>30</p></div>
          <div class="col-xs-4 text-center"><p>1h30</p></div>
          <div class="col-xs-4 text-center"><p>5</p></div>
        </div>
      </div>
    </div>
    <div class="troischiffres">
      <div class="container">
        <div class="row-fluid">
          <div class="col-xs-4 text-center"><p>Élèves</p></div>
          <div class="col-xs-4 text-center"><p>de Paris</p></div>
          <div class="col-xs-4 text-center"><p>mois</p></div>
        </div>      
      </div>
    </div>
  </div>

<!-- Intro -->
  <div class="container">
    <div class="page-header">
      <h1 class="text-center"><strong>Première école numérique au vert !</strong></h1>
    </div>
      <p class="lead">Installée au coeur du Parc naturel régional du Perche, dans un cadre propice à la créativité et à l'innovation, l'école numérique Wild Code School propose une formation intensive au développement web et mobile doublée d'un accompagnement vers l'entreprenariat numérique et l'insertion professionnelle.</p>
  </div>

<!-- Évenements -->
  <div class="evenements-a-venir">
    <div class="container">
      <div class="page-header">
          <h2 class="text-center"><strong>Évenements @ venir</strong></h2>
      </div>
      <div class="row">
        {% for evenement in site.data.evenements-accueil limit:3 %}
          <div class="col-xs-7 text-right">
            <h4><strong>{{ evenement.date }}</strong><br>{{ evenement.nom }}</h4>
          </div>          
          <div class="col-xs-5">
            <a href="{{ evenement.URL }}" target="_blank">
              <button type="button" class="btn btn-vert btn-sm" style="margin-top: 15px">
              J'y participe <span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span>
              </button>
            </a>
          </div>
        {% endfor %}
      </div>
    </div>
  </div>

<!-- Newsletter -->
  <div class="container">
    <br>
    <h3 class="text-center">Abonnez-vous à notre newsletter & suivez notre actualité</h3>
      <div class="col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
        <br>

        <div class="newsletter-index">
          <!-- Begin MailChimp Signup Form -->
            <link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">

<!-- TODO CLEAN inline CSS -->

            <style type="text/css">
              #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
              /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
                 We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
            </style>

<!-- TODO CLEAN inline CSS -->

            <div id="mc_embed_signup center-block">
            <form action="//wildcodeschool.us9.list-manage.com/subscribe/post?u=96febc44633f56b33d2d61134&amp;id=bf97c37c40" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
            <div id="mc_embed_signup_scroll">

              <input type="email" value="" name="EMAIL" class="email news-email" id="mce-EMAIL" placeholder="Votre email" required>
                <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
                <div style="position: absolute; left: -5000px;"><input type="text" name="b_96febc44633f56b33d2d61134_bf97c37c40" tabindex="-1" value=""></div>

              <button type="submit" name="subscribe" id="mc-embedded-subscribe" class="btn btn-info news-valider center-block"><span class="glyphicon glyphicon-send"></span></button>

            </div>
            </form>
            </div>

            <!--End mc_embed_signup-->

        </div>

       <!--  <form>
          <div class="input-group input-group-mg">
            <input type="text" class="form-control" id="exampleInputAmount" placeholder="Votre Email">
            <span class="input-group-btn">
              <button type="submit" class="btn btn-info center-block">Valider <span class="glyphicon glyphicon-send"></span></button>
            </span>
          </div>
        </form> -->
      </div>
  </div>

<!-- Ce qu'ils disent de nous -->
  <div class="disent-de-nous">
    <div class="container">
      <div class="page-header">
        <h2 class="text-center">Ce qu'ils disent de nous</h2>
      </div>
      <div class="row">
        <div class="col-xs-4 text-right">
          <img src="./img/portraits/promo-2014/EmmBUS.jpg" class="avatar img-circle img-responsive center-block">
        </div>
        <div class="col-xs-8 text-right">
          <h4>
            <img src="./img/quotes/right-32.png" class="quote-left">
              Suite à des problèmes de santé, j'ai dû envisager une nouvelle orientation professionnelle. J'étais boulangère, je deviens codeuse. J'ai toujours aimé l'informatique. On m'a parlé de l'école. J'ai tenté ma chance. Tout se passe bien. J'envisage l'avenir avec plein d'idées.
            <img src="./img/quotes/left-32.png" class="quote-right"></h4>
            <h4>#Emmanuelle 42 ans, Élève @ WCS</h4>
        </div>
      </div>
      <br>
      <div class="row">
        <div class="col-xs-8">
          <h4>
            <img src="./img/quotes/right-32.png" class="quote-left">
              Quand on m'a dit "Une école vient d'ouvrir, ça à l'air super, c'est dans le Perche...", j'étais un peu sceptique. Mais finalement, le calme, le cadre favorisent la concentration, le travail. Nous formons une petit famille au vert!
            <img src="./img/quotes/left-32.png" class="quote-right"></h4>
            <h4>#Florian 19 ans, Élève @ WCS </h4>
        </div>
        <div class="col-xs-4 text-left">
          <img src="./img/portraits/promo-2014/FloDEL.jpg" class="avatar img-circle img-responsive center-block">
        </div>
      </div>
      <br>
      <div class="row">
        <div class="col-xs-4 text-right">
          <img src="./img/portraits/promo-2014/BenCHE.jpg" class="avatar img-circle img-responsive center-block">
        </div>
        <div class="col-xs-8 text-right">
          <h4>
            <img src="./img/quotes/right-32.png" class="quote-left">
              La formation proposée m'a tout de suite attiré. On ne trouve pas à la fac ce type d'enseignement. On utilise des technologies récentes telles que meteor. La formation est courte et intense ; elle est aussi très concrète. J'avais besoin des compétences techniques que j'acquiers ici.
            <img src="./img/quotes/left-32.png" class="quote-right"></h4>
            <h4>#Benjamin 29 ans, Élève @ WCS </h4>
        </div>
      </div>      
    </div>
  </div>

<!-- Ils parlent de nous -->
  <div class="container">
    <div class="page-header">
      <h2 class="text-center">Ils parlent de nous</h2>
    </div>
    <div class="row">
      <div class="col-lg-8">
        <video poster="http://wildcodeschool.fr/wp-content/uploads/2015/01/pochette-TF1-OK.jpg" width="100%" height="100%" controls="controls" type="video/mp4" ><source src="http://wildcodeschool.fr/wp-content/uploads/2014/12/Journal-TF1-WildCodeSchool-REDUCE.mp4"></video>
      </div>  
      <div class="col-lg-4"> 
        <br>
        <ul class="list-inline ilsparlentdenous text-center">
          <li><img src="./img/logos/challenges.png"></li>
          <li><img src="./img/logos/eureetloir.png"></li>
          <li><img src="./img/logos/europe1.png"></li>
          <li><img src="./img/logos/logo-france3.png"></li>
          <li><img src="./img/logos/franceculture.png"></li>
          <li><img src="./img/logos/franceinter.png"></li>
          <li><img src="./img/logos/lacroix.png"></li>
          <li><img src="./img/logos/lechapee.png"></li>
          <li><img src="./img/logos/lecho.png"></li>
          <li><img src="./img/logos/lefigaro.png"></li>
          <li><img src="./img/logos/leperche.jpg"></li>
          <li><img src="./img/logos/lepoint.png"></li>
          <li><img src="./img/logos/observateur.png"></li>
          <li><img src="./img/logos/radiointensite.jpg"></li>
          <li><img src="./img/logos/sweetfm.png"></li>
          <li><img src="./img/logos/tf1.jpg"></li>
          <li><img src="./img/logos/virginradio.png"></li>
        </ul>
      </div>
    </div>
  </div>

  <!-- Blog -->
  <div class="container">
    <div class="page-header">
      <h2 class="text-center">Les derniers articles du blog</h2>
    </div>
    <div class="row">
      {% for post in site.posts limit:3 %}
        <div class="col-sm-4 blog-accueil">
          <div class="titre">
            <a href="{{ post.url }}"><p class="text-center"><strong>{{ post.title }}</strong></p></a>
          </div>
          <div class="article-img">
            <a href="{{ post.url }}">{{ post.excerpt }}</a>
          </div>
          <div class="article">
            <a href="{{ post.url }}"><p>{{ post.content | strip_html | truncatewords:60 }}</p></a>
          </div>
        </div>
      {% endfor %}
    </div>
  </div>



<!-- Démarrage automatique du Carousel -->
  <script type="text/javascript">
    $(document).ready(function() { 
    $('#myCarousel').carousel({ interval: 5000, cycle: true });
     }); 
  </script>