Урок 7 Вывести любую статью или страницу в модальном окне
Нередко в процессе доработок приходится сталкиваться с выводом тех или иных статей в модальном (всплывающем) окне. В принципе в опенкарте такая функция предусмотрена по умолчанию. Для этого необходимо просто ссылке, которая ссылается на статью, задать класс
1 |
class="agree" |
Однако проблема в том, что при включенном модуле СЕО ЧПУ данный вариант не срабатывает. Решение достаточно простое и не займет много времени. Достаточно в файле
1 |
common.js |
вашего шаблона добавить следующую функцию
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
$(document).delegate('a.clickmodal', 'click', function(e) { e.preventDefault(); $('#modal-inf').remove(); var element = this; $.ajax({ url: $(element).attr('href'), type: 'get', dataType: 'html', success: function(data) { html = '<div id="modal-inf" class="modal">'; html += ' <div class="modal-dialog">'; html += ' <div class="modal-content">'; html += ' <div class="modal-header">'; html += ' <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>'; html += ' <h4 class="modal-title">' + $(element).text() + '</h4>'; html += ' </div>'; html += ' <div class="modal-body">' + $('#content', data).html() + '</div>'; html += ' </div'; html += ' </div>'; html += '</div>'; $('body').append(html); $('#modal-inf').modal('show'); } }); }); |
После чего любой ссылке на статью достаточно будет присвоить класс
1 |
clickmodal |
В результате ссылка должна иметь следующий вид
1 |
<a href="http://вашсайт.ru/delivery/" class="clickmodal">Доставка</a> |
И теперь текст статьи будет открываться в модальном окне.
P.S. Только учтите, статья должна находиться на Вашем сайте.
Оставить комментарий