Введите часть искомого слова, названия или фразы...
↑ ↓
  1. Новые темы озаглавленные с маленькой буквы - удаляются без предупреждения!
  2. Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!

Решено Развернуть/свернуть контент по клику

Тема в разделе "Вопросы новичков", создана пользователем ОАА, 31 июл 2016.

  1. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Здравствуйте!

    Магазин здесь.

    Необходимо изменить страницу о формировании заказа. Уже полотно получается - много информации и я еще добавить должна.
    Хочу что бы контент разворачивался по клику. Вот нашла информацию. Но как ее использовать?

    Заранее спасибо за разъяснение:)
     
  2. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Я попробовала вписать в страницу следующее:

    Код:
    <script src="jquery-1.7.2.js"></script>
    <style>
    .extremum-slide {
        border:1px solid;
        padding:50px;
    }
    </style>
    </head>
    <body>
    <div class="block">
        <h3 class="extremum-click">Особенности доставки товаров</h3>
        <div class="extremum-slide">
        <span style="color: #000000;">В интернет-магазине "Душа Дома" представлены два типа товаров:</span>
            <ul style="text-align: justify;">
         <li><span style="color: #000000;">товары ТК - доставка возможна только</span> <a href="http://dusha-domy.ru/oplata-i-dostavka/transportnaya-kompaniya/">транспортной компанией</a>. <span style="color: #000000;">Доставка осуществляется напрямую со склада поставщика;</span></li>
         <li style="text-align: justify;"><span style="color: #000000;">прочие товары - доставка</span> <a href="http://dusha-domy.ru/oplata-i-dostavka/">любым удобным способом</a>.</li>
            </ul>
            <p style="text-align: justify;"><span style="color: #000000;">Доставка товаров может занимать некоторое время, например, при заказе мебели по индивидуальным размерам. Поэтому при просмотре каталога товаров предлагаем Вам использовать <a href="http://dusha-domy.ru/wishlist/">Список желаний</a>. Таким образом Вы подберете все, что хотите и далее из списка отобранных товаров сможете оформить разные заказы с выбором способа доставки для каждого типа товаров отдельно.</span></p>
        </div>
    </div>
    <div class="block">
        <h3 class="extremum-click">Дополнительные опции и варианты дизайна</h3>
        <div class="extremum-slide">
        <span style="color: #000000;">У многих товаров доступны дополнительные опции и варианты дизайна. Используйте соответствующие кнопки на странице просмотра товара, если они доступны.</span>
    
    <img class="alignnone wp-image-4410 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii.jpg" alt="кнопка доп.опции" width="386" height="62" />        <img class="alignnone wp-image-4411 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn.jpg" alt="кнопка другой дизайн" width="385" height="62" />
    <h6></h6>
        </div>
    </div>
    <div class="block">
        <h3 class="extremum-click">Дизайн под заказ</h3>
        <div class="extremum-slide">
        В нашем интернет-магазине кроме дополнительных опций и вариантов дизайна есть возможность заказать свой дизайн. На странице просмотра таких товаров товаров используйте соответствующую кнопку.
    
    <img class="alignnone wp-image-4412 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn.jpg" alt="Кнопка заказать свой дизайн" width="394" height="70" />
    
    Кнопка доступна, если выбран вариант исполнения "Свой дизайн"  <img class="alignnone size-full wp-image-4413" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn.jpg" alt="Вариант исполнения свой дизайн" width="81" height="84" />
    
    В меню индивидуального дизайна необходимо выбрать опции и добавить товар в корзину обычным способом. При оформлении заказа среди платежей необходимо выбрать "Запрос стоимости индивидуального дизайна".
    
    После оформления Ваш заказ попадает в обработку. Оператор корректирует заказ, указывая стоимость выбранных Вами опций индивидуального дизайна. Все внесенные изменения согласуются с Вами по телефону и дублируется сообщениями в личном кабинете.
    
    Просмотреть текущее состояние заказа Вы можете в Личном кабинете в разделе Заказы.
    
    После окончания расчета стоимости Вам необходимо выбрать удобный способ оплаты в личном кабинете в разделе Заказы.
    <h6><strong>Внимание: </strong></h6>
    Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.
    
    Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.
    
    Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.
    
    При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом</a>.
        </div>
    </div>
    <script>
        $(".extremum-click").click(function () {
          $(this).siblings(".extremum-slide").slideToggle("slow");
        });
    </script>
    Появились рамочки. "Клики" не работают:(

    [​IMG]

    Чего-то я упускаю....
     
  3. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Я хочу в идеале повторить как сделаны доп. варианты дизайна на карточке товара, например здесь.
    Через гугл вырезала код:
    Код:
    <div data-epo-id="1" data-cart-id="main" data-product-id="4363" class="tc-extra-product-options tm-extra-product-options tm-custom-prices tc-clearfix tm-product-id-4363 tm-cart-main tc-show" id="tm-extra-product-options" style="opacity: 1;">
        <div class="tm-extra-product-options-inner">
            <ul id="tm-extra-product-options-fields" class="tm-extra-product-options-fields">                            <li id="tm-epo-field-0" class="tm-extra-product-options-field nopadding"><div data-uniqid="5763e92f4cc555.27268943" data-logic="" data-haslogic="" class="cpf-section tm-row tm-cell col-12 ">
    <div class="tm-collapse"><h5 class="tm-epo-field-label tm-section-label tm-toggle">Другой дизайн<span class="tcfa tm-arrow tcfa-angle-down"></span></h5><div class="tm-collapse-wrap closed" style="display: none;"><div data-uniqid="5763e9384cc564.19915700" data-logic="" data-haslogic="" data-fblabelshow="" data-fbvalueshow="" class="cpf_hide_element tm-cell col-12 cpf-type-radio">
    <label style="color:#080808" class="tm-epo-field-label">Вы можете выбрать иное цветовое решение:</label>    <div class="tm-extra-product-options-container">
            <ul data-rules="{&quot;\u0414\u0443\u0431 \u041c\u043b\u0435\u0447\u043d\u044b\u0439_0&quot;:[&quot;&quot;],&quot;\u0412\u0435\u043d\u0433\u0435_1&quot;:[&quot;&quot;],&quot;\u041e\u043b\u044c\u0445\u0430_2&quot;:[&quot;&quot;],&quot;\u041b\u0430\u0439\u043c_3&quot;:[&quot;&quot;],&quot;\u041e\u0440\u0430\u043d\u0436\u0435\u0432\u044b\u0439_4&quot;:[&quot;&quot;]}" data-original-rules="{&quot;\u0414\u0443\u0431 \u041c\u043b\u0435\u0447\u043d\u044b\u0439_0&quot;:[&quot;&quot;],&quot;\u0412\u0435\u043d\u0433\u0435_1&quot;:[&quot;&quot;],&quot;\u041e\u043b\u044c\u0445\u0430_2&quot;:[&quot;&quot;],&quot;\u041b\u0430\u0439\u043c_3&quot;:[&quot;&quot;],&quot;\u041e\u0440\u0430\u043d\u0436\u0435\u0432\u044b\u0439_4&quot;:[&quot;&quot;]}" data-rulestype="{&quot;\u0414\u0443\u0431 \u041c\u043b\u0435\u0447\u043d\u044b\u0439_0&quot;:[&quot;&quot;],&quot;\u0412\u0435\u043d\u0433\u0435_1&quot;:[&quot;&quot;],&quot;\u041e\u043b\u044c\u0445\u0430_2&quot;:[&quot;&quot;],&quot;\u041b\u0430\u0439\u043c_3&quot;:[&quot;&quot;],&quot;\u041e\u0440\u0430\u043d\u0436\u0435\u0432\u044b\u0439_4&quot;:[&quot;&quot;]}" data-tm-validation="[]" class="tmcp-ul-wrap tmcp-elements tm-extra-product-options-radio tm-element-ul-radio element_0 use_images_containter">
    <li class="tmcp-field-wrap tm-per-row">
                <input class="tmcp-field tm-epo-field tmcp-radio use_images" name="tmcp_radio_0" data-price="" data-rules="[&quot;&quot;]" data-original-rules="[&quot;&quot;]" data-rulestype="[&quot;&quot;]" data-image="https://dusha-domy.ru/wp-content/uploads/2016/06/Dub-Mlechnyj.jpg" data-imagep="" data-imagel="" value="Дуб Млечный_0" id="tmcp_choice_0_0_1" tabindex="1" type="radio">
        <label for="tmcp_choice_0_0_1"><img class="tmlazy  radio_image tm-tooltip" alt="Дуб Млечный" src="https://dusha-domy.ru/wp-content/uploads/2016/06/Dub-Mlechnyj.jpg" data-tm-tooltip-swatch="on"><span class="tc-label radio_image_label" style="display: none;">Дуб Млечный</span></label>    <span class="price tc-price  "></span>        </li><li class="tmcp-field-wrap tm-per-row">
                <input class="tmcp-field tm-epo-field tmcp-radio use_images" name="tmcp_radio_0" data-price="" data-rules="[&quot;&quot;]" data-original-rules="[&quot;&quot;]" data-rulestype="[&quot;&quot;]" data-image="https://dusha-domy.ru/wp-content/uploads/2016/06/Venge.jpg" data-imagep="" data-imagel="" value="Венге_1" id="tmcp_choice_0_1_2" tabindex="2" type="radio">
        <label for="tmcp_choice_0_1_2"><img class="tmlazy  radio_image tm-tooltip" alt="Венге" src="https://dusha-domy.ru/wp-content/uploads/2016/06/Venge.jpg" data-tm-tooltip-swatch="on"><span class="tc-label radio_image_label" style="display: none;">Венге</span></label>    <span class="price tc-price  "></span>        </li><li class="tmcp-field-wrap tm-per-row">
                <input class="tmcp-field tm-epo-field tmcp-radio use_images" name="tmcp_radio_0" data-price="" data-rules="[&quot;&quot;]" data-original-rules="[&quot;&quot;]" data-rulestype="[&quot;&quot;]" data-image="https://dusha-domy.ru/wp-content/uploads/2016/06/Olha.jpg" data-imagep="" data-imagel="" value="Ольха_2" id="tmcp_choice_0_2_3" tabindex="3" type="radio">
        <label for="tmcp_choice_0_2_3"><img class="tmlazy  radio_image tm-tooltip" alt="Ольха" src="https://dusha-domy.ru/wp-content/uploads/2016/06/Olha.jpg" data-tm-tooltip-swatch="on"><span class="tc-label radio_image_label" style="display: none;">Ольха</span></label>    <span class="price tc-price  "></span>        </li><li class="tmcp-field-wrap tm-per-row">
                <input class="tmcp-field tm-epo-field tmcp-radio use_images" name="tmcp_radio_0" data-price="" data-rules="[&quot;&quot;]" data-original-rules="[&quot;&quot;]" data-rulestype="[&quot;&quot;]" data-image="https://dusha-domy.ru/wp-content/uploads/2016/06/Lajm.jpg" data-imagep="" data-imagel="" value="Лайм_3" id="tmcp_choice_0_3_4" tabindex="4" type="radio">
        <label for="tmcp_choice_0_3_4"><img class="tmlazy  radio_image tm-tooltip" alt="Лайм" src="https://dusha-domy.ru/wp-content/uploads/2016/06/Lajm.jpg" data-tm-tooltip-swatch="on"><span class="tc-label radio_image_label" style="display: none;">Лайм</span></label>    <span class="price tc-price  "></span>        </li><li class="tmcp-field-wrap tm-per-row">
                <input class="tmcp-field tm-epo-field tmcp-radio use_images" name="tmcp_radio_0" data-price="" data-rules="[&quot;&quot;]" data-original-rules="[&quot;&quot;]" data-rulestype="[&quot;&quot;]" data-image="https://dusha-domy.ru/wp-content/uploads/2016/06/Oranzhevyj.jpg" data-imagep="" data-imagel="" value="Оранжевый_4" id="tmcp_choice_0_4_5" tabindex="5" type="radio">
        <label for="tmcp_choice_0_4_5"><img class="tmlazy  radio_image tm-tooltip" alt="Оранжевый" src="https://dusha-domy.ru/wp-content/uploads/2016/06/Oranzhevyj.jpg" data-tm-tooltip-swatch="on"><span class="tc-label radio_image_label" style="display: none;">Оранжевый</span></label>    <span class="price tc-price  "></span>        </li>
    </ul></div>
    </div></div></div></div></li></ul>
    </div>
    </div>
    Если его вставить в страницу (разумеется текстовое наполнение изменить еще надо), то внешне все красиво, но НЕ РАБОТАЕТ!

    Знатоки! Пните меня, пожалуйста, в верном направлении - что прописать и где? :cry:Проблема у меня схожа с этой моей темой. Я упускаю важный момент.
    Могу предположить, что в functions.php или доп.файле необходимо создать функцию, к которой желаемый код будет отсылаться и работать...
     
  4. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Нашла еще такой Вариант:
    Код:
    <script>
    var show;
    function hidetxt(type){
    param=document.getElementById(type);
    if(param.style.display == "none") {
    if(show) show.style.display = "none";
    param.style.display = "block";
    show = param;
    }else param.style.display = "none"
    }
    </script>
    <a onclick="hidetxt('div1'); return false;" href="#" rel="nofollow">Особенности доставки товаров</a>
    <div style="display:none;" id="div1">
    <span style="color: #000000;">В интернет-магазине "Душа Дома" представлены два типа товаров:</span>
    <ul style="text-align: justify;">
         <li><span style="color: #000000;">товары ТК - доставка возможна только</span> <a href="http://dusha-domy.ru/oplata-i-dostavka/transportnaya-kompaniya/">транспортной компанией</a>. <span style="color: #000000;">Доставка осуществляется напрямую со склада поставщика;</span></li>
         <li style="text-align: justify;"><span style="color: #000000;">прочие товары - доставка</span> <a href="http://dusha-domy.ru/oplata-i-dostavka/">любым удобным способом</a>.</li>
    </ul>
    <p style="text-align: justify;"><span style="color: #000000;">Доставка товаров может занимать некоторое время, например, при заказе мебели по индивидуальным размерам. Поэтому при просмотре каталога товаров предлагаем Вам использовать <a href="http://dusha-domy.ru/wishlist/">Список желаний</a>. Таким образом Вы подберете все, что хотите и далее из списка отобранных товаров сможете оформить разные заказы с выбором способа доставки для каждого типа товаров отдельно.</span></p>
    </div>
    </div>
    <div>
    <a onclick="hidetxt('div2'); return false;" href="#" rel="nofollow">Дополнительные опции и варианты дизайна</a>
    <div style="display:none;" id="div2">
    <span style="color: #000000;">У многих товаров доступны дополнительные опции и варианты дизайна. Используйте соответствующие кнопки на странице просмотра товара, если они доступны.</span>
    
    <img class="alignnone wp-image-4410 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii.jpg" alt="кнопка доп.опции" width="386" height="62" />        <img class="alignnone wp-image-4411 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn.jpg" alt="кнопка другой дизайн" width="385" height="62" />
    <h6></h6>
    </div>
    </div>
    <div>
    <a onclick="hidetxt('div3'); return false;" href="#" rel="nofollow">Дизайн под заказ</a>
    <div style="display:none;" id="div3">
    В нашем интернет-магазине кроме дополнительных опций и вариантов дизайна есть возможность заказать свой дизайн. На странице просмотра таких товаров товаров используйте соответствующую кнопку.
    
    <img class="alignnone wp-image-4412 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn.jpg" alt="Кнопка заказать свой дизайн" width="394" height="70" />
    
    Кнопка доступна, если выбран вариант исполнения "Свой дизайн"  <img class="alignnone size-full wp-image-4413" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn.jpg" alt="Вариант исполнения свой дизайн" width="81" height="84" />
    
    В меню индивидуального дизайна необходимо выбрать опции и добавить товар в корзину обычным способом. При оформлении заказа среди платежей необходимо выбрать "Запрос стоимости индивидуального дизайна".
    
    После оформления Ваш заказ попадает в обработку. Оператор корректирует заказ, указывая стоимость выбранных Вами опций индивидуального дизайна. Все внесенные изменения согласуются с Вами по телефону и дублируется сообщениями в личном кабинете.
    
    Просмотреть текущее состояние заказа Вы можете в Личном кабинете в разделе Заказы.
    
    После окончания расчета стоимости Вам необходимо выбрать удобный способ оплаты в личном кабинете в разделе Заказы.
    <h6><strong>Внимание: </strong></h6>
    Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.
    
    Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.
    
    Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.
    
    При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом</a>.
    </div>
    </div>
    Тоже не верно работает. :confused:Просмотреть здесь Полностью изменяет отображение сайдбара.....должно быть как здесь например.
     
  5. searchingman

    searchingman Местный

    Сообщения:
    1.634
    Симпатии:
    553
    Баллы:
    113
    Вам на определенной странице нужно вывести контент в виде блока "Вопросы-ответы" (FAQ) в виде "аккордеона".
    Только зачем придумывать самому решение, если есть плагины ?

    Если бы было так просто любой пример (код) вставлять в любой движок через "копипаст", то не было бы разработчиков, которые занимаются адаптацией скриптов(кода) под разные CMS.
     
    Последнее редактирование: 31 июл 2016
    • Согласен Согласен x 1
  6. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Очередной плагин - очередной груз...:oops:
    Если не найду выход использую плагин...
     
  7. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    :D:D:D:D:D:D Я сделала-а-а-а!:LOL::LOL::LOL::LOL::LOL::LOL::LOL: Тут можно посмотреть.
    Код:
    <script>
    var show;
    function hidetxt(type){
    param=document.getElementById(type);
    if(param.style.display == "none") {
    if(show) show.style.display = "none";
    param.style.display = "block";
    show = param;
    }else param.style.display = "none"
    }
    </script>
    <a onclick="hidetxt('div1'); return false;" href="#" rel="nofollow" style="
        border: 1px solid rgba(0, 0, 0, 0.035);
        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
        margin: 0 0 1em;
        float: left;
        width: 95%;
        padding: 1em;
        color: #23282d;
        font-size: 18px;
        line-height: 1.3;
        font-weight: 700;
    ">Особенности доставки товаров</a>
    <div style="display:none;" id="div1">
    <span style="color: #000000;">ВВ интернет-магазине "Душа Дома" представлены два типа товаров:
    <ul>
         <li>товары ТК - доставка возможна только <a href="http://dusha-domy.ru/oplata-i-dostavka/transportnaya-kompaniya/">транспортной компанией</a>. Доставка осуществляется напрямую со склада поставщика;</li>
         <li>прочие товары - доставка <a href="http://dusha-domy.ru/oplata-i-dostavka/">любым удобным способом</a>.</li>
    </ul>
    Доставка товаров может занимать некоторое время, например, при заказе мебели по индивидуальным размерам. Поэтому при просмотре каталога товаров предлагаем Вам использовать <a href="http://dusha-domy.ru/wishlist/">Список желаний</a>.
    
    На странице просмотра товаров используйте кнопку <img class="alignnone wp-image-4511 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya.jpg" sizes="(max-width: 190px) 100vw, 190px" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya.jpg 190w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-133x30.jpg 133w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-24x5.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-36x8.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-48x11.jpg 48w" alt="кнопка в список желаний" width="190" height="43" data-pin-nopin="true" />
    Таким образом Вы подберете все, что хотите и далее из списка отобранных товаров сможете оформить разные заказы с выбором способа доставки для каждого типа товаров отдельно.<img class="size-full wp-image-4525 aligncenter" src="https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij.jpg" alt="Список желаний" width="276" height="67" /></span>
    </div>
    
    <div>
    <a onclick="hidetxt('div2'); return false;" href="#" rel="nofollow" style="
        border: 1px solid rgba(0, 0, 0, 0.035);
        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
        margin: 0 0 1em;
        float: left;
        width: 95%;
        padding: 1em;
        color: #23282d;
        font-size: 18px;
        line-height: 1.3;
        font-weight: 700;
    ">Дополнительные опции и варианты дизайна</a>
    <div style="display:none;" id="div2">
    <span style="color: #000000;">У многих товаров доступны дополнительные опции и варианты дизайна. Используйте соответствующие кнопки на странице просмотра товара, если они доступны.</span>
    
    <img class="alignnone wp-image-4410 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii.jpg" alt="кнопка доп.опции" width="386" height="62" />        <img class="alignnone wp-image-4411 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn.jpg" alt="кнопка другой дизайн" width="385" height="62" />
    <h6></h6>
    <h6><strong>Внимание: </strong></h6>
    Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.
    
    Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.
    
    Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.
    
    При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом
    </a></div>
    </div>
    <div>
    <a onclick="hidetxt('div3'); return false;" href="#" rel="nofollow" style="
        border: 1px solid rgba(0, 0, 0, 0.035);
        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
        margin: 0 0 1em;
        float: left;
        width: 95%;
        padding: 1em;
        color: #23282d;
        font-size: 18px;
        line-height: 1.3;
        font-weight: 700;
    ">Дизайн под заказ</a>
    <div style="display:none;" id="div3">
    В нашем интернет-магазине кроме дополнительных опций и вариантов дизайна есть возможность заказать свой дизайн. На странице просмотра таких товаров товаров используйте соответствующую кнопку.
    
    <img class="alignnone wp-image-4412 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn.jpg" alt="Кнопка заказать свой дизайн" width="394" height="70" />
    
    Кнопка доступна, если выбран вариант исполнения "Свой дизайн"  <img class="alignnone size-full wp-image-4413" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn.jpg" alt="Вариант исполнения свой дизайн" width="81" height="84" />
    
    В меню индивидуального дизайна необходимо выбрать опции и добавить товар в корзину обычным способом. При оформлении заказа среди платежей необходимо выбрать "Запрос стоимости индивидуального дизайна".
    
    После оформления Ваш заказ попадает в обработку. Оператор корректирует заказ, указывая стоимость выбранных Вами опций индивидуального дизайна. Все внесенные изменения согласуются с Вами по телефону и дублируется сообщениями в личном кабинете.
    
    Просмотреть текущее состояние заказа Вы можете в Личном кабинете в разделе Заказы.
    
    После окончания расчета стоимости Вам необходимо выбрать удобный способ оплаты в личном кабинете в разделе Заказы.
    <h6><strong>Внимание: </strong></h6>
    Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.
    
    Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.
    
    Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.
    
    При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом</a>.
    </div>
    </div>
    Еще надо поработать над внешним восприятием текста, что бы глазу приятно было.
     
    Последнее редактирование: 31 июл 2016
    • Победитель Победитель x 1
  8. ОАА

    ОАА Местный

    Сообщения:
    314
    Симпатии:
    36
    Баллы:
    28
    Один нюанс - я вставила код с помощью Page Builder by SiteOrigin через виджет SiteOrigin Editor в режиме текста.
    Мало ли кому пригодиться. Вот полный код страницы (включая кнопку Перейти в каталог):
    Код:
    <p><script>
    var show;
    function hidetxt(type){
    param=document.getElementById(type);
    if(param.style.display == "none") {
    if(show) show.style.display = "none";
    param.style.display = "block";
    show = param;
    }else param.style.display = "none"
    }
    </script><br>
    <a onclick="hidetxt('div1'); return false;" href="#" rel="nofollow" style="
    border: 1px solid rgba(0, 0, 0, 0.035);
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
    margin: 0 0 1em;
    float: left;
    width: 95%;
    padding: 1em;
    color: #23282d;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    ">Особенности доставки товаров</a></p>
    <span style="color: #000000;">В интернет-магазине "Душа Дома" представлены два типа товаров:<p></p>
    <ul>
    <li>товары ТК - доставка возможна только <a href="http://dusha-domy.ru/oplata-i-dostavka/transportnaya-kompaniya/">транспортной компанией</a>. Доставка осуществляется напрямую со склада поставщика;</li>
    <li>прочие товары - доставка <a href="http://dusha-domy.ru/oplata-i-dostavka/">любым удобным способом</a>.</li>
    </ul>
    <p>Доставка товаров может занимать некоторое время, например, при заказе мебели по индивидуальным размерам. Поэтому при просмотре каталога товаров предлагаем Вам использовать <a href="http://dusha-domy.ru/wishlist/">Список желаний</a>.</p>
    <p>На странице просмотра товаров используйте кнопку&nbsp;<img class="alignnone wp-image-4511 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya.jpg" sizes="(max-width: 190px) 100vw, 190px" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya.jpg 190w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-133x30.jpg 133w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-24x5.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-36x8.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/V-zhelaniya-48x11.jpg 48w" alt="кнопка в список желаний" width="190" height="43" data-pin-nopin="true"><br>
    Таким образом Вы подберете все, что хотите и далее из списка&nbsp;отобранных товаров сможете оформить разные заказы с выбором способа доставки для каждого типа товаров отдельно.<img class="size-full wp-image-4525 aligncenter" src="https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij.jpg" alt="Список желаний" width="276" height="67" srcset="https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij.jpg 276w, https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij-124x30.jpg 124w, https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij-24x6.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij-36x9.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij-48x12.jpg 48w, https://dusha-domy.ru/wp-content/uploads/2016/04/Spisok-zhelanij-272x67.jpg 272w" sizes="(max-width: 276px) 100vw, 276px">
    </p></span>
    <a onclick="hidetxt('div2'); return false;" href="#" rel="nofollow" style="
    border: 1px solid rgba(0, 0, 0, 0.035);
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
    margin: 0 0 1em;
    float: left;
    width: 95%;
    padding: 1em;
    color: #23282d;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    ">Дополнительные опции и варианты дизайна</a><p></p>
    <span style="color: #000000;">У многих товаров доступны дополнительные опции и варианты дизайна. Используйте соответствующие кнопки на странице просмотра товара, если они доступны.</span><p></p>
    <p><img class="alignnone wp-image-4410 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii.jpg" alt="кнопка доп.опции" width="386" height="62" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii.jpg 386w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii-300x48.jpg 300w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii-187x30.jpg 187w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii-24x4.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii-36x6.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-dop.optsii-48x8.jpg 48w" sizes="(max-width: 386px) 100vw, 386px">        <img class="alignnone wp-image-4411 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn.jpg" alt="кнопка другой дизайн" width="385" height="62" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn.jpg 385w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn-300x48.jpg 300w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn-186x30.jpg 186w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn-24x4.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn-36x6.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/knopka-drugoj-dizajn-48x8.jpg 48w" sizes="(max-width: 385px) 100vw, 385px"></p>
    <h6></h6>
    <h6><strong>Внимание: </strong></h6>
    <p>Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.</p>
    <p>Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.</p>
    <p>Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.</p>
    <p>При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом<br>
    </a></p>
    <a onclick="hidetxt('div3'); return false;" href="#" rel="nofollow" style="
    border: 1px solid rgba(0, 0, 0, 0.035);
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%);
    margin: 0 0 1em;
    float: left;
    width: 95%;
    padding: 1em;
    color: #23282d;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    ">Дизайн под заказ</a><p></p>
    В нашем интернет-магазине кроме дополнительных опций и вариантов дизайна есть возможность заказать свой дизайн. На странице просмотра таких товаров товаров используйте соответствующую кнопку.<p></p>
    <p><img class="alignnone wp-image-4412 size-full" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn.jpg" alt="Кнопка заказать свой дизайн" width="394" height="70" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn.jpg 394w, https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn-300x53.jpg 300w, https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn-169x30.jpg 169w, https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn-24x4.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn-36x6.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/Knopka-zakazat-svoj-dizajn-48x9.jpg 48w" sizes="(max-width: 394px) 100vw, 394px"></p>
    <p>Кнопка доступна, если выбран вариант исполнения "Свой дизайн"  <img class="alignnone size-full wp-image-4413" src="https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn.jpg" alt="Вариант исполнения свой дизайн" width="81" height="84" srcset="https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn.jpg 81w, https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn-29x30.jpg 29w, https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn-24x24.jpg 24w, https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn-36x36.jpg 36w, https://dusha-domy.ru/wp-content/uploads/2016/05/Variant-ispolneniya-svoj-dizajn-46x48.jpg 46w" sizes="(max-width: 81px) 100vw, 81px"></p>
    <p>В меню индивидуального дизайна необходимо выбрать опции и добавить товар в корзину обычным способом. При оформлении заказа среди платежей необходимо выбрать "Запрос стоимости индивидуального дизайна".</p>
    <p>После оформления Ваш заказ попадает в обработку. Оператор корректирует заказ, указывая стоимость выбранных Вами опций индивидуального дизайна. Все внесенные изменения согласуются с Вами по телефону и дублируется сообщениями в личном кабинете.</p>
    <p>Просмотреть текущее состояние заказа Вы можете в Личном кабинете в разделе Заказы.</p>
    <p>После окончания расчета стоимости Вам необходимо выбрать удобный способ оплаты в личном кабинете в разделе Заказы.</p>
    <h6><strong>Внимание: </strong></h6>
    <p>Покупатель несет ответственность за выбор характеристик при изготовлении Товара под заказ. Выбор характеристик считается окончательным после оформления заказа на сайте.</p>
    <p>Изменение характеристик возможно только в том случае, если заказ еще не отправлен на изготовление.</p>
    <p>Изменение характеристик Товара находящегося в процессе изготовления влечет к увеличению стоимости Заказа. Покупатель обязан возместить сумму, на которую увеличена стоимость Заказа в результате изменения характеристик Товара.</p>
    <p>При возникновении вопросов Вы можете связаться с нами <a href="http://dusha-domy.ru/kontakty/">любым удобным способом</a>.
    </p>
    <a class="ow-button-hover" href="https://dusha-domy.ru/katalog/">
    <span>
    <span class="sow-icon-elegantline" data-sow-icon=""></span>
    Перейти в каталог        </span>
    </a>