[Ken]

I added it back once I had determined it had no effect on the problem. I have deleted it once more if you want to take a look.

[Ken]

Just to check the origin of the issue, I deleted all the custom css, limited as it was.
Both problems described above persist with the theme stock standard.
That suggests to me a bug on your end?

Since the issue is not caused by any custom css, how do we go about identifying the origin of the problem and begin solving it?

[Ken]

nope 🙂 that one didn’t do anything to either the desktop or the mobile version ..

[Ken]

Hi Kyle,

That didn’t work unfortunately.

Just to recap so far. We’ve added two scripts
1

#header-sticky-wrapper.is-sticky, header.sticky-header.sticky-header-resized {
  height: 50px !important;
}

That code makes the header which wasn’t resizing on either mobile or desktop resize correctly on desktop. Didn’t fix mobile though.

2

@media only screen and (min-width: 480px) { 
#header-sticky-wrapper {
  height: 80px!important;
}
}

We were trying to alter the static height of the mobile header and make it resize. This code altered the static height of the desktop header, but unfortunately didn’t affect the mobile header either in height or in resizing. I have removed it because the static height of the desktop header is correct without it anyway.

So our challenge remains as per the mobile screenshots above.
Maybe it’s worth noting that previously (before code snippet 1) the desktop logo would resize but not the header (which is fixed by code snippet 1), while on mobile neither the logo nor the header resize.

[Ken]

I’ve attached two screenshots, one on loading and one after scrolling down the page.

On loading the header is at full height (correct) but there is significant space in the header below the logo.

On scrolling, the header doesn’t resize, plus the excess padding remains …

Attachments:

You must be logged in to view attached files.

[Ken]

I’ve added a little from my various support tickets over the last couple months, but not much – here is the sum total ..

#logo a.mobile-menu-show i:after {
content: "MENU";
float: left;
margin-right: 12px;
font-size: 14px;
line-height: 20px;
font-style: normal;
color: #f5f5f5;
}

#top-header .th-left {
  color: #f5f5f5;
}

#logo a.mobile-menu-show {
color: #f5f5f5;
}

.spb_accordion_section.group {
  background-color: #ffffff;
}

.spb_tabs .nav-tabs li a, .spb_tour .nav-tabs li a, .spb_accordion .spb_accordion_section > h3 a {
  background-color: #dd3333;
}

.spb_tabs .nav-tabs li.active a, .spb_tour .nav-tabs li.active a, .spb_accordion .spb_accordion_section > h3.ui-state-active a {
  background-color: #f7f7f7;
}

#header-sticky-wrapper.is-sticky, header.sticky-header.sticky-header-resized {
  height: 50px !important;
}

That’s all that’s been added.

[Ken]

Thanks Kyle,

That works for the desktop version, but not the mobile version.

Any idea what the root of the problem might be. I’m sure if everyone had this problem there would be more support tickets about it, so what might I have done differently to everyone else that’s causing the resize issue?

[Ken]

Thanks Kyle

1. I figured that was a long shot 🙂
I still think it would be a cool idea to have an accordion element with columns like that. Maybe something to think about one day.

2. The colours are sorted. Thanks.

[Ken]

So on the 8th this problem started. 9th it persisted. Today it’s working. I haven’t made any adjustments on the site in that time at all. Very strange. Still can’t upload that 3rd demo theme though.

[Ken]

Hey Rafael,
I’m not with the support team so don’t take my advice as golden but try try the row element found in the swift builder columns drop down menu or the full width text element. You can change the colour of either. You can also set one of your alt backgrounds in theme settings to a pattern (or image I think) and then set that as a background for the row or text block. If using the text block you might want to add no-arrow to the extra class to remove that arrow on the text block depending on what you want to do.

Just my 2 cents 🙂

[Ken]

Oh well 🙂

[Ken]

Ok, done. I didn’t know how to move those other two comments to a new thread so I just started a new one. Only posted them here in case the problem was related to the changes I made above.

[Ken]

When loading the page everthing loads except the slider upon which it hangs on “transfering data from maps.googleapis.com”

appears to be working on the mobile site – when I first noticed the problem it wasn’t working on the mobile site either although I haven’t done anything between then and now.

http://samurdermysteries.co.za/wordpress/

[Ken]

In addition is it possible that any of the above could have broken Layerslider?
It was working before and now it isn’t. Peculiar.

Of the three demo sliders that came with your themeforest download, only the one works now.
From the Layerslider page I deleted one of the malfuntioning sliders and tried to reupload the .json file, but it won’t reupload. I have checked on my server and in the uploads folder all the files from that demo slider are still there. But it doesn’t show in the layerslider admin page.

The slider which was on the page when we started with the above queries is still installed, but no longer works for some reason.

The 3rd demo slider is still installed and does still work.

I don’t see an “uninstall plugin” option in the plugins page. I want to reinstall the whole thing and see if that fixes it. How do I do that?
Any other ideas?

[Ken]

Thanks Kyle.

1) Fixed. Incidentally, the permission was 666 – what does this mean and how did it end up with the incorrect setting?

2)

3)Thanks for the explaination. Playing with the row element now. Pretty cool.

4)Thanks, that code does the job for the header text. I used this css to change the mobile menu so that it also shows up on the black header

#logo a.mobile-menu-show {
color: #f5f5f5;
}

It looks like it does the job correctly, or should I have done it differently?

5) Noticed something interesting here while testing the codes above – If I set the header to number 7 ie using the top header text, then the header scales correctly with the logo. If I revert back to header number 6 then the original problem as posted above returns.

6) Worked perfectly

7) Exactly what I was looking for

Thanks Kyle