Project

General

Profile

Bootstrap: bad rendering on initial page loading

Added by Emeric Poupon almost 4 years ago

Hi!

I am experimenting a manual navigation bar using a WTemplate + widget bindings (then without using the WNavigationBar class).

See for example the code of the first navbar here: https://bootswatch.com/3/darkly/

However, I noticed this problematic behavior:

  • if I land on my login page (no navbar) and then display the main page with navbar, it is correctly displayed.
  • if I land directly on the main page (with navbar), it is wrongly displayed (see the search field).

I have other issues with the initial rendering (ex: "labels" are wrongly displayed on Firefox), so I guess this is related to the progressive bootstrap method.

Disabling the progressive boostrap method fixes the problem but then I can't make the mobile responsive view work properly.

Do you know how I can make this work?


Replies (2)

RE: Bootstrap: bad rendering on initial page loading - Added by Emeric Poupon almost 4 years ago

Ok, I kept the progressive bootstrap method disabled and I just put this in "head-matter" of my generated wt_config.xml:

 <head-matter>
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 </head-matter>

(I also put "user-scalable=no" in order to prevent the user to zoom on mobile devices)

It seems to work fine so far. Not sure about the consequences of disabling the progressive bootstrap mode though?

RE: Bootstrap: bad rendering on initial page loading - Added by Roel Standaert almost 4 years ago

Adding that meta tag to the head-matter should have the same effect. Disabling progressive bootstrap should normally lead to fewer issues. The only change will be that things like WApplication::addMetaHeader() won't work anymore.

    (1-2/2)