Magento 2.2.5: Блоки добавлены в нижний колонтитул в неправильном порядке
Я работал над темой magento, которая наследуется от Magento/blank
, найденной в http://murkyapparel.com.
Как вы можете видеть, нижний колонтитул выглядит немного беспорядочно. Я мог бы внести некоторые изменения, поэтому вот скриншот для справки:
Чего бы я хотел, так это чего-то вроде этого:
Или это:
(Извините за беспорядочную фотосъемку... я быть ленивым)
Я знаю, что могу использовать атрибуты before="-"
и after="-"
для изменения порядка, но печать comodo всегда размещается после (неработающей) ссылки на мой веб-сайт и не выровнена должным образом.
Я попытался отредактировать встроенные атрибуты float
и display
, используя инспектор кода chrome, с помощью каждой возможной комбинации атрибутов before
и after
, но я не могу найти никакой конфигурации, которая будет работать.
Соответствующие блоки в моем файле default.xml
выглядят следующим образом следует:
<!-- Add joshuaflood.co.uk link to footer block -->
<referenceBlock name="footer">
<block class="Magento\Framework\View\Element\Template" name="jcf-link" template="Magento_Theme::html/jcf_ad_link.phtml" after="-">
<arguments>
<argument name="block_id" xsi:type="string" translate="true">jcf_footer_url</argument>
</arguments>
</block>
</referenceBlock>
<!-- Add Comodo secure seal to footer -->
<referenceBlock name="footer">
<block class="Magento\Framework\View\Element\Template" name="comodo-secure-seal" template="Magento_Theme::html/secure_seal.phtml" after="footer_links">
<arguments>
<argument name="block_id" xsi:type="string" translate="true">comodo_secure_seal</argument>
</arguments>
</block>
</referenceBlock>
Файл jcf_ad_link.phtml
в настоящее время выглядит следующим образом (протестирован со всеми возможными вариантами опции display
в атрибуте style
, поэтому решил полностью удалить его, пока я (или кто-то здесь) решаю(решаю) проблему):
secure_seal.phtml
выглядит так:
<div class="secure_seal" style="float: right;">
<a href="https://www.instantssl.com/ssl-certificate.html" style="text-decoration:none; ">
<img alt="SSL Certificate" src="https://www.instantssl.com/ssl-certificate-images/support/comodo_secure_100x85_transp.png" style="border: 0px;" />
</a>
</div>
Больше нигде нет пользовательских стилей CSS для любого блока. Я знаю, что это не совсем стандарт magento, но я планирую преобразовать большинство из блоков моей темы в отдельные модули, поэтому я просто хочу сначала отсортировать базовый макет и убедиться, что все работает правильно.
Файл _extends.less
в моей пользовательской теме содержит следующие стили нижнего колонтитула:
/* Footer */
.footer.links li {
display: inline;
}
.footer.links li + li:before {
content: " | ";
}
div[id^="st-"] .st-btn {
margin-right: 16px !important;
}
К нижнему колонтитулу или содержащимся в нем элементам не применяется другой пользовательский стиль.
Заранее спасибо!
1 answers
Замените свой less этим обновлением:
.footer{
&.content{
.links{
margin-bottom: 20px;
padding: 0 50px 0 0;
vertical-align: top;
float: left;
}
.secure_seal{
float: right;
}
.jcf_ad_link{
float: none;
clear: right;
}
}
}
Примечание: удалите все встроенные css.