[Resolved] Cannot duplicate header

[Xhovan]

I am trying to duplicate the header (or dog and text} from https://alwaysgreencarpetcleaner.com/ to https://alwaysgreencarpetcleaner-queens-local.com/ but I can not get it to match. I think it is because the background image starts in the navigation bar in the correct layout. I copied the settings and imported it from the site and still it does not match. Is there a setting I am missing?

[Ying]

Hi there,

The original site has a header element which merges the header with the content.

You can replicate it by creating a new header element, and enabling the merge feature.

[Xhovan]

That did solve a program but the main problem remains. I need to force the text and button to below the navigation. If you look at the target site the text is not displayed. I have the same settings for the two sites but different results. When I look at the settings the padding instead of 75 is 5 and will not be changed. I just want to push the text to below the navigation.

[Ying]

I need to force the text and button to below the navigation. If you look at the target site the text is not displayed

Which text exactly?
https://www.screencast.com/t/Esl6OWeHkz

[Xhovan]

The text is in the navigation but this is it: carpet cleaning first green cleaning company. Basically the padding is not working and I cannot change it in the inside container.

[Ying]

When I look at the settings the padding instead of 75 is 5 and will not be changed

I’m not sure what you mean, the two sites look the same, and the menu items’ paddings are the same which is 14px/15px.
https://www.screencast.com/t/Mdsc0xsYvct

[Xhovan]

sorry the issue is in mobile only

[Xhovan]

I added some custom css and it is better but I dont want the background image to increase in size.

[Ying]

The Buttons block of the target site has 125px margin bottom on mobile, while the original site has a 55px margin bottom on mobile:
Target site:https://www.screencast.com/t/zYauvbJ9C
Original site:https://www.screencast.com/t/ESYLDKw9U

[Xhovan]

Here is the issue. If I place the 55px in the bottom it increase the margin between the 2 containers and creates a large white space. In the original is increases the background image size, which I want.

[Xhovan]

this is a media query that is causing the problem: @media (max-width: 767px)
.gb-button-wrapper-9c764854 {
margin-bottom: 125px;

[Xhovan]

I am making changes and it is better but not matching the requirements.

[Fernando]

Hi Xhovan,

Can you try setting the bottom margin of the Button Wrapper to 55px for mobile view first, and we’ll recheck what’s occurring?

We’ll assess the appropriate solution afterward.

[Xhovan]

ok it is done, I wont make anymore changes but in the source it is increased to 125 @media (max-width: 767px)
.gb-button-wrapper-9c764854 {
margin-bottom: 125px;
}

[Ying]

The container with the background image has a bottom padding on the target site which the original site doesn’t have.

Do you have the access to the target site? If so, you can copy the entire page and paste it to the target site, the 2 pages will be exactly the same.

[Author]

Posts