Unable to view/edit widgets in Hub site

[Veronicampbell]

Hello,

I've started creating a Hub site and created several pages, and have noticed that some of the features (row with images, map, row with text) will be visible in the published site view, but either partially visible or not viewable in the edit session. Is there a way to edit these features? I suppose I could try recreating the pages and adding the content but think this will likely happen again,

Thank you!

[KlaraSchmitt]

Hello,

I am sorry to hear that you are having this problem. Would you be able to share screen-shots so that I can see your issue? Do you have any custom CSS that might be targeting a generic selector (eg. <section>), which could be affecting edit views but not live views due to different parent classes?

[Veronicampbell]

Thank you for the quick response! I attached images of one of the hub pages - one edit and one published version. The "Published Custom Page" shows grey and black the Row and Text at the top, while the "Edit Custom Page" only shows a small sliver of the grey box. I've tried clicking it, or inserting a new widget and haven't been able to select it. I'm having this issue on a few other pages as well. I'm looking at the custom script we have and don't see anything different between the pages that are and aren't having issues, but I will keep looking. Thank you for your help with this.

[KlaraSchmitt]

Hi @Veronicampbell,

It looks like you have a custom header. Do you have any CSS that is using position: absolute or position: fixed or top: 0 on your header? To me, it looks like there is some CSS that is locking your header at the top of the page and allowing content to be positioned underneath it. It shouldn't be behaving like that. Custom headers should display as static (meaning they scroll with the site) in edit mode to avoid the problem you're having, but they will display as fixed in live mode. However, you shouldn't need any custom code related to positioning as we handle that for you.

Another possibility is that you might be using the bootstrap class navbar-fixed-top in your custom header HTML. If that is the case, I advise you remove that class and replace it with navbar-static-top. We will ensure that your custom header is fixed on live views, so using the navbar-fixed-top class is unnecessary and could also cause this problem in edit mode. The first line of your custom header HTML should look something like this:

<nav class="navbar navbar-inverse navbar-static-top">

You do not need navbar-inverse. I am using that purely for a difference of colors. But you do want navbar-static-top to be there.