[Resolved] Generateblocks–Margin not transparent

Home Forums Support Generateblocks–Margin not transparent

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1487561
    Alexis

    Hi! So I’m working on a website for a client, but when I create a layout the margins around the containers that appear transparent in the editor aren’t transparent in the website itself.

    https://www.dropbox.com/s/ueihm5ov7xopihk/generateblocks1.PNG?dl=0
    https://www.dropbox.com/s/1sk6vyzcx3xk4py/generateblocks2.PNG?dl=0

    Here’s what it looks like in the editor compared to the site. It’s on a local environment otherwise I’d share a link.

    #1487611
    Leo
    Staff
    Customer Support

    Hi there,

    Tough for me to tell without seeing the site live.

    Any chance you can duplicate it on a staging server for us to see?

    Thanks!

    #1487670
    Alexis

    Let me see– I may be able to… I’ll just have to run it on my server until you’ve taken a look. It’s going to be a limited time link.

    a1e34c9fe8a1.ngrok.io

    #1488019
    David
    Staff
    Customer Support

    Hi there,

    sorry the link has expired.

    Is the issue the background color or the space between the Container blocks ?
    Could you share a screenshot of the editor with the Container block selected so i can see the layout?

    #1489095
    Alexis

    Here’s that picture–

    https://www.dropbox.com/s/wqi0ucz1npxv25l/generateblocks3.PNG?dl=0

    And here’s another try at that link– it should work if you can access it today while I’m on the server working.

    2d720efc43ca.ngrok.io

    What is happening is that the margin, instead of showing black as the background of the site is set to, is showing grey. I’m not sure why it’s happening. In the editor, you see it as I want it. In the picture I linked above you can see how it shows up on the website itself. With that grey background.

    #1489447
    Alexis

    I finally managed to get it up on a staging environment. Here’s the link.
    https://alexisrichard.com/riverfrontlimo/staging/6775/

    #1489837
    David
    Staff
    Customer Support

    OK – so what you’re seeing is the Customizer > Color > Content background which is set to that off white color. You can either change that color to ‘black’ – but it will apply to all Theme content backgrounds or if you only want it applied to that Container then you will need to add a Full Width Container Blcok with the black background and then insert your current container inside that.

    #1491113
    Alexis

    So unfortunately that IS set to black already. Here’s a picture.

    https://www.dropbox.com/s/u7mhx6cd5z1z1cr/generateblocks4.PNG?dl=0

    As you can see, the background color for content is set to black already. I’m still having that grey show up however.

    #1491123
    Elvin
    Staff
    Customer Support

    Hi,

    As you can see, the background color for content is set to black already. I’m still having that grey show up however.

    That’s because you have this CSS code added to your additional CSS.

    body.full-width-content .inside-article {
        box-shadow: none;
        background-color: #fafafa;
    }

    It’s overriding your customizer settings. Remove the background-color property here for the customizer background color to apply.

    A wise man once said:
    "Have you cleared your cache?"

    #1491130
    Alexis

    I’m not sure where that’s coming from… I haven’t touched the CSS beyond what’s in the customizer and generate blocks plugin options. I’ll poke around, but it was doing this before I touched much of anything.

    I installed the generatepress theme, put in my credentials and chose one of the site templates. I think it was “vacation” but I could be wrong. First block I started messing with had this issue with the background.

    I’ll try to track down which file that CSS is from and remove it manually though. Thanks for pointing it out.

    #1491135
    Alexis

    After I took a look at the additional CSS like you recommended, it turns out that the site template put in a ton of CSS there. I had absolutely no idea. Thank you so much for pointing it out! I never would have found it because I didn’t know it was there. I wasn’t aware a site template would put additional CSS in that may mess with my own styling of the template later on. That’s good to know.

    #1491139
    Elvin
    Staff
    Customer Support

    I’m not sure where that’s coming from… I haven’t touched the CSS beyond what’s in the customizer and generate blocks plugin options. I’ll poke around, but it was doing this before I touched much of anything.

    When you import a site template from the Site Library, it usually adds things like this.

    When inspecting a WordPress site, you’ll usually see a <style id="wp-custom-css"> tag inside the <head> tag. This is where the CSS codes from Dasboard > Appearance > Customize > Additional CSS are placed on the DOM structure.

    If you inspect your site on chrome (CTRL+SHIFT+I) and look for this, you’ll find the css code I’ve mentioned on the previous reply within this style tag.

    A wise man once said:
    "Have you cleared your cache?"

    #1491142
    Elvin
    Staff
    Customer Support

    After I took a look at the additional CSS like you recommended, it turns out that the site template put in a ton of CSS there. I had absolutely no idea. Thank you so much for pointing it out! I never would have found it because I didn’t know it was there. I wasn’t aware a site template would put additional CSS in that may mess with my own styling of the template later on. That’s good to know.

    Yeah this is important to know because whatever is added in the Additional CSS will override whatever you set on the customizer settings. 🙂

    A wise man once said:
    "Have you cleared your cache?"

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