Hi Ismael,

Yes I did it but I have bugs on all the blocks of the home page, in French version and in English version.

Can you login as an admin and check?

I give you the credentials again in the prrivate area.

Thanks!

Hi Mike,

Thank you very much, the issue seems to be solved on the French Version of the Home page in the French version of the site but it seems there is still en issue on mobile on the Englush version, ca you check here: https://www.edunao.com/en/home/ on mobile?

Thanks a lot again!!!

Olivier

Hi Mike,

Thank you, I have copied the code from the forum and now the issue has gone. (I copied from the email in the first place)

The display on desktop is OK now, but I have a new issue on mobile: the height of the second and third slides is much smaller that the height of the fallback image of the video, check on mobile here: https://www.edunao.com/

Any idea to fix this? Is this a conflict between the php code and the CSS I added in the first place? (look at the beginning of the thread)

Thanks a lot again!

Olivier

Oups! Sorry, there is still a bug!

The height of the video slide is smaller on the desktop version now.

This is the CSS we add :

@media only screen and (max-width: 767px) {

/* Add your Mobile Styles here */
.avia-slideshow-inner .avia-slideshow li, .avia-slideshow-inner .avia-slideshow li .avia-slide-wrap {
min-height: 500px;
}

.avia-slideshow li img {
object-fit: cover;
width: 100%;
height: 500px;
}
}

See the desktop version here : https://www.edunao.com/

Can you help on this?

Best regards,

Olivier

Thanks a lot @guenni007 and Rikard!

The bug is partially resolved, the slider no longer displays the alert message.

But the image of the first slide (which is the fallback image of a video) is not the same height on mobile as the images of the other two slides (which are photos). The height of the fallback image is much smaller than the height of the 2 photos.

Can you check on a mobile device here: https://www.edunao.com/ ?

Any idea to fix this?

Thanks a lot again!

Olivier

Hi Rikard,

Thank you very much, it was a silly mistake on my side, but it works now!

You can close the thread.

Best regards,

Olivier

Hi Rikard,

Thank you very much, it works perfectly!

You can close the thread.

Best regards,

Olivier

Hi Rikard,

Thank you very much, it works!

Best regards,

Olivier

It works, thanks again!!!

Best regards,

Olivier

Hi,

The reason I created the sidebar manually is that we need a sidebar only on this page, not on the other pages of the site, so I cannot use WordPress’s sidebar options.

And what if I keep on using the Grid Row element on this page and we just create an exception in additionnal CSS for it? Sort of:

grid-row-container #main .container {
max-width: 917px !important;
width: 917px !important;
margin: auto;
float: none;
}

Could it work?

Thanks again and best regards,

Olivier

Hi Rikard,

Thank you for your answer, here is the design wanted by the designer :
https://xd.adobe.com/view/ba458149-5a98-41f6-975a-3701e4f6b322-ef16/

Does it help?

Best regards,

Olivier

Hi Rikard,

We want to keep the width of the header (menu bar) and the width of the footer to 1310px.

And we want to set the width of the main content of the pages (the body) to 917px, like ont the other pages of the site.

Best regards,

Olivier