Site logo

Archived topic

Idea child Theme - Design Issues

17 replies · Started by Janet Davis on October 26, 2021

Viewing posts 1–15 of 18

Hello,
I am using the Idea Child Theme - Love it - But I need some assistance in tweaking the design. (This is a new build.)

On the about/experience page I am having the following issues on all devices.

1) Large amount of extra white space after the experience block. I tried using the padding to fix this, but then the colored background doesn't cover the lettering area so it can be seen.

2) The Static Page and Archive Hero Element. I was not able to move the dynamic option (Hello World) into the image.

Also if there is an element I like but want to tweak for different criteria is there a way to duplicate it so I don't have to start from scratch?

Thank you
Janet

Hi Janet,

Glad you like the Idea template.

So for question 1, the block is using gradient backgrounds, in your case, you can disable the Use Gradient option under the Background tab: https://docs.generateblocks.com/article/container-overview/#backgrounds

Then add the background color in the colors section.

For question 2, select the block with background image, add a headlineblock to it, then you should be able to choose dynamic options. The video in the below article should be helpful:
https://docs.generatepress.com/article/block-element-page-hero/

And to re-use the elements or sections, you can actually select the block, when the tool bar appears, click on the 3 dots icon, select Copy, then you can paste this block to other elements or pages. Please be noted, the blocks with dynamic features can only work in GP elements, they don't work in pages or posts.

Let me know if you need further assistance :)

Ying,

1) The gradient on this page is disabled and there is a background color chosen that doesn't show up.

2) I was able to get the name in the header but now the image is too huge. I tried to change it but nothing I did help.

thank you

1) Large amount of extra white space after the experience block. I tried using the padding to fix this, but then the colored background doesn’t cover the lettering area so it can be seen.

You have too much padding bottom on it. It has 1750px padding bottom. Any particular reason why this is added?

Can you provide a mockup image of how you want things to be laid out? The 1750px seems to have been added on purpose for something but if you can provide a specific mockup we can follow, perhaps we can offer a better alternative to achieve the same goal w/o doing hacky paddings. :D

2) I was able to get the name in the header but now the image is too huge. I tried to change it but nothing I did help.

You can reduce the min-height value so the portion of image shown will be smaller. :D

The padding at the bottom was the only way I could get the gradient background color from the child theme from GP to cover all of the information so it could be seen since it is white lettering.

Mock up. I want it to look exactly how it is but without the white space.

2) where is this min height value?

Thank you

Can you provide admin login using the private info field so we can take screenshot show you how to set the values exactly?

Let me know :)

I’m not comfortable giving anyone codes to my site.

It’s a GP child theme.
All I did was change the padding on the bottom.

As far as the image I haven’t changed anything for size. I just need to know where.

Can you take screen shots of how it’s suppose to be, and then I can compare?
Thank you

I was able to get the min height issues solved.

The background not so much. I removed the gradient. I put in the code fro color from your vid and it is not the right color on mine. It’s 3 tone and worse

Thank you
Janet

You mean the var(--accent-2) color?

If the site imported before the release of GP 3.1 which has the global colors options, then likely you don't have this color set on your site, so this color won't.

This is the HEX color code for the blue #7b94b5.

The page doesn’t look correct at all. It is two tones at the top, lots of extra space still etc.

The gradient is now off on all devices.
The padding is zero.
There is now large blue space instead of white space.
The paddings are zero

Below the last information there is a great deal of blue space. I checked it on my tablet, phone and desktop. And yes I cleared my cache. I am not sure why it shows differently on your end

This archived topic is closed to new replies.