[Помощь] Создаем новый шаблон WebAsyst

mdss

♖♘♗♕♔♗♘♖
Регистрация
20 Фев 2007
Сообщения
1.152
Реакции
709
Я бы разобрался лучше со структурой если бы была какая-нибудь документация по этому продукту. То что есть на офсайте трудно назвать документацией.

Хорошо, с разметкой страниц вроде понятно. А что с JS? Как заставить его работать в шаблоне?
да вроде все есть
Для просмотра ссылки Войди или Зарегистрируйся

По поводу js не знаю в чем проблема. Подключается как и везде, никогда проблем не возникало.
HTML:
<script src="file.js"></script>
 

sanny

Создатель
Регистрация
13 Мар 2014
Сообщения
10
Реакции
0
Подключается как и везде, никогда проблем не возникало.
И я вроде подключаю как на обычном сайте, но не работает.

Может js в предпросмотре не работает? И надо шаблон устанавливать как основной чтобы посмотреть работу скрипта?


Хотя нет, сейчас попробовал сделать шаблон основным, всё равно не работает js.
 

mdss

♖♘♗♕♔♗♘♖
Регистрация
20 Фев 2007
Сообщения
1.152
Реакции
709
И я вроде подключаю как на обычном сайте, но не работает.

Может js в предпросмотре не работает? И надо шаблон устанавливать как основной чтобы посмотреть работу скрипта?


Хотя нет, сейчас попробовал сделать шаблон основным, всё равно не работает js.
пиши в личку, посмотрю
 

sanny

Создатель
Регистрация
13 Мар 2014
Сообщения
10
Реакции
0
Не нашел как писать в личку, поэтому пишу тут.

В редакторе шаблона разделе Head написано следующее:
Код:
    <meta charset="utf-8">
    <title>Моя фирма</title>                                                                                                                     
                                                                
    <script src="/js/jquery-1.4.4.min.js"></script>
    <script src="/js/slides.min.jquery.js"></script>

    <script>
        $(function(){
            $('#slides').slides({
                preload: true,
                preloadImage: 'elements/loading.gif',
                play: 2000,
                pause: 3000,
                hoverPause: true,
                animationStart: function(){
                    $('.caption').animate({
                        bottom:-35
                    },100);
                },
                animationComplete: function(current){
                    $('.caption').animate({
                        bottom:0
                    },200);
                    if (window.console && console.log) {
                        // example return of current slide number
                        console.log(current);
                    };
                }
            });
        });
    </script>

В разделе Стили (CSS) вот это:
HTML:
#container {

    width:600px;

    padding:10px;

    margin:0 auto;

    position:relative;

/*    z-index:0;    */

}



#example {

    width:600px;

    height:350px;

    position:relative;

}



#ribbon {

    position:absolute;

    top:-3px;

    left:-15px;

    z-index:500;

}



#frame {

    position:absolute;

    z-index:0;

    width:600px;

    height:341px;

    top:-3px;

    left:-80px;

}



#slides {

    position:absolute;

    top:15px;

    left:4px;

/*    z-index:100;*/

}



#slides .next {

    position:absolute;

    top:261px;

    width:38px;

    height:39px;

    display:block;

    z-index:1;

}

#slides .prev {

  position: absolute;

  top: 261px;

  left: 230px;

  width: 38px;

  height: 39px;

  display: block;

  z-index: 1;

}



.slides_container {

    width:600px;

    height:300px;

    overflow:hidden;

    position:relative;

  z-index: 0;

}



#slides .next {

    left:305px;

}



.pagination {

    margin:26px auto 0;

    width:100px;

}



.pagination li {

    float:left;

    margin:0 1px;

  color: white;

}



.pagination li a {

    display:block;

    width:12px;

    height:0;

    padding-top:12px;

    background-image:url(../img/pagination.png);

    background-position:0 0;

    float:left;

    overflow:hidden;

}



.pagination li.current a {

    background-position:0 -12px;

}



.caption {

    position:absolute;

    bottom:-35px;

    height:30px;

    padding:5px 20px 0 20px;

    background:#000;

    background:rgba(0,0,0,.5);

    width:540px;

    font-size:1.3em;

    line-height:1.33;

    color:#fff;

    border-top:1px solid #000;

    text-shadow:none;

}



img.pol {

  height: 43px;

  width: 600px;

  margin: -77px 0px 0px 4px;

  position: absolute;

  z-index: 0;

}

img.picture {

  width:600px;

  height:300px;

}

img.prev1, img.next1 {

  width: 37px;

}


