osCommerce France : Accueil Forum Portail osCommerce France Réponses aux questions Foire aux contributions

Bienvenue invité ( Connexion | Inscription )

 
Reply to this topicStart new topic
> Banniere Pub/Promo
Skathaï
posté 24 Mar 2012, 17:20
Message #1


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 18
Inscrit : 26-March 07
Lieu : Rennes
Membre no 16164



Bonjour,

En navigant sur le net, je suis tombé sur cette photo d'un site basé sur osc2.3




Connaissez vous la contrib, qui permettrais de faire la bannière sous le menu horizontal.

Les seules que j'ai trouvé pour le moment, ne sont que des Slides basic.

Skath


--------------------
OSCommerce 2.3.1 // lofslidernews plugin // Superfish_horizontal_navbar // Star_Product
Go to the top of the page
 
krokus
posté 24 Mar 2012, 22:31
Message #2


Ceinture orange+ OSC
Icône de groupe

Groupe : Membres
Messages : 337
Inscrit : 23-February 07
Membre no 15518



The Lof SiderNews Plugin


--------------------
Ms2.3+Category Description+Ckeditor+Colissimo+EasyPopulate+Header tags seo+Otf autothumb+PIM osSlideshow+Theme switcher+Ultimate Seo Urls+Icone stock+crawlprotect+Who's Online Enhancement+Master password+lien suivi colis
Go to the top of the page
 
Skathaï
posté 25 Mar 2012, 07:31
Message #3


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 18
Inscrit : 26-March 07
Lieu : Rennes
Membre no 16164



Super, merci Krokus, vais aller étudier ca^^.


--------------------
OSCommerce 2.3.1 // lofslidernews plugin // Superfish_horizontal_navbar // Star_Product
Go to the top of the page
 
julien038
posté 3 Apr 2012, 09:27
Message #4


Ceinture blanche+ OSC
Icône de groupe

Groupe : Membres
Messages : 31
Inscrit : 28-February 12
Membre no 30641



Skathaï, as tu réussi?


--------------------
Version oscommerce:2.3.1
Go to the top of the page
 
Skathaï
posté 5 Apr 2012, 15:56
Message #5


Ceinture blanche OSC
Icône de groupe

Groupe : Membres
Messages : 18
Inscrit : 26-March 07
Lieu : Rennes
Membre no 16164



Salut Julien,

Oui, j'ai réussi.Commence par télécharger le dossier puis :

Ajouter le fichier:
- layout.css dans catalog/css
- jquery.easing.js dans catalog/js
- jquery.js dans catalog/js
- script.js dans catalog/js

Copier le dossier images dans catalog/images

Créer lofslidernews.php dans catalog/includes
et ajouter:
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lof JSliderNews 2.0 - Jquery 1.7.x</title>
<link rel="stylesheet" type="text/css" href="css/layout.css" />
<link rel="stylesheet" type="text/css" href="css/style3.css" />
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.easing.js"></script>
<script language="javascript" type="text/javascript" src="js/script.js"></script>
<script type="text/javascript">
$(document).ready( function(){
        var buttons = { previous:$('#jslidernews3 .button-previous') ,
                        next:$('#jslidernews3 .button-next') };
        $('#jslidernews3').lofJSidernews( { interval:5000,
                                                 easing:'easeOutBounce',
                                                duration:1200,
                                                auto:false,
                                                mainWidth:930,
                                                mainHeight:300,
                                                navigatorHeight        : 100,
                                                navigatorWidth        : 310,
                                                maxItemDisplay:3,
                                                buttons:buttons} );
    });

</script>
<style>

    ul.lof-main-wapper li {
    position:relative;
}
</style>
</head>
<body>
    <div id="container">

<!------------------------------------- THE CONTENT ------------------------------------------------->
<div id="jslidernews3" class="lof-slidecontent" style="width:930px; height:300px;">
    <div class="preload"><div></div></div>


            <div  class="button-previous">Previous</div>

             <!-- MAIN CONTENT -->
              <div class="main-slider-content" style="width:930px; height:300px;">
                <ul class="sliders-wrap-inner">
                    <li>
                            <img src="images/thumbl_980x340.png" title="Newsflash 2" >
                          <div class="slider-description">
                            <div class="slider-meta"><a target="_parent" title="Newsflash 1" href="#Category-1">/ Newsflash 1 /</a> <i> — Monday, February 15, 2010 12:42</i></div>
                            <h4>Content of Newsflash 1</h4>
                            <p>The one thing about a Web site, it always changes! Joomla! makes it easy to add Articles, content,...
                            <a class="readmore" href="#">Read more </a>
                            </p>
                         </div>
                    </li>
                   <li>
                      <img src="images/thumbl_980x340_002.png" title="Newsflash 1" >
                         <div class="slider-description">
                           <div class="slider-meta"><a target="_parent" title="Newsflash 2" href="#Category-2">/ Newsflash 2 /</a>     <i> — Monday, February 15, 2010 12:42</i></div>
                            <h4>Content of Newsflash 2</h4>
                            <p>Joomla! makes it easy to launch a Web site of any kind. Whether you want a brochure site or you are...
                            <a class="readmore" href="#">Read more </a>
                            </p>
                         </div>
                    </li>
                   <li>
                      <img src="images/thumbl_980x340_003.png" title="Newsflash 3" >
                        <div class="slider-description">
                          <div class="slider-meta"><a target="_parent" title="Newsflash 3" href="#Category-3">/ Newsflash 3 /</a>     <i> — Monday, February 15, 2010 12:42</i></div>
                            <h4>Content of Newsflash 3</h4>
                            <p>With a library of thousands of free Extensions, you can add what you need as your site grows. Don't...
                            <a class="readmore" href="#">Read more </a>
                            </p>

                         </div>
                    </li>
                    <li>
                      <img src="images/thumbl_980x340_004.png" title="Newsflash 5" >
                        <div class="slider-description">
                          <div class="slider-meta"><a target="_parent" title="Newsflash 4" href="#Category-4">/ Newsflash 4 /</a>    <i> — Monday, February 15, 2010 12:42</i></div>
                            <h4>Content of Newsflash 4</h4>
                            <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
                            <a class="readmore" href="#">Read more </a>
                            </p>
                         </div>
                    </li>
                    <li>
                      <img src="images/thumbl_980x340_005.png" title="Newsflash 5" >
                        <div class="slider-description">
                           <div class="slider-meta"><a target="_parent" title="Newsflash 5" href="#">/ Newsflash 5 /</a>    <i> — Monday, February 15, 2010 12:42</i></div>
                           <h4>Content of Newsflash 5</h4>
                            <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
                            <a class="readmore" href="#">Read more </a>
                            </p>
                         </div>
                    </li>
                    <li>

                      <img src="images/thumbl_980x340_006.png" title="Newsflash 5" >
                        <div class="slider-description">
                          <div class="slider-meta"><a target="_parent" title="Newsflash 6" href="#">/ Newsflash 6 /</a>    <i> — Monday, February 15, 2010 12:42</i></div>
                            <h4>Content of Newsflash 6</h4>
                            <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
                            <a class="readmore" href="#">Read more </a>
                            </p>
                         </div>
                    </li>

                  </ul>
            </div>
           <!-- END MAIN CONTENT -->
           <!-- NAVIGATOR -->
               <div class="navigator-content">
                  <div class="navigator-wrapper">
                        <ul class="navigator-wrap-inner">
                          <li>
                                <div>
                                    <img src="images/lofthumbs/791902news3.jpg" />
                                    <h3> NewsFlash 1 </h3>
                                    <span>20.01.2010</span> - In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu...
                                </div>
                            </li>
                             <li>
                                <div>
                                    <img src="images/lofthumbs/435576news10.jpg" />
                                    <h3> NewsFlash 2 </h3>
                                    <span>20.01.2010</span> -In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu. ..
                                </div>
                            </li>

                            <li>
                                <div>
                                    <img src="images/lofthumbs/641906img1.jpg" />
                                    <h3> NewsFlash 3 </h3>
                                    <span>20.01.2010</span> - In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu. ..
                                </div>
                            </li>

                           <li>
                                <div>
                                    <img src="images/lofthumbs/416719news7.jpg" />
                                    <h3> NewsFlash 4</h3>
                                    <span>20.01.2010</span> - In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu. ..
                                </div>
                            </li>
                            <li>
                                 <div>
                                    <img src="images/lofthumbs/641906img1.jpg" />
                                    <h3> NewsFlash 5</h3>
                                    <span>20.01.2010</span> -In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu. ..
                                 </div>
                            </li>
                           <li>
                                <div>
                                    <img src="images/lofthumbs/416719news7.jpg" />
                                    <h3> NewsFlash 6</h3>
                                    <span>20.01.2010</span> - In id, mauris viverra asperiores, bibendum in id. Eu molestie. Ac sit eu. ..
                                </div>
                            </li>
                        </ul>
                  </div>

             </div>
          <!----------------- END OF NAVIGATOR --------------------->
                            <div class="button-next">Next</div>
</div>

<!------------------------------------- END OF THE CONTENT ------------------------------------------------->

    </div>
</body>



J'ai utilisé le style3, tu peux prendre les autres en prenant le code adéquat.

Ouvrir header.php
Ajouter a la fin.
<?php require(DIR_WS_INCLUDES . 'lofslidernews.php'); ?>


Voila, c'est pas compliqué, mais j'ai mis du temps a comprendre comment utiliser ce plugin.
Skath.

Ce message a été modifié par Skathaï - 5 Apr 2012, 15:58.


--------------------
OSCommerce 2.3.1 // lofslidernews plugin // Superfish_horizontal_navbar // Star_Product
Go to the top of the page
 
krokus
posté 5 Apr 2012, 17:02
Message #6


Ceinture orange+ OSC
Icône de groupe

Groupe : Membres
Messages : 337
Inscrit : 23-February 07
Membre no 15518



Bravo, par contre inclure dans lofslidernews.php le doctype et le head c'est pas une bonne idée, il vaudrait mieux mettre cette partie dans template_top et donc ne pas rajouter le doctype puisqu'il est deja declare et ne rajouter que les javascript qui ne sont pas declare parce que la tu as des declaration en double, au final ta page lofslidernews.php ne devrait contenir que ce qu'il y a entre <div id="jslidernews3" class="lof-slidecontent" style="width:930px; height:300px;"> et </div>

Ce message a été modifié par krokus - 5 Apr 2012, 17:08.


--------------------
Ms2.3+Category Description+Ckeditor+Colissimo+EasyPopulate+Header tags seo+Otf autothumb+PIM osSlideshow+Theme switcher+Ultimate Seo Urls+Icone stock+crawlprotect+Who's Online Enhancement+Master password+lien suivi colis
Go to the top of the page
 

Reply to this topicStart new topic
1 utilisateur(s) sur ce sujet (1 invité(s) et 0 utilisateur(s) anonyme(s))
0 membre(s) :

 



RSS Version bas débit Nous sommes le : 31st October 2014 - 15:12
Ce site est déclaré auprès de la commision Nationale
de l'Informatique et des Libertés (déclaration n°: 1043896)