search

wbrowar / craft-grid

A field that lets you content manage CSS Grid in Craft CMS.
Other
18 stars 2 forks source link

Craft XMLHttpRequest page navigation not initiating grid layout on first load #13

Closed jamielaughton closed 4 years ago

jamielaughton commented 4 years ago

My site loads pages using XMLHttpRequest combined with crafts conditional 'extends' tag for page layout e.g.

{% extends (craft.app.request.isAjax and not craft.app.request.isLivePreview) ? "_skeleton-layout" : "_layout" %}

If I navigate via XMLHttpRequest to a page containing a grid, from a page without one, the grid is visible but not formatted correctly (all widths are 100%).

Once a page containing a grid is loaded without XMLHttpRequest (by external navigation or refreshing), the grid is then formatted correctly and works as expected on subsequent ajax page navigations.

Any help would be greatly appreciated.

Cheers, Jamie

wbrowar commented 4 years ago

@jamielaughton I think the reason you're not seeing the CSS is because under the hood, Grid is doing the same thing as the {% css %} tag does and appends the CSS to the same location as Craft.

You should be able to get the CSS using this variable: https://github.com/wbrowar/craft-grid#getting-a-grid-value

From there you should be able to put that CSS in a style tag alongside your other grid markup.

Let me know if that doesn't work.