Communauté francophone - Jimdo
Bienvenue sur le nouveau forum de discussion officiel de la communauté francophone des utilisateurs de Jimdo.

Ce forum annule et remplace le précédent forum Jimdo, qui a malheureusement dû être fermé pour raisons techniques.

Vous avez un ou plusieurs sites Jimdo ? Enregistrez vous sur le forum, posez vos questions et prenez part aux discussions !

Vous êtes simple visiteur ? Vous pouvez consulter nos pages, mais vous ne pourrez pas laisser de message.

Insertion d'une Timeline verticale

Aller en bas

Insertion d'une Timeline verticale

Message par rene.progin le Sam 31 Jan 2015 - 10:39

Bonjour,
J'aimerais pouvoir intégrer dans une page de mon site Jimdo une timeline horizontale.
J'ai découvert cette Timeline customisable, qui est vraiment excellente. http://codyhouse.co/gem/vertical-timeline/

Après avoir téléchargé le template de la timeline, j'ai téléchargé tous les fichiers css, js, etc. dans les "Fichiers" du site Jimdo (sous Design personnel), renommés pour être sûr qu'ils n'aient pas le même nom que le css du site Jimdo. Puis j'ai corrigé tous les liens dans le HTML pour qu'il retrouve bien les fichiers css et js.

J'ai ensuite copié toute la page HTML du template dans un Element HTML de Jimdo. Mon problème est que l'élément HTML continue, apparemment, de prendre le CSS général du site Jimdo.
http://www.noa-et-rene.ch/test1/html-testpage1/

Y a-t-il un moyen de forcer ce bloc HTML à ne pas prendre en compte le CSS du site, mais à utiliser celui qui est indiqué au début de son code?

Voici mon code HTML que je met dans l'élément HTML de Jimdo.
Code:

<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link href='http://fonts.googleapis.com/css?family=Droid+Serif|Open+Sans:400,700' rel='stylesheet' type='text/css'>

<link rel="stylesheet" href="http://u.jimdo.com/www69/o/sb020fc498ada2f53/userlayout/css/timelinereset.css?t=1422693842"> <!-- CSS reset -->
<link rel="stylesheet" href="http://u.jimdo.com/www69/o/sb020fc498ada2f53/userlayout/css/timelinestyle.css?t=1422693849"> <!-- Resource style -->
<script src="http://u.jimdo.com/www69/o/sb020fc498ada2f53/userlayout/js/timelinemodernizr.js?t=1422694088"></script> <!-- Modernizr -->
 
<title>Responsive Vertical Timeline</title>
</head>
<body2>


<section id="cd-timeline" class="cd-container">
<div class="cd-timeline-block">
<div class="cd-timeline-img cd-picture">
<img src="img/cd-icon-picture.svg" alt="Picture">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Title of section 1</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
<a href="#0" class="cd-read-more">Read more</a>
<span class="cd-date">Jan 14</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->

<div class="cd-timeline-block">
<div class="cd-timeline-img cd-movie">
<img src="img/cd-icon-movie.svg" alt="Movie">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Title of section 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi placeat iure tempora laudantium ipsa ad debitis unde?</p>
<a href="#0" class="cd-read-more">Read more</a>
<span class="cd-date">Jan 18</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->

<div class="cd-timeline-block">
<div class="cd-timeline-img cd-picture">
<img src="img/cd-icon-picture.svg" alt="Picture">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Title of section 3</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Excepturi, obcaecati, quisquam id molestias eaque asperiores voluptatibus cupiditate error assumenda delectus odit similique earum voluptatem doloremque dolorem ipsam quae rerum quis. Odit, itaque, deserunt corporis vero ipsum nisi eius odio natus ullam provident pariatur temporibus quia eos repellat consequuntur perferendis enim amet quae quasi repudiandae sed quod veniam dolore possimus rem voluptatum eveniet eligendi quis fugiat aliquam sunt similique aut adipisci.</p>
<a href="#0" class="cd-read-more">Read more</a>
<span class="cd-date">Jan 24</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->

<div class="cd-timeline-block">
<div class="cd-timeline-img cd-location">
<img src="img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Title of section 4</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
<a href="#0" class="cd-read-more">Read more</a>
<span class="cd-date">Feb 14</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->

<div class="cd-timeline-block">
<div class="cd-timeline-img cd-location">
<img src="img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Title of section 5</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum.</p>
<a href="#0" class="cd-read-more">Read more</a>
<span class="cd-date">Feb 18</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->

<div class="cd-timeline-block">
<div class="cd-timeline-img cd-movie">
<img src="img/cd-icon-movie.svg" alt="Movie">
</div> <!-- cd-timeline-img -->

<div class="cd-timeline-content">
<h2>Final Section</h2>
<p>This is the content of the last section</p>
<span class="cd-date">Feb 26</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->
</section> <!-- cd-timeline -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://u.jimdo.com/www69/o/sb020fc498ada2f53/userlayout/js/timelinemain.js?t=1422694078"></script> <!-- Resource jQuery -->
</body2>
</html>


rene.progin

Messages : 1
Date d'inscription : 31/01/2015

http://noa-et-rene.ch

Revenir en haut Aller en bas

Re: Insertion d'une Timeline verticale

Message par FredVig le Jeu 19 Fév 2015 - 15:01

Placez le contenu de la CSS nouvelle à l'intérieur de la CSS jimdo, et modifiez le nom de la CSS que vos autre fichier externes doivent aller chercher ?

_________________
'Expert' Jimdo affilié, bénévole du forum et indépendant rémunéré par mes clients.
avatar
FredVig

Messages : 2064
Date d'inscription : 07/10/2014

http://fredvig.com

Revenir en haut Aller en bas

Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum