On March 26, 2019 we launched new MODX Forums. Please join us at the new MODX Community Forums.
Subscribe: RSS
  • Witam,

    Próbuję opanować powiązanie modx revo z posiadanym szablonem i javascript zdecydowanie odmawia współpracy.

    Tak wygląda funkcjonujący szablon strony:

    http://www.spades.pl/dev00/index.html

    Wszystkie niezbędne funkcje (slider, menu, powiększanie obrazków, prosta galeria, itp.) działają bez problemu.
    Dla testów użyłem tylko strony głównej.

    Zainstalowałem modx revo 2.0.6, dodałem spolszczenie i nowy template z takim kodem:

    <!DOCTYPE html>
    <html lang="pl">
    <head>
    <title>[[*pagetitle]]</title>
    <meta charset="utf-8">
    <meta name="description" content="[[*description]]">
    <meta name="keywords" content="[[*keywords]]">
    <meta name="author" content="[[*author]]">
    <link rel="stylesheet" href="assets/templates/Spades/css/reset.css" type="text/css" media="all">
    <link rel="stylesheet" href="assets/templates/Spades/css/grid.css" type="text/css" media="all">
    <link rel="stylesheet" href="assets/templates/Spades/css/style.css" type="text/css" media="all">
    <!-- styles for prettyPhoto -->
    <link rel="stylesheet" href="assets/templates/Spades/css/prettyPhoto.css" type="text/css" media="all">
    <script type="text/javascript" src="assets/templates/Spades/js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="assets/templates/Spades/js/script.js"></script>
    <script type="text/javascript" src="assets/templates/Spades/js/date.js"></script>
    <!--[if lt IE 7]>
       <script type="text/javascript" src="assets/templates/Spades/js/ie6_script_other.js"></script>
     <![endif]-->
    <!--[if lt IE 9]>
      	<script type="text/javascript" src="assets/templates/Spades/js/js/html5.js"></script>
      <![endif]-->
    </head>
    <body onLoad="myclock();">
    
    [[*content]] 
    
    
    </body>
    </html>
    
    


    oraz

    stronę Home z takim kodem:

    
    <div class="tail-top">
       <div class="tail-bottom">
          <div id="main">
             <!-- header -->
             <header>
                <!-- .logo -->
    
                <div class="logo"> <a href="index.html">Communication<span>Providing best connection</span></a> </div>
                <!-- /.logo -->
               <form id="ClockForm" action="">
                   <fieldset>
                   <input type="text" id="clock" />
                   </fieldset>
                </form>
    
                <ul class="contacts">
                   <li class="phone">Freephone:  +1 800 559 6580</li>
                   <li class="email"><a href="#">communicationcompany@demolink.org</a></li>
                </ul>
                <nav>
                  <ul class="sf-menu">
                      <li><a href="index.html" class="current">Main</a></li>
    
                      <li><a href="index-1.html">About</a>
                         <ul>
                            <li><a href="more.html">Lorem ipsum dolor sit</a></li>
                            <li><a href="more.html">Nulla quis metus</a></li>
                            <li><a href="more.html">Vestibulum in velit justo</a></li>
                            <li><a href="more.html">Vivamus nisi massa</a></li>
    
                            <li><a href="more.html">Nullam commodo</a></li>
                         </ul>
                      </li>
                      <li><a href="index-2.html">Services</a></li>
                      <li><a href="index-3.html">Projects</a></li>
                      <li><a href="index-4.html">FAQs</a></li>
                      <li><a href="index-5.html">Solutions</a></li>
    
                      <li><a href="index-6.html">contacts</a></li>
                   </ul>
                </nav>
                <form action="" id="search-form">
                   <fieldset>
                   <input type="text" class="text" value="Search..." onFocus="if(this.value=='Search...'){this.value=''}" onBlur="if(this.value==''){this.value='Search...'}">
                   <a href="#" onClick="document.getElementById('search-form').submit()"><img src="assets/templates/Spades/images/button-search.gif"></a>
                   </fieldset>
    
                </form>
             </header>
             <!-- content -->
             <section id="content">
                <div id="coin-slider"> <a href="#"><img src="assets/templates/Spades/images/slide-img1.jpg"></a> <a href="#"><img src="assets/templates/Spades/images/slide-img2.jpg"></a> <a href="#"><img src="assets/templates/Spades/images/slide-img3.jpg"></a></div>
    		  <h2 class="extra1">Fresh ideas<br>
                      for growing<br>
    
                      your business</h2>
                <div class="cont-box">
                   <div class="inner">
                      <div class="wrapper container_16">
                         <article class="grid_4">
                            <h2>Remote</h2>
                            <p>Praesent vestibulum molesti acuan nonumm eurissellus portusus.</p>
    
                            <ul class="list">
                               <li><a href="#">Praesent vestibulum molesti </a></li>
                               <li><a href="#">Acuan nonumm euriss</a></li>
                               <li><a href="#">Fusce suscipit vim</a></li>
                               <li><a href="#">Nascetur ridiculus mus</a></li>
                               <li><a href="#">Fsce feugiat malesuada odi</a></li>
    
                            </ul>
                         </article>
                         <article class="grid_4">
                            <h2>IP Phone</h2>
                            <p class="p2">Praesent vestibulum molesti acuan nonumm eurissellus portusu ociis natoque pe et mis parturie ntontes nascetur ridiculus ma dui.</p>
                            <p class="p2">Fsce feugiat malesuada odio. Morbi nunc odiovida atcursus nec uctus a lorem. Maecenas tristiq.</p>
                            <ul class="list">
    
                               <li><a href="#">Fusce suscipit vim</a></li>
                               <li><a href="#">Nascetur ridiculus mus</a></li>
                            </ul>
                         </article>
                         <article class="grid_4">
                            <h2>Hardware</h2>
                            <p>Mim sociis natoque petibus et mis parturie ntontes nascetur ridic.</p>
    
                            <ul class="list">
                               <li><a href="#">Praesent vestibulum molesti </a></li>
                               <li><a href="#">Acuan nonumm euriss</a></li>
                               <li><a href="#">Fusce suscipit vim</a></li>
                               <li><a href="#">Nascetur ridiculus mus</a></li>
                               <li><a href="#">Fsce feugiat malesuada odi</a></li>
    
                            </ul>
                         </article>
                         <article class="grid_4">
                            <h2>Internet</h2>
                            <p class="p2">Praesent vestibulm molesi acuan nonumm eurissellus portususipit varMim sociis natoque peibus et mis parturie ntontes nasctur ulus musNulla dui. Fsce feugiat suada odio. Morbi nunc odiov.</p>
                            <p>Rida atcursus nec uctus a lornas tristique orci ac sem. Duis ultrcies pharetra magna. Donec accusan malesuda orciec sit  eros. Lorem ipsum dolor sit am.</p>
                         </article>
    
                      </div>
                      <div class="wrapper container_16">
                         <article class="grid_4"> <a href="more.html" class="button">Read More</a> </article>
                         <article class="grid_4"> <a href="more.html" class="button">Read More</a> </article>
                         <article class="grid_4"> <a href="more.html" class="button">Read More</a> </article>
    
                         <article class="grid_4"> <a href="more.html" class="button">Read More</a> </article>
                      </div>
                   </div>
                </div>
             </section>
             <!-- aside -->
             <aside class="bottom">
    
                <div class="inside">
                   <div class="wrapper container_16">
                      <article class="grid_8">
                         <h2>The world of opportunities</h2>
                         <div class="img-box">
                            <figure><a href="assets/templates/Spades/images/tfile_gall_1_1.jpg" class="lightbox-image" rel="prettyphoto" title="Example 1"><img src="assets/templates/Spades/images/1page-img.jpg" alt=""></a></figure>
                            <h5 class="extra">Praesent vestibulum molesti acuanumm eurissellus portuenas tristiquesuipit var</h5>
                            <p>Mim sociis natoque p musNulla dui. Fsc muda odio. Morbi nunc odiovida ursus nec uca lorem. Maecenaristique orci ac sem. Duis u pharetra magnaccumsan malest am.</p>
    
                            et consectetuer adipiscing elit. Mauris fermen tum dictum magna. Sed oreet aliquam leo. Ut tellus dolor dapibus eget elementum vel curus eleife elit. </div>
                         <a href="more.html" class="button">Read More</a> </article>
                      <article class="grid_8">
                         <h2>Features</h2>
                         <dl>
                            <dt class="color1"><span>1</span>Professional researches</dt>
    
                            <dd>Mim sociis natoque p musNulla dui. Fsc muada odio. Morbi nunc odiovida ursus nec uca lorem. Maecenaristiq.</dd>
                            <dt class="color2"><span>2</span>Dynamic development</dt>
                            <dd>Mim sociis natoque p musNulla dui. Fsc muada odio. Morbi nunc odiovida ursus nec uca lorem. Maecenaristiq.</dd>
                            <dt class="color3"><span>3</span>Individual customer support</dt>
                            <dd>Mim sociis natoque p musNulla dui. Fsc muada odio. Morbi nunc odiovida ursus nec uca lorem. Maecenaristiq.</dd>
    
                         </dl>
                      </article>
                   </div>
                </div>
             </aside>
             <!-- footer -->
             <footer>
                <div class="inside">Communication © 2010 • <a href="index-7.html">Privacy Policy</a>
    
                   <ul class="social-services">
                      <li><a href="#" title="Reddit" class="normaltip"><img src="assets/templates/Spades/images/icon-reddit.gif"></a></li>
                      <li><a href="#" title="Flickr" class="normaltip"><img src="assets/templates/Spades/images/icon-flickr.gif"></a></li>
                      <li><a href="#" title="Twitter" class="normaltip"><img src="assets/templates/Spades/images/icon-twitter.gif"></a></li>
                      <li><a href="#" title="Rss" class="normaltip"><img src="assets/templates/Spades/images/icon-rss.gif"></a></li>
                      <li><a href="#" title="Digg" class="normaltip"><img src="assets/templates/Spades/images/icon-digg.gif"></a></li>
                   </ul>
                </div>
             </footer>
    
          </div>
       </div>
    </div>
    
    
    


    efekt jest taki:

    http://spades.pl/dev01/

    czyli nie do końca zgodny z oczekiwaniami - nie działa slider, menu rozwijane kuleje, powiększanie obrazków również nie działa.

    W zakresie slidera próbowałem per analogiae zastosować metodę opisaną tutaj:

    http://designfromwithin.com/integrating-coda-slider-2-0-in-modx-revolution/

    zrobiłem odpowiedniego chunka i stosowne TV, niestety efekt jest identyczny jak bez chunka i TV.


    Jakiś pomysł? Co robię źle?

    Pozdrawiam
    • W pliku http://spades.pl/dev01/assets/templates/Spades02/js/script.js są includowane kolejne pliki js, które mają błędną ścieżkę. Pewniej jakiś base href je psuje czy co w tym stylu.
      • Dziękuję bardzo - rzeczywiście problem był w ścieżkach

        Pozdrawiam