Magento 2.2如何仅移除首页的页眉与页脚？

阿华AIGC实验室

2026-5-20

How to Hide Header and Footer Only on Magento 2.2 Homepage (Multi-Store Setup)

Hey there! Let's tackle this problem of hiding the header and footer exclusively on your Magento 2.2 homepage—perfect for your multi-store setup where the homepage acts as a store entry point. Below are two solid methods to get this done, both tailored to keep other pages fully intact.

Method 1: Use Layout XML (Recommended)

This is the cleanest approach aligned with Magento's best practices, as it avoids modifying template files directly. It works seamlessly across all your stores if you're using a shared theme, or you can apply it per-store by targeting individual themes.

Create/Edit the homepage layout file
Navigate to your theme's layout directory (create it if it doesn't exist):
app/design/frontend/[Your_Vendor]/[Your_Theme]/Magento_Cms/layout/cms_index_index.xml

Add the removal logic
Paste the following XML content into the file. This targets the homepage's layout handle (cms_index_index) and removes the header and footer containers:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <!-- Remove header container -->
        <referenceBlock name="header.container" remove="true"/>
        <!-- Remove footer container -->
        <referenceBlock name="footer-container" remove="true"/>
    </body>
</page>

Clear cache
Run these commands from your Magento root directory to apply the changes:
```
php bin/magento cache:clean
php bin/magento cache:flush
```

Method 2: Conditional Logic in Template Files

If you need more flexibility (e.g., adding extra conditions alongside the homepage check), you can modify the header and footer templates. Remember to override them in your theme instead of editing core files!

For the Header:

Copy the core header template to your theme:
app/design/frontend/[Your_Vendor]/[Your_Theme]/Magento_Theme/templates/html/header.phtml

Add a conditional check at the very top of the file to skip rendering on the homepage:

<?php
$currentAction = $block->getRequest()->getFullActionName();
// Check if we're on the homepage (cms_index_index is the homepage action name)
if ($currentAction === 'cms_index_index') {
    return; // Exit early, don't render the header
}
?>

Copy the core footer template to your theme:
app/design/frontend/[Your_Vendor]/[Your_Theme]/Magento_Theme/templates/html/footer.phtml

Add the same conditional check at the top:

<?php
$currentAction = $block->getRequest()->getFullActionName();
if ($currentAction === 'cms_index_index') {
    return; // Exit early, don't render the footer
}
?>

Clear cache as mentioned earlier to see the changes.

Notes for Multi-Store Setup

If each store uses its own theme, repeat the steps above for each theme to ensure all homepages hide the header/footer.
If you're using a single shared theme across all stores, the layout XML or template changes will apply to every store's homepage automatically—exactly what you need!

内容的提问来源于stack exchange，提问作者James