How to make heading page with banner to be like the demo?

In order to create the overlay heading like the above image, you can follow the instrucyion here: 

Step 1: Navigate Appearance > Customize > Blog > Blog Heading. 

  1. Enable the Blog Heading, you also can turn on the Blog Heading On Mobile if you wish show it on mobile.
  2. In the Blog Heading Display section, you can select pages that you want to show the heading.
  3. You can choose Breadrumb style. Select None if you don’t want to show it.
  4. Select Full Width for the Blog Heading Width.
  5. Enter the Height for the heading. (E.g 220 px)

Step 2: You need to choose color and select photo for the heading.

  1. Choose a color.
  2. You can create the overlay by dragging this.
  3. Choose an image.

Step 3: 

  1. Choose Cover for the Background Size.
  2. Choose Scroll for the Background Attachment.
  3. Choose Center for the Heading Text.
  4. Choose color for the text (E.g Black)
Was this page helpful?
Yes No