Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #50993
    Rebecca
    Guest

    I am trying to increase the top margin of blog page because the page content is overlapping my header image. To do this, I click on the uppermost section of the page body and navigate to “advanced controls” and “margins.” I have adjusted this to over 50 and click “update” and “view changes” but there does not appear to be any movement of the page content at all. It seems to be stuck where it is. Any suggestions how to fix this are much appreciated.

    #51476
    Brandon C
    Keymaster

    Hi Rebecca!

    Thanks so much for reaching out thank you for using Resolve WordPress theme with BoldGrid Post and Page Builder for WordPress!

    I think the issues with the controls are due to Resolve being of our V1 (Legacy) themes. You should be able to adjust the margin with custom CSS. You’d need to navigate to Customize > Advanced > Custom JS & CSS and paste something like this line into your Custom Theme CSS:

    .entry-content .row>* {
        max-width: 100%;
        margin-top: 100px;
    }
    

    You may need to adjust the margin px size a bit but this should get you close to where you need to be.

    If you’re interested in using a theme that gives you total control over your site elements without using any code, I recommend checking out our Crio Pro WordPress theme, which seamlessly integrates with Post and Page Builder.

    I hope this helps. Please let us know if there’s anything else that we can answer for you.

    #51640
    Rebecca
    Guest

    When I added that custom code, the only element affected was the space between the blog title and the image. I adjusted the amount for the “margin-top.” Here is what the custom CSS looks like:
    .boldgrid-css{ background: white; }
    .palette-primary .site-title a { color: #222222; }
    .site-header .background-accent {
    display: none;
    }
    .bg-box {
    min-height: 95%;
    }
    .palette-primary .site-title a:hover { color: #222222; }
    .entry-content { padding-top: 0px !important; }
    .entry-content .row>* {
    max-width: 100%;
    margin-top: 1px;
    }

    I need help getting all my page content to appear below the header image. In the editor this is what it looks like:
    Blog-view-in-editor
    My site is having issues with the editor view not matching the actual published site seen here:
    Blog-view-actual-site

    How can I fix this?

    #51721
    Brandon C
    Keymaster

    Thank you Rebecca,

    I apologize, I’m using chrome browser tools to inspect your site and I may have selected the wrong element.

    Try replacing the current CSS snippet with this:

    .widget.well, .widget.well .site-info a, .widget.well a {
    color: #333;
    margin-top: 380px;
    }

    I hope this works for you! Please reach back out if you have further questions on this matter.

    #52183
    Rebecca
    Guest

    Thank you! This worked for me.

    #52195
    Brandon C
    Keymaster

    That’s great to hear Rebecca!

    I hope I’ve answered everything for you. Be sure to reach back out if you have any other questions for us!

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘How do I increase the top margin of blog page in BoldGrid Revolve theme?’ is closed to new replies.