Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Creating a page with an opt-in

  • Hello,
    I am trying to create a new page with a specific look from a page I saw on another website. I’ve put the url of this page in the private area. So the sign up form is in the image

    I can not figure out how to make the look happen on my end. The image has gotten too big at the top and there is too much space between the image and the menu bar. I put my page in the private info as well.

    My layout is as follows container within a container, group, cover, spacer, html

    I didn’t find anything in the library or patterns.

    I still want to keep my logo and menu bar.

    Thank you

  • Hi there,

    There are a few things to address here.

    To reduce the gap between the image and menu bar, remove any top padding applied to the group block containers.

    You also need to reduce the height of the section to match the height of the example site’s section.

  • There are no padding at all on this page at all.
    I was able to get rid of much of the space under customization layout. SO we are making progress.

    I played changing the height on the both the first container and the embedded container and there was no change. I set them for 500 px and tried a percent as well and no change.

    Is there a block or something in the library or a different theme I can pull to get the look as of the other page on the other website in the private info?

    Thank you again

  • You are using WP’s group block and cover block, it’s not something that we can control, they are WP core blocks.

    If you can use GenerateBlocks’ block to re-do the section, we would be more than happy to help!

    To create a similar layout, try using a structure like this:

    - container A
    - container B
      -- your custom HTML code for the form

    Settings for container A:

    1. set background-color to black, set min-height to 600px or any value you like.
    2. add background image, set opacity to 0.5

    Settings for container B:

    1. set margin-top to -300px or so to bring it up and overlay on container A.
    2. set z-index to 1, position to relative so it sits on top of container A.

    Let me know if this helps!

  • I didn’t realize I wasn’t using GB.
    Thank you very much this works great and I can now tweak it a bit here and there.

  • Awesome! Glad to hear that 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.