• Hi

    I created a page that has a scrollable column of post listings in the left column, and a single post in the right column. I look for clicks on the posts in the left column using jQuery and load the relevant post in the right column using ajax and jQuery. No page refresh. I do it primarily to prevent a refresh of the left column on page load.

    Its working perfectly except for block editor items like a slideshow, or gallery. The required CSS and JS doesn’t seem to be written in page via the_content(). I found this:

    https://github.com/WordPress/gutenberg/issues/2768

    and this:

    https://stackoverflow.com/questions/72635660/inline-styles-for-gutenberg-blocks-not-rendering-when-content-fetched-with-ajax

    Am I right in thinking blocks require inline css and js? When does that get added to the page? Can I force it? It seems like in my example above, when the page first loads, blocks are rendered on the post side, but when I add a post to the right side via ajax and jQuery, the blocks are not rendered. is wp_footer() the key?

    Any advice, guidance, pointers, flicks in the ear (??), greatly apprecaited. Thank you!

    Regards
    Mike

Viewing 2 replies - 1 through 2 (of 2 total)
  • If content is loaded via AJAX that requires JavaScript, the loaded content must be subsequently parsed again by JavaScript. I think CSS does not need to be loaded separately, it should already come with AJAX.

    There is a working solution posted under the stackoverflow link. Have you already tried that? Otherwise, there might be the right place to go if you have a problem with this solution there.

    Thread Starter bigflannel

    (@bigflannel)

    Thanks @threadi

    I tried the stackflow solution and it seemed to bring in the inline css, but did not result in the content being parsed again by javascript.

    I’ll keep searching for an answer.

    Regards
    Mike

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Rendering Blocks Loaded Via AJAX’ is closed to new replies.