Can't properly create full width backgrounds for the landing page

I use the cernoverride theme for our section website: https://mpe-cb.web.cern.ch .

As you can see the background is a total mess. I however managed to use it properly for another website ( https://machine-protection-panel.web.cern.ch ).

How are the settings for the “section” interacting with the settings for the “hero frame” ? In this case I think the section should set the width, while the hero frame should set the background itself.

Hi Cedric

Thanks for posting here!

Please start by clearing the caches of your site. You do this by heading to Configuration → Performance (under Development) → Clear all caches. This will most likely not resolve your issue, but if you have been trying numerous things unsuccessfully, it is nonetheless a good practice as it removes the risk of anything inadvertently lingering around.

If what you are trying to accomplish is a landing page similar to that found on https://home.cern/, what you are really interested in using is a Hero Header. Additionally, if you want several images to display in a carousel like setting, you can achieve this by using Hero Frames. If this indeed is what you wish to create, please hide or remove the current malformed content and otherwise have a look at the tutorial Hero Header | Drupal @ CERN.

If the above does not resolve your issue, please let us know. In any event, I have gone ahead and added myself to the e-group of your website and will thus be able to take a look once they have successfully been synced. Please however note that we are often limited in what support we can provide for websites utilising the CERN Override theme.

Thanks!

Hi again

Just following up as I have now received access to your site: You appear to be using a View to display the image and text instead of a Landing Page Content Type. This is the reason why it is looking the way it is. I reckon the tutorial on the Hero Header will help you accomplish what you want, though if that is not the case, or you encounter other issues, please do not hesitate to reply here.

Thanks!

Hi

Sorry for the late reply.

We followed your suggestions but it seems that the issue is elsewhere. We re-created a landing page (not sure what you meant about the “view”, we had been using the landing page content type from the start) from scratch and in the end we made it work as expected:

  • 3 sections, some “fluid width” others “fluid BG center content”
  • here frames in the topmost section, with a background

All was working really well and it looked like what we have on this other website: https://machine-protection-panel.web.cern.ch .

Then created a blog-like thingy, and we added our first content with the article content type.

I forgot to untick “promote on the first page”, so I clicked “save” and the blog post was showing on the main page, simultaneously breaking the whole thing … The full width background is not full width anymore. We think that somehow the left and right columns are “present” and limit the width of the central area. We checked: there are no blocks in these sections and we didn’t define the content for the left and right columns of the section.

You can have a look at the result: https://mpe-cb.web.cern.ch .

We removed the “promote to front page” option, the blog post disapeared from the front page as expected but still, the central area is stuck as it is and we can’t recover a fluid full-width background.

Would you be able to have a look at your website?

One more thing:

https://mpe-cb.web.cern.ch

exhibits the issue as I described.

However I realised that when “forcing” the landing page I have the “good” behaviour (full width background):

https://mpe-cb.web.cern.ch/home

Hi again

I have made a small change to your website; please let me know whether this resolved the issue. If you head to Configuration → Basic site settings and check the Front Page tab, you will note that it now points the default front page to /home as opposed to /node which it did previously:

I have also cleared the caches, so changes will be reflected in your browser, too.

Thanks!

Thanks, it works.

Do we have any idea what happened?