Extend Header (logo, search box and cart) in Magento 2

Question

I am trying to extend the Header (logo, search box and cart), but those files are the different location. I don't know how to adjust those. Could you please suggest me on this.

Himanshu · Answer

Move search box follow step :

step-1 :- opne Admin 
step-2 :- CONTENT > Block > Home Page Block > show - hide edit button click

add css in style tag

.header.content {
    text-align: center;
}
.block-search {
    float: none;
    display: inline-block;
}

Dipesh Rangani · Answer

Change below style:

.header.content {
    text-align: center;
}

.logo {
    float: none;
    display: inline-block;
}
.block-search {
    float: none;
    display: inline-block;
}
.minicart-wrapper {
    float: none;
}

Change below code in Magento_Checkoutlayoutdefault.xml

Vlad Patru · Answer

The search position is set in the magento-search/view/frontend/layout/default.xml but the issue is that the minicart is set to have the position after "logo" you need to change this in magento-checkout/view/frontend/layout/default.xml change to and after this style the top search so it shouldn't be with a float: right; ( adapt the style as you like ) Also, it is recomanded to make the changes for the checkout module files in app/design/frontend/YOUR_COMPANY/YOUR_THEME/Magento_Checkout/layout/default.xml

Extend Header (logo, search box and cart) in Magento 2

3 Answers

Add your own answers!

Ask a Question