Magento2 – How to add block to contact us page and change the layout

I’ve recently started my journey into Magento 2 loveliness. It’s been ruddy hard to get used to but I can appreciate a lot has changed for the better.

Today a client asked if they could include their address in the contact form page. I remember in M1 it was ridiculously awkward but I found various ways around it. With M2 in its infancy, it doesn’t get any easier to find a reliable guide (Every single Magento blog assumes example is present.

Never fear, I have cobbled together a couple of guides to show you how I sorted this.

  • Step 1 – Create a static block
    Name it something memorable as usual. I won’t go into specifics on how to do this, you’re not an idiot.
  • Step 2 – Configuration (thanks goes to Steve B in the comments)
    1. Go to Content > Widgets
    2. Create new widget and choose CMS Static Block
    3. Add layout update to specific page (Contact us Page), Main Content Top Container
    4. Choose Static Block.
    5. In Layout Updates, select “Sidebar Main” (or wherever you like, but for the purposes of this tutorial, I’ll use the sidebar)
  • Step 3 – Get that contact page working spiffingly.
    1. Create a file app/design/frontend/<vendor>/<theme>/Magento_Contact/layout/contact_index_index.xml
    2. Within that file add the code:

    <?xml version="1.0"?>
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
     <body>
     <referenceBlock name="contactForm">
     <action method="setTemplate">
     <argument name="template" xsi:type="string">Magento_Contact::form.phtml</argument>
     </action>
     </referenceBlock>
     <referenceBlock name="catalog.compare.sidebar" remove="true"/>
     <referenceContainer name="sidebar.additional" remove="true" />
     </body>
    </page>
    

    Essentially the only purpose of this xml file is to change the contact page to a 2 column template (so it accepts our new information).

    You’ll also notice I removed the wishlist and compare blocks. My site didn’t have these turned off, so they were appearing below the new text.

 

Obviously clear the cache and do what you need to do.

That should all be ok for you now. Happy Magento 2’ing!