Jump to content
Sign in to follow this  
pozitiv739

[РЕШЕНО] раскраска цветной зеброй описания товара в карточке товара

Recommended Posts

как сделать такое описание ?
может модуль какой есть готовый?
описание планируется таким видом
вот кусок кода
пасиба

</tr>
               <tr class="even">
                    <td>Поддержка GPS:</td>
                    <td class="value">Есть</td>
               </tr>
               <tr class="odd">
                    <td>Конструкция:</td>
                    <td class="value">С камерой, с экраном</td>
               </tr>
               <tr class="even">
                    <td>Спортивный:</td>
                    <td class="value">-</td>
               </tr>

post-667025-0-58141800-1387620300_thumb.jpg

Share this post


Link to post
Share on other sites

это же атрибуты.

всего-то немного подправить стандартный вывод (убрав группы)

upd:

если собираетесь все таки делать это через "описание" - так пишите его сразу таблицей - редактор позволяет.

а на выводе javascript`ом (jquery) добавите классы строкам таблицы

Edited by afwollis
upd:

Share this post


Link to post
Share on other sites

пасиба большое

но так как не програмер а пытаюсь сам разобраться

вы не могли бы разжевать ?

да, делать удобнее через описание

характеристики используються атрибутами но их спрятали с карточки товара там немножко меньше атрибутов чем в описании ну и

описания копипастяться с сайт поставщика  так удобнее

нада только раскрасить для удобночитаемости

спаибо заранее

 

может кто нить не дорого поможет в этом вопросе, отблагодарю

Share this post


Link to post
Share on other sites

красить нашел только вот как :) вручную

но не вариант совсем :(

post-667025-0-67520500-1387621887_thumb.png

Share this post


Link to post
Share on other sites

А зачем Вы это делаете в поле "Описание", если для этого существует вкладка "Характеристики"???

(где Вы сможете разукрасить все поля - как Вашей душе угодно)

 

4081576.png

Share this post


Link to post
Share on other sites

Это добавляете в header.tpl в секцию между <head> и </head>

<script type="text/javascript">
$(document).ready(function() {
$("класс или айди таблицы tbody tr:even").addClass("alt");
});
</script>

"класс или айди таблицы" естественно, заменяете на свои, если айди, то "#имя айди", если класс, то ".имя класса", без кавычек
 
В stylesheet.css добавляете класс .alt
к примеру так - 

.alt {background: #ccc;}
  • +1 1

Share this post


Link to post
Share on other sites

в характеристиках указываються атрибуты которые используються в фильтрах :(

их там меньше чем описания то есть как бы таб характеристики занят

или можно как то сделать чтоб в хара-ках не брались данные с атрибутов а можно свои какие нада копипастить туда ?

буду благодарен если расскажите как так сделать

 

А зачем Вы это делаете в поле "Описание", если для этого существует вкладка "Характеристики"???

(где Вы сможете разукрасить все поля - как Вашей душе угодно)

 

4081576.png

Share this post


Link to post
Share on other sites

я дико извенюсь и благодарю за ответ

но я ничче не понял

не понял какой класс туда добавить

 

 

 

Это добавляете в header.tpl в секцию между <head> и </head>

<script type="text/javascript">
$(document).ready(function() {
$("класс или айди таблицы tbody tr:even").addClass("alt");
});
</script>

"класс или айди таблицы" естественно, заменяете на свои, если айди, то "#имя айди", если класс, то ".имя класса", без кавычек
 
В stylesheet.css добавляете класс .alt
к примеру так - 

.alt {background: #ccc;}

Share this post


Link to post
Share on other sites

Класс таблицы, в которой содержатся необходимые вам данные. <table class="какой-то-там" >

Share this post


Link to post
Share on other sites

я не пойму причем тут хидер.тпл

оно ж вроде лежит

в файле продукт.тпл есть <table class="attribute">

тут который  /catalog/view/theme/мойшаблон/template/product

Share this post


Link to post
Share on other sites

1.

<table class="zebra">
<tr>
<tr>

/* нечетная строка таблицы */
.zebra tr:nth-child(2n+1){
...
}

/* четная строка таблицы класса*/
.zebra tr:nth-child(2n){
...
}
2.

function zebra('zebra') 
{
   var tabs = $('.sebra tr');
   tabs.each(function(index){
     if (index%2 == 0) $(this).css({'background':'grey'})
   }

}

Share this post


Link to post
Share on other sites

Итак благодаря Сергею

serega-lomik

решил вопрос

 

вдруг кому понадобиться

 

в хидер этот public_html/catalog/view/theme/ВАШ ШАБЛОН/template/common/header.tpl в секцию между <head> и </head>

<script type="text/javascript">
$(document).ready(function() {
$(".tab-content table tbody tr:even").addClass("alt");
});
</script>

 

В stylesheet.css

 

.alt {background:#DDDDDD;} это в stylesheet.css

 

 

все работает при таком коде:

 

<table>
    <tbody>
        <tr class="odd">
            <td>
                Диагональ экрана:</td>
            <td class="value">
                7"</td>
        </tr>
        <tr class="even">
            <td>
                Разрешение экрана:</td>
            <td class="value">
                1024 x 600</td>
        </tr>
        <tr class="odd">
            <td>
                Мультитач:</td>
            <td class="value">
                +</td>
        </tr>
        <tr class="even">
            <td>
                Процессор:</td>
            <td class="value">
                MediaTek MT8389</td>
        </tr>

 

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

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
You are posting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.