В разделе Основная разметка вот это:
HTML:
    <div id="container">
        <div id="example">
          
            <div id="slides">
                <div class="slides_container">
                    <div>
                         <a href="#" target="_blank"><img src="/elements/3.jpg" alt="" class="picture"></a>
                    </div>
                    <div>
                         <a href="#" target="_blank"><img src="/elements/29.jpg" alt="" class="picture"></a>
                    </div>
                    <div>
                        <a href="#" target="_blank"><img src="/elements/30.jpg" alt="" class="picture"></a>
                        </div>
                    <div>
                        <a href="#" target="_blank"><img src="/elements/3.jpg" alt="" class="picture"></a>
                    </div>
                    <div>
                         <a href="#" target="_blank"><img src="/elements/29.jpg" alt="" class="picture"></a>
                    </div>
                                        <div>
                        <a href="#" target="_blank"><img src="/elements/30.jpg" alt="" class="picture"></a>
                    </div>
                </div>
                <a href="#" class="prev"><img src="/elements/11.png" alt="" class="prev1"></a>
                <a href="#" class="next"><img src="/elements/12.png" alt="" class="next1"></a>
      
            </div>
           
        </div>
                         <img src="/elements/13.png" alt="" class="pol">
    </div>


Но вместо слайдера просто выводятся картинки друг за другом.

Папка js с файлами скриптов лежит в папке www.
Где же ошибка?
 

HeadHunter

Shop Script
Регистрация
21 Июн 2011
Сообщения
627
Реакции
275
JS код замените на этот

Код:
{literal}  
<script>
        $(function(){
            $('#slides').slides({
                preload: true,
                preloadImage: 'elements/loading.gif',
                play: 2000,
                pause: 3000,
                hoverPause: true,
                animationStart: function(){
                    $('.caption').animate({
                        bottom:-35
                    },100);
                },
                animationComplete: function(current){
                    $('.caption').animate({
                        bottom:0
                    },200);
                    if (window.console && console.log) {
                        // example return of current slide number
                        console.log(current);
                    };
                }
            });
        });
    </script>
{/literal}

P.S. mdss напил же

4) все фигурные кавычки надо обрамлять тегами {literal}{/literal} (впрочем можно это делать с целым куском кода)
 

sanny

Создатель
Регистрация
13 Мар 2014
Сообщения
10
Реакции
0
Прикрутил свой шаблон на WebAsyst.

Появился вопрос. В центре шаблона вставлен блок "Главное содержание". В этом блоке по умолчанию отображается Витрина. Но мне не нужна витрина на главной. Как сделать чтобы в Главном содержании на главной отображалось что-то иное кроме витрины?
 

mdss

♖♘♗♕♔♗♘♖
Регистрация
20 Фев 2007
Сообщения
1.152
Реакции
709
Прикрутил свой шаблон на WebAsyst.

Появился вопрос. В центре шаблона вставлен блок "Главное содержание". В этом блоке по умолчанию отображается Витрина. Но мне не нужна витрина на главной. Как сделать чтобы в Главном содержании на главной отображалось что-то иное кроме витрины?
Во-первых для начала стоит уточнить версию магазина. Если 5я, то здесь вообще не ее обсуждают.
Во-вторых если все-таки версия < 4, то ставится условие
HTML:
{if $main_content_template == 'home.html'}
homepage content
{else}
{$main_content}
{/if}
 

sanny

Создатель
Регистрация
13 Мар 2014
Сообщения
10
Реакции
0
Продолжаю потихоньку допиливать шаблон на WebAsyst.

Моя версия < 4, да.

ставится условие
Условие работает, но есть нюанс. Как мне определить, что открыта именно страница интернет магазина, т.е. Для просмотра ссылки Войди или Зарегистрируйся ?
Потому что условие {if $main_content_template == 'home.html'} одинаково срабатывает и для Для просмотра ссылки Войди или Зарегистрируйся и для Для просмотра ссылки Войди или Зарегистрируйся.

Еще есть вопрос по спискам товаров. Мне нужно реализовать такой механизм:
Есть несколько списков. На главной странице есть ссылки соответствующие этим спискам. Как сделать чтобы по клику на ссылку открывался нужный список товаров?
 

mdss

♖♘♗♕♔♗♘♖
Регистрация
20 Фев 2007
Сообщения
1.152
Реакции
709
Продолжаю потихоньку допиливать шаблон на WebAsyst.
а зачем вообще использовать урл с /shop/ ?

По второму вопросу, можно просто оформить различными табами.
 

sanny

Создатель
Регистрация
13 Мар 2014
Сообщения
10
Реакции
0
а зачем вообще использовать урл с /shop/ ?
А как по-другому реализовать отображение магазина не на главной?

По второму вопросу, можно просто оформить различными табами.
Можно пример кода? Я не совсем понимаю как это сделать.
 
Сверху