How we can add container for inner page template not in home page in magento 2.2.6?

  • can you please more elaborate your question little more that what exactly you want so that someone can help you in better way! Oct 29 '18 at 5:03
  • Please check this screenshot "prntscr.com/lbn3iu" . how to design this ? please let me know.
    – neha rani
    Oct 29 '18 at 5:15
  • i want to add container class in inner pages layout template...
    – neha rani
    Oct 29 '18 at 5:16
  • inner pages, means only cms pages ? and which layout are you using also do you have separate page-layout for home page? 1column, 2columns-left, 2columns-right Oct 29 '18 at 5:25
  • i am using for home page "custom-home" layout and for inner pages 1column.
    – neha rani
    Oct 29 '18 at 5:27

you can add / update your main.content container in default.xml file with code below, it will add two divs container-inner-a and container-inner-b after main container.:

<referenceContainer name="main.content">
    <container name="container-inner-a" htmlTag="div" htmlClass="container">
         <container name="container-inner-b" htmlTag="div" htmlClass="row">
            <container htmlTag="div" htmlClass="row" name="div-content-row">
                <container name="columns" />

This is how you need to update you layout file and change div names / numbers as required.

NOTE : this will add additional div on all page / layout. For home page you can get that page css class and change its width accordingly.

  • i apply this code but this also applied on our home page "prntscr.com/lbne4h"
    – neha rani
    Oct 29 '18 at 5:53
  • yes this will add on all pages, for home page you can add css class to change width . check your page body there you will find class "cms-index-index", using that class change width of home page. otherwise you have to edit all layout files and add this code. Oct 29 '18 at 5:56
  • Please can you explain in detail. on home page our body class"prntscr.com/lbnh88" and for inner pages "prntscr.com/lbniwd".
    – neha rani
    Oct 29 '18 at 6:12
  • for example , newly added div class is "container-inner-a" and you are on home page. so your home page body class added is "cms-index-index" then my home page css would be .cms-index-index .container-inner-a container { width : 100% } to give 100% width on home page. Oct 29 '18 at 6:17

To write custom HTML into your magento CMS-Pages Just do follow the below given steps.

  • Just go to Admin(Back-end) > CONTENT > Elements > Pages.
  • Click on add new page or if you want to edit already existing page click on select > Edit (Please refer this image).
  • In that page go to Content > Click on Show / Hide Editor to get the HTML editor section instead of the way wysiwyg editor (Please refer this image).
  • Now you can write your HTML code here into this section (Please refer this image)
  • To write css for this page you can write css into your default css of your theme
  • Do click on save button after making your changes there in the back-end & check the front-end for the changes done. If not getting the changes you made there on the front-end, then flush your cache.

For that you can do it from your back-end & also by executing the command from your terminal just run the below command from your terminal.

php bin/magento cache:flush

Thank You!

  • i know this method but i want to add by code in all products detail page and other pages..
    – neha rani
    Oct 29 '18 at 5:50
  • Are you working with CMS pages or with the product details page? Oct 29 '18 at 6:17
  • i am working both pages
    – neha rani
    Oct 29 '18 at 6:20
  • This answer is for the CMS pages only, what changes you want in your product details page? That's why I told you to elaborate your question with proper steps you taken with some screenshots so that someone can help you better with the thing that you are looking for! Oct 29 '18 at 6:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.