Procedure to add Full-width column SPFx webpart without fat banner, any horizontal margin or padding, or users' comments

Modern SharePoint pages support layouts that allow users to organize the information they present on their pages. When you add a custom webpart, the default behavior is like below screenshot.

There are some cases that users would like to have a pages modern SharePoint pages with custom SPFx webpart without fat banner, without any horizontal margin or padding, or users' comments as highlighted from the screenshot. This has been reflected in user voice. Here are the detailed steps to implement.

1. The first step is to remove the fat banner on the page like communication modern page. There are at least two different ways to implement this. The difficult way is to develop and deploy a custom SPFx webpart to hide it as described in Mikael Svenson’s blog.  Another easy way is to copy the home.aspx page and rename to your page. Then this page will NOT have the fat banner as described in Rajesh Sitaraman’s blog.

2. The second step is to implement the SPFx as Full-width webpart. This can be done quickly by adding the below configuration code to the YourWebPart.manifest.jason file\ as described in Microsoft’s blog.  

"supportsFullBleed": true,

Then you need to add this webpart as Full-width column webpart. You might need to go to the “Site Pages” library and then click “Site Page” on the ribbon in order to get the Full-width column webpart option for the page. Sometime you would not see Full-width column webpart option if you click “App Page”.

3. The third step is to hide the user Comments. This can be done quickly by following the instruction provided by Greg. 

The updated page with the same webpart now displays much clean as in the below screenshot.

4. The forth thing is to remove the "Feedback" button. This is similar to we described before to use SPFx webpart to hide it as described in Harjit’s blog. 

5. The final one is to remove the "Like" "Save for later" at the bottom of the page. We may also use SPFx with css to hide this as in previous session.

I've not implement step 4 or 5 yest but the page already look much clean. Hope this would help.