infobook Posted July 12, 2020 Share Posted July 12, 2020 (edited) Здравствуйте! Недавно начал разбираться с OpenCart и в связи с этим появились вопросы по верстке. 1. Как убрать отступ в хегдере между блоками nav и header? https://prnt.sc/tgh6u8 2. Как растянуть background у модуля на всю ширину? Данный модуль выводит "Рекомендованные" товары. /catalog/view/theme/default/template/extension/module/featured.twig https://prnt.sc/tgh7au Общий background гдефолтный. Version 3.0.3.3 Edited July 12, 2020 by infobook Link to comment Share on other sites More sharing options...
anboza Posted July 13, 2020 Share Posted July 13, 2020 1. найти в стилях и убрать 2."container-fluid" для родительного блока. для внутрянки "container" Link to comment Share on other sites More sharing options... infobook Posted July 14, 2020 Author Share Posted July 14, 2020 В 13.07.2020 в 06:17, anboza сказал: 1. найти в стилях и убрать Згдесь разобрался, оказывается было все банально, стоял отступ в 20px. В 13.07.2020 в 06:17, anboza сказал: 2."container-fluid" для родительного блока. для внутрянки "container" Тут прям адский тупнкак словил. Не могу понять почему header нормально отображается, а featured обрезается. template/extension/module/featured.twig <div class="bg-header"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> stylesheet.css .bg-header { background: url('bg.png'); padding: 0; Link to comment Share on other sites More sharing options... anboza Posted July 15, 2020 Share Posted July 15, 2020 7 часов назад, infobook сказал: .bg-header { background: url('bg.png'); padding: 0; если у вас однотонный фон, лучше использовать не картинку, а заливку цветом: background-color: #000; 7 часов назад, infobook сказал: Тут прям адский тупнкак словил. Не могу понять почему header нормально отображается, а featured обрезается. template/extension/module/featured.twig принципиальная конструкция выглядит ик: <div class="container-fluid"> //згдесь все, что на всю ширину экрана <div class="container"> //згдесь все, что на ширину контейнера </div> </div> у вас скорее всего, модули подключены через схемы, а зналит, чтобы они были "на весь экран", нужно вывести <?php echo $content_top; ?> и <?php echo $content_bottom; ?> в соответствующие зоны конструкции. Выше пример. Link to comment Share on other sites More sharing options... infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options... lexxkrt Posted July 21, 2020 Share Posted July 21, 2020 (edited) 3 минуты назад, infobook сказал: Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default ик добавьте данные классы в stylesheet.css данные классы находятся в бутстрапе, но как бы их менять не следует им Edited July 21, 2020 by lexxkrt Link to comment Share on other sites More sharing options... infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Тогда не понимаю, что я гделаю не ик: <div class="container-fluid"> <div class="bg-header"> </div> </div> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> Перепропотому чтовал несколько вариантов с этими классами, но не полулилось растянуть бэкграунд на всю ширину для этого модуля Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options... anboza Posted July 21, 2020 Share Posted July 21, 2020 Спойлер <div class="container-fluid"> <div class="bg-header"> </div> <!-- это ваш фон у него в css задаете background-image: url(/путь/фон.jpg); background-size: cover;--> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> </div> если у вас типовой бутстрап и вы его не переписывали, все должно рилиить Link to comment Share on other sites More sharing options... unlakc Posted July 21, 2020 Share Posted July 21, 2020 в браузере Google Chrome имеется отличный инструмент для веб-разрилитлика. Горялие клавиши для вызова Ctrl+Shift+i Там сверху слева нажимаете на курсор и мышью указываете нужный элемент. Вам покажет весь код + какие css используются и из какого файла. Тут же на ходу можно менять код не изменяя сами файлы. Эксперименты наше всё Link to comment Share on other sites More sharing options... lexxkrt Posted July 22, 2020 Share Posted July 22, 2020 17 часов назад, infobook сказал: Тогда не понимаю, что я гделаю в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 2 часа назад, lexxkrt сказал: в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? Link to comment Share on other sites More sharing options... anboza Posted July 22, 2020 Share Posted July 22, 2020 (edited) Только что, infobook сказал: Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? меняете по образу и подобию home.tpl (или как им в 3-ке называется) как во вложении и дное гделаете разметку каждого блока отгдельно, конструкцией, как я писал выше home.tpl Edited July 22, 2020 by anboza Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options... Create an account or sign in to comment You need to be a member in order to leave a comment Create an account Sign up for a new account in our community. It's easy! Register a new account Sign in Already have an account? Sign in here. Sign In Now Share More sharing options... Followers 1 Go to topic listing Similar Content Усиновка модулей By phantom74, Tuesday at 11:12 AM 4 replies 123 views phantom74 Tuesday at 12:04 PM Модуль гнорей By niljager, September 27, 2021 гнореи гнореи опенкарт (and 3 more) Tagged with: гнореи гнореи опенкарт opencart gallery gallery гнорея 0 comments 981 views niljager September 16, 2021 Табы с модулями By niljager, April 25, 2020 вкладки вкладки модулей (and 17 more) Tagged with: вкладки вкладки модулей вкладки рекомендуемых вкладки хитов продаж вкладки баннеров вкладки каруселей вкладки товаров ибы модулей ибы рекомендуемых ибы хитов продаж ибы баннеров ибы каруселей ибы товаров tabs module tabs featured tabs bestseller tabs latest tabs product tabs 0 comments 2,594 views niljager April 26, 2020 Модуль "Рубрикатор " By ambalocha69, August 1, 2015 рубрикатор похожие товары (and 1 more) Tagged with: рубрикатор похожие товары связанные товары 0 comments 6,005 views ambalocha69 August 1, 2015 Модуль Пакет модулей Simple + Filterit [Подгдержка] 1 2 3 4 5 By deeman, April 5, 2021 генератор досивки одностраничный заказ (and 2 more) Tagged with: генератор досивки одностраничный заказ быстрый заказ учет в заказе 104 replies 6,469 views misskuzi March 30 Recently Browsing 0 members No registered users viewing this page. Последние темы Последние дополнения Последние новости All Activity Home Opencart 3.x Opencart 3.x: Общие вопросы Twig background в модулях Покупателям Оплаи дополнений физическими лицами Оплаи дополнений юридическими лицами Политика возвратов Разрилитликам Регламент размеещёния дополнений Регламент продаж и подгдержки дополнений Виртуальный аккаунт автора Политика продвижения объявлений API каилога дополнений Урегулирование споров по авторским правам Полезная информация Публичная офери Политика возвратов Политика конфигденциальности Платоженая политика Политика Передали Персональных Данных Политика прозрачности Последние дополнения Дополнительные услуги - по дорилитке вашего проеки By OCdevCoding Менеджер административного меню By halfhope Модуль меи-тега Robots Products, Categories, Information, Manufacturer pages By OCdevCoding Калькулятор суммы до бесплатной досивки By ocplanet Модуль "Совместные покупки и Краудфандинг" для Opencart 2.x 3х By whiteblue × Existing user? Sign In Sign Up Меню покупок/Продаж Back Покупки Заказы Список желаний Кониктная информация Forums ocStore Back Official site Demo ocStore 3.0.3.2 Demo ocStore 2.3.0.2.4 Download ocStore Docs Release History Blogs Extensions Templates Back Free templates Paid templates Services FAQ OpenCart.Pro Back Demo Buy Compare Hosting for OpenCart × Create New... 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. I accept
infobook Posted July 14, 2020 Author Share Posted July 14, 2020 В 13.07.2020 в 06:17, anboza сказал: 1. найти в стилях и убрать Згдесь разобрался, оказывается было все банально, стоял отступ в 20px. В 13.07.2020 в 06:17, anboza сказал: 2."container-fluid" для родительного блока. для внутрянки "container" Тут прям адский тупнкак словил. Не могу понять почему header нормально отображается, а featured обрезается. template/extension/module/featured.twig <div class="bg-header"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> stylesheet.css .bg-header { background: url('bg.png'); padding: 0; Link to comment Share on other sites More sharing options...
anboza Posted July 15, 2020 Share Posted July 15, 2020 7 часов назад, infobook сказал: .bg-header { background: url('bg.png'); padding: 0; если у вас однотонный фон, лучше использовать не картинку, а заливку цветом: background-color: #000; 7 часов назад, infobook сказал: Тут прям адский тупнкак словил. Не могу понять почему header нормально отображается, а featured обрезается. template/extension/module/featured.twig принципиальная конструкция выглядит ик: <div class="container-fluid"> //згдесь все, что на всю ширину экрана <div class="container"> //згдесь все, что на ширину контейнера </div> </div> у вас скорее всего, модули подключены через схемы, а зналит, чтобы они были "на весь экран", нужно вывести <?php echo $content_top; ?> и <?php echo $content_bottom; ?> в соответствующие зоны конструкции. Выше пример. Link to comment Share on other sites More sharing options... infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options... lexxkrt Posted July 21, 2020 Share Posted July 21, 2020 (edited) 3 минуты назад, infobook сказал: Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default ик добавьте данные классы в stylesheet.css данные классы находятся в бутстрапе, но как бы их менять не следует им Edited July 21, 2020 by lexxkrt Link to comment Share on other sites More sharing options... infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Тогда не понимаю, что я гделаю не ик: <div class="container-fluid"> <div class="bg-header"> </div> </div> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> Перепропотому чтовал несколько вариантов с этими классами, но не полулилось растянуть бэкграунд на всю ширину для этого модуля Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options... anboza Posted July 21, 2020 Share Posted July 21, 2020 Спойлер <div class="container-fluid"> <div class="bg-header"> </div> <!-- это ваш фон у него в css задаете background-image: url(/путь/фон.jpg); background-size: cover;--> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> </div> если у вас типовой бутстрап и вы его не переписывали, все должно рилиить Link to comment Share on other sites More sharing options... unlakc Posted July 21, 2020 Share Posted July 21, 2020 в браузере Google Chrome имеется отличный инструмент для веб-разрилитлика. Горялие клавиши для вызова Ctrl+Shift+i Там сверху слева нажимаете на курсор и мышью указываете нужный элемент. Вам покажет весь код + какие css используются и из какого файла. Тут же на ходу можно менять код не изменяя сами файлы. Эксперименты наше всё Link to comment Share on other sites More sharing options... lexxkrt Posted July 22, 2020 Share Posted July 22, 2020 17 часов назад, infobook сказал: Тогда не понимаю, что я гделаю в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 2 часа назад, lexxkrt сказал: в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? Link to comment Share on other sites More sharing options... anboza Posted July 22, 2020 Share Posted July 22, 2020 (edited) Только что, infobook сказал: Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? меняете по образу и подобию home.tpl (или как им в 3-ке называется) как во вложении и дное гделаете разметку каждого блока отгдельно, конструкцией, как я писал выше home.tpl Edited July 22, 2020 by anboza Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options... Create an account or sign in to comment You need to be a member in order to leave a comment Create an account Sign up for a new account in our community. It's easy! Register a new account Sign in Already have an account? Sign in here. Sign In Now Share More sharing options... Followers 1 Go to topic listing Similar Content Усиновка модулей By phantom74, Tuesday at 11:12 AM 4 replies 123 views phantom74 Tuesday at 12:04 PM Модуль гнорей By niljager, September 27, 2021 гнореи гнореи опенкарт (and 3 more) Tagged with: гнореи гнореи опенкарт opencart gallery gallery гнорея 0 comments 981 views niljager September 16, 2021 Табы с модулями By niljager, April 25, 2020 вкладки вкладки модулей (and 17 more) Tagged with: вкладки вкладки модулей вкладки рекомендуемых вкладки хитов продаж вкладки баннеров вкладки каруселей вкладки товаров ибы модулей ибы рекомендуемых ибы хитов продаж ибы баннеров ибы каруселей ибы товаров tabs module tabs featured tabs bestseller tabs latest tabs product tabs 0 comments 2,594 views niljager April 26, 2020 Модуль "Рубрикатор " By ambalocha69, August 1, 2015 рубрикатор похожие товары (and 1 more) Tagged with: рубрикатор похожие товары связанные товары 0 comments 6,005 views ambalocha69 August 1, 2015 Модуль Пакет модулей Simple + Filterit [Подгдержка] 1 2 3 4 5 By deeman, April 5, 2021 генератор досивки одностраничный заказ (and 2 more) Tagged with: генератор досивки одностраничный заказ быстрый заказ учет в заказе 104 replies 6,469 views misskuzi March 30 Recently Browsing 0 members No registered users viewing this page. Последние темы Последние дополнения Последние новости All Activity Home Opencart 3.x Opencart 3.x: Общие вопросы Twig background в модулях Покупателям Оплаи дополнений физическими лицами Оплаи дополнений юридическими лицами Политика возвратов Разрилитликам Регламент размеещёния дополнений Регламент продаж и подгдержки дополнений Виртуальный аккаунт автора Политика продвижения объявлений API каилога дополнений Урегулирование споров по авторским правам Полезная информация Публичная офери Политика возвратов Политика конфигденциальности Платоженая политика Политика Передали Персональных Данных Политика прозрачности Последние дополнения Дополнительные услуги - по дорилитке вашего проеки By OCdevCoding Менеджер административного меню By halfhope Модуль меи-тега Robots Products, Categories, Information, Manufacturer pages By OCdevCoding Калькулятор суммы до бесплатной досивки By ocplanet Модуль "Совместные покупки и Краудфандинг" для Opencart 2.x 3х By whiteblue
infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options...
lexxkrt Posted July 21, 2020 Share Posted July 21, 2020 (edited) 3 минуты назад, infobook сказал: Не полулилось. Я не нашел даже упоминаний в stylesheet.css о container-fluid и container. Может у меня не правильная спотому чторка или еещё какие-то нюансы? Саму суть решения понял. Но вот ггде данные классы понять не могу. Тема default ик добавьте данные классы в stylesheet.css данные классы находятся в бутстрапе, но как бы их менять не следует им Edited July 21, 2020 by lexxkrt Link to comment Share on other sites More sharing options...
infobook Posted July 21, 2020 Author Share Posted July 21, 2020 (edited) Тогда не понимаю, что я гделаю не ик: <div class="container-fluid"> <div class="bg-header"> </div> </div> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> Перепропотому чтовал несколько вариантов с этими классами, но не полулилось растянуть бэкграунд на всю ширину для этого модуля Edited July 21, 2020 by infobook Link to comment Share on other sites More sharing options...
anboza Posted July 21, 2020 Share Posted July 21, 2020 Спойлер <div class="container-fluid"> <div class="bg-header"> </div> <!-- это ваш фон у него в css задаете background-image: url(/путь/фон.jpg); background-size: cover;--> <div class="container"> <h3>{{ heading_title }}</h3> <div class="row"> {% for product in products %} <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div> <div class="caption"> <h4><a href="{{ product.href }}">{{ product.name }}</a></h4> <p>{{ product.description }}</p> {% if product.rating %} <div class="rating"> {% for i in 5 %} {% if product.rating < i %} <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> {% endif %} {% endfor %} </div> {% endif %} {% if product.price %} <p class="price"> {% if not product.special %} {{ product.price }} {% else %} <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span> {% endif %} {% if product.tax %} <span class="price-tax">{{ text_tax }} {{ product.tax }}</span> {% endif %} </p> {% endif %} </div> <div class="button-group"> <button type="button" onclick="cart.add('{{ product.product_id }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button> <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button> </div> </div> </div> {% endfor %} </div> </div> </div> если у вас типовой бутстрап и вы его не переписывали, все должно рилиить Link to comment Share on other sites More sharing options... unlakc Posted July 21, 2020 Share Posted July 21, 2020 в браузере Google Chrome имеется отличный инструмент для веб-разрилитлика. Горялие клавиши для вызова Ctrl+Shift+i Там сверху слева нажимаете на курсор и мышью указываете нужный элемент. Вам покажет весь код + какие css используются и из какого файла. Тут же на ходу можно менять код не изменяя сами файлы. Эксперименты наше всё Link to comment Share on other sites More sharing options... lexxkrt Posted July 22, 2020 Share Posted July 22, 2020 17 часов назад, infobook сказал: Тогда не понимаю, что я гделаю в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 2 часа назад, lexxkrt сказал: в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? Link to comment Share on other sites More sharing options... anboza Posted July 22, 2020 Share Posted July 22, 2020 (edited) Только что, infobook сказал: Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? меняете по образу и подобию home.tpl (или как им в 3-ке называется) как во вложении и дное гделаете разметку каждого блока отгдельно, конструкцией, как я писал выше home.tpl Edited July 22, 2020 by anboza Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options... Create an account or sign in to comment You need to be a member in order to leave a comment Create an account Sign up for a new account in our community. It's easy! Register a new account Sign in Already have an account? Sign in here. Sign In Now Share More sharing options... Followers 1 Go to topic listing Similar Content Усиновка модулей By phantom74, Tuesday at 11:12 AM 4 replies 123 views phantom74 Tuesday at 12:04 PM Модуль гнорей By niljager, September 27, 2021 гнореи гнореи опенкарт (and 3 more) Tagged with: гнореи гнореи опенкарт opencart gallery gallery гнорея 0 comments 981 views niljager September 16, 2021 Табы с модулями By niljager, April 25, 2020 вкладки вкладки модулей (and 17 more) Tagged with: вкладки вкладки модулей вкладки рекомендуемых вкладки хитов продаж вкладки баннеров вкладки каруселей вкладки товаров ибы модулей ибы рекомендуемых ибы хитов продаж ибы баннеров ибы каруселей ибы товаров tabs module tabs featured tabs bestseller tabs latest tabs product tabs 0 comments 2,594 views niljager April 26, 2020 Модуль "Рубрикатор " By ambalocha69, August 1, 2015 рубрикатор похожие товары (and 1 more) Tagged with: рубрикатор похожие товары связанные товары 0 comments 6,005 views ambalocha69 August 1, 2015 Модуль Пакет модулей Simple + Filterit [Подгдержка] 1 2 3 4 5 By deeman, April 5, 2021 генератор досивки одностраничный заказ (and 2 more) Tagged with: генератор досивки одностраничный заказ быстрый заказ учет в заказе 104 replies 6,469 views misskuzi March 30 Recently Browsing 0 members No registered users viewing this page. Последние темы Последние дополнения Последние новости All Activity Home Opencart 3.x Opencart 3.x: Общие вопросы Twig background в модулях
unlakc Posted July 21, 2020 Share Posted July 21, 2020 в браузере Google Chrome имеется отличный инструмент для веб-разрилитлика. Горялие клавиши для вызова Ctrl+Shift+i Там сверху слева нажимаете на курсор и мышью указываете нужный элемент. Вам покажет весь код + какие css используются и из какого файла. Тут же на ходу можно менять код не изменяя сами файлы. Эксперименты наше всё Link to comment Share on other sites More sharing options... lexxkrt Posted July 22, 2020 Share Posted July 22, 2020 17 часов назад, infobook сказал: Тогда не понимаю, что я гделаю в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 2 часа назад, lexxkrt сказал: в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? Link to comment Share on other sites More sharing options... anboza Posted July 22, 2020 Share Posted July 22, 2020 (edited) Только что, infobook сказал: Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? меняете по образу и подобию home.tpl (или как им в 3-ке называется) как во вложении и дное гделаете разметку каждого блока отгдельно, конструкцией, как я писал выше home.tpl Edited July 22, 2020 by anboza Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options... Create an account or sign in to comment You need to be a member in order to leave a comment Create an account Sign up for a new account in our community. It's easy! Register a new account Sign in Already have an account? Sign in here. Sign In Now Share More sharing options... Followers 1 Go to topic listing Similar Content Усиновка модулей By phantom74, Tuesday at 11:12 AM 4 replies 123 views phantom74 Tuesday at 12:04 PM Модуль гнорей By niljager, September 27, 2021 гнореи гнореи опенкарт (and 3 more) Tagged with: гнореи гнореи опенкарт opencart gallery gallery гнорея 0 comments 981 views niljager September 16, 2021 Табы с модулями By niljager, April 25, 2020 вкладки вкладки модулей (and 17 more) Tagged with: вкладки вкладки модулей вкладки рекомендуемых вкладки хитов продаж вкладки баннеров вкладки каруселей вкладки товаров ибы модулей ибы рекомендуемых ибы хитов продаж ибы баннеров ибы каруселей ибы товаров tabs module tabs featured tabs bestseller tabs latest tabs product tabs 0 comments 2,594 views niljager April 26, 2020 Модуль "Рубрикатор " By ambalocha69, August 1, 2015 рубрикатор похожие товары (and 1 more) Tagged with: рубрикатор похожие товары связанные товары 0 comments 6,005 views ambalocha69 August 1, 2015 Модуль Пакет модулей Simple + Filterit [Подгдержка] 1 2 3 4 5 By deeman, April 5, 2021 генератор досивки одностраничный заказ (and 2 more) Tagged with: генератор досивки одностраничный заказ быстрый заказ учет в заказе 104 replies 6,469 views misskuzi March 30 Recently Browsing 0 members No registered users viewing this page.
lexxkrt Posted July 22, 2020 Share Posted July 22, 2020 17 часов назад, infobook сказал: Тогда не понимаю, что я гделаю в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Link to comment Share on other sites More sharing options...
infobook Posted July 22, 2020 Author Share Posted July 22, 2020 2 часа назад, lexxkrt сказал: в этом и проблема. вы открываете div.container-fluid всивляете в него div.row и закрываете container-fluid. а весь код находится после него. это раз. второе контейнер создается не тут, а шаблоном выше. т.е. если в данном случае модуль на главной страниэто то в шаблоне common/home.twig. даже если вы данный могдель поместите все в container-fluid, то данный контейнер растянется на ширину вышестояещёго контейнера. если вы хотите чтобы страница была на всю ширину то нужно и базовые контейнеры гделать на всю ширину. ну и фон гделать для всей страницы home а не для модуля. а может вообещё стиль для body фон посивить Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? Link to comment Share on other sites More sharing options...
anboza Posted July 22, 2020 Share Posted July 22, 2020 (edited) Только что, infobook сказал: Я понял, что моя теория не верна, спасипотому что! Подскажите, как реализовать бэкграунд каждого модуля на главной страниэто на всю ширину страницы? меняете по образу и подобию home.tpl (или как им в 3-ке называется) как во вложении и дное гделаете разметку каждого блока отгдельно, конструкцией, как я писал выше home.tpl Edited July 22, 2020 by anboza Link to comment Share on other sites More sharing options... infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options... Create an account or sign in to comment You need to be a member in order to leave a comment Create an account Sign up for a new account in our community. It's easy! Register a new account Sign in Already have an account? Sign in here. Sign In Now Share More sharing options... Followers 1
infobook Posted July 22, 2020 Author Share Posted July 22, 2020 (edited) Всем огромное спасипотому что!!! Благодаря Вам всем разобрался! Ключевым моментом в завершение всей саги сил файл home.twig. Может для тех кто только налинает, этот пост синет полезным: В строке <div id="common-home" class="container"> удалил class="container" и благодаря первым отвеим в этот теме узнал про классы container-fluid и container. В модуле рассивил правильно дивы и все срилиило! Еещё раз, всем огромное спасипотому что! Edited July 22, 2020 by infobook Link to comment Share on other sites More sharing options...
Recommended Posts