11548 sujets

JavaScript, DOM et API Web HTML5

Créer un module prestashop avec du javascript et html

Bonjour à toutes et à tous,

Voilà mon problème, je suis en train de créer mon site sur prestashop et j'aimerais ajouter sur ma page d'accueil une bannière personnalisée comme celle que l'on peut voir sur ce site : http://www.bankfashion.co.uk/home (bannière homme / femme)
J'ai récupéré le code en local et la bannière marche très bien. Il s'agit de javascript et de html.
Bref jusque là tout va bien!
Cependant, impossible de trouver la façon de l'intégrer dans ma page d'acceil en dessous du header.
Mettre le code tel quel dans le header tpl me fait disparaitre la totalité du contenu de ma page, j'ai essayé aussi dans le index, ca ne marche pas.
Et j'ai même éssayer la création d'un module mais là je bloque sur la création du fichier php et tpl parce que j'ai du javascript et je ne sais pas ou le mettre.

Si quelqu'un a une idée, je serais ravie de pouvoir l'entendre...Please

Merci à tous Smiley cligne

PS : le contenu de mon fichier tpl est conçu ainsi et ca ne marche pas

<head>
<script type="text/javascript" src="http://www.pili-piment.fr/themes/prestashop_new/js/jquery.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(function () {
jQuery('.top .women').hover(
function () {
jQuery(this).stop(false, false).animate({width:'570px'}, 600);
jQuery('img', this).stop(false, false).animate({left:'0px'}, 600);
jQuery('.top .men').stop(false, false).animate({width:'370px'}, 600);
jQuery('.top .men img').stop(false, false).animate({left:'-80px'}, 600);},
function () {
jQuery(this).stop(false, false).animate({width:'470px'}, 600);
jQuery('img', this).stop(false, false).animate({left:'-70px'}, 600);
jQuery('.top .men').stop(false, false).animate({width:'470px'}, 600);
jQuery('.top .men img').stop(false, false).animate({left:'-40px'}, 600);});
jQuery('.top .men').hover(
function () {
jQuery(this).stop(false, false).animate({width:'570px'}, 600);
jQuery('img', this).stop(false, false).animate({left:'0px'}, 600);
jQuery('.top .women').stop(false, false).animate({width:'370px'}, 600);
jQuery('.top .women img').stop(false, false).animate({left:'-90px'}, 600);},
function () {
jQuery(this).stop(false, false).animate({width:'470px'}, 600);
jQuery('img', this).stop(false, false).animate({left:'-40px'}, 600);
jQuery('.top .women').stop(false, false).animate({width:'470px'}, 600);
jQuery('.top .women img').stop(false, false).animate({left:'-70px'}, 600);});
});
</script>
</head>

<!-- MODULE Home banner -->
<div class="contentContainer">
(emplacement du html)
</div>
J'ai juste pris le .js et c'est la boite pour laquelle je bosse Smiley cligne
Je l'ai bien modifié en fait c'est pour avoir le meme effet surtout, et comme c'est la premiere fois que je monte un site sur prestashop j'ai besoin d'infos.
J'aurais du le préciser, autant pour moi.
Sujet clos
Aller à