matteomarchiori / w3csspress

W3CSS universal WordPress theme
GNU General Public License v3.0
6 stars 0 forks source link

Is this a classic or a FSE theme? #3

Closed mateuswetah closed 1 year ago

mateuswetah commented 1 year ago

Hi!

I was doing some tests with several themes for my next project and stumbled into yours. At first, it seemed to promise something that I could not achieve: combining classic php files with theme.json and access to the full site edition interface.

But in my tests, it seems that the site editor doesn't really work. How is the status of this integration? Is it really possible?

matteomarchiori commented 1 year ago

Hi @mateuswetah , thank you for the issue. I thought to the theme as a universal one (still need to update the description and relative translations), you can find a definition here: https://wptavern.com/block-fse-hybrid-universal-what-do-we-call-these-new-wordpress-themes

These days I am quite full of stuff to follow on other projects, anyway, as I see the FSE is now a bit more interactive and good looking compared to two months ago.

I dind't fully understand the problem, can you give me an example of broken test? Or a screenshot of the problem?

mateuswetah commented 1 year ago

Thanks for the answer @matteomarchiori.

It seems that universal theme is exactly what I am looking for. So, in my tests this is happening whenever I enter the Site Editor screen: image

It just stays loading forever. No errors in the console. I suppose it does not help much to debug hehhe

I'm using WP 6.2 BTW.

matteomarchiori commented 1 year ago

Hi @mateuswetah , sorry, I deleted my previous answer as I was wrong.

Still need to do further investigation on the reason why the FSE does not display a first template when loading.

Anyway, if you click on the templates and try to customize and save your one they will work as expected.

matteomarchiori commented 1 year ago

Got the point with the issue, I think it is also the one which breaks the preview of the theme on the wordpress.org website (I stopped working on it since a while, I would explore more on that).

Basically, I want that the theme works on the server side for the majority of operations, without relying too much on the client side, and reducing the JavaScript operations to the minimum possible.

Now, to have the w3css classes applied to the elements of the website the only way I have found to perform this without using selectors on JavaScript is using XML selectors (so XPATHs) on the complete buffer of the page.

There is a point on functions.php which trigger ob_start, which is a PHP function which stores in a buffer the output before it is returned.

At this point I check until the buffer reach a substring "" to understnd when the full page is loaded, I parse it and I add the w3css classes, and other options from the customizer.

As I see, the check for the admin was not working. And if I fix it, it works, but the preview of the website on the admin side is not reflecting what the website shows on the user end.

So basically I will check if there are alternatives to get the whole DOM document on the server side without using the PHP buffer, maybe with some actions and filters provided by WordPress itself.

@mateuswetah if you encountered this kind of issue before let me know, so I can fix it faster. And thank you again for the advice, I didn't pay attention to this kind of behavior of the theme.

mateuswetah commented 1 year ago

Hey @matteomarchiori no rush on that, I know it is a delicate topic.

I might not use the theme in the end due to some project decisions but I'm still interested on the way that you are trying to achieve this because the challenge is similar to some that we have.

At this point I check until the buffer reach a substring "" to understnd when the full page is loaded, I parse it and I add the w3css classes, and other options from the customizer.

About parsing, have you tried the new HTML API that they introduced in version 6.2? It might be useful for the job.

Now, to have the w3css classes applied to the elements of the website the only way I have found to perform this without using selectors on JavaScript is using XML selectors (so XPATHs) on the complete buffer of the page.

It is a bit sad, but I'm more and more getting the feeling that we won't have server-side alternatives to many of the things that you can do in the editor. I'm not sure if what you are looking for can be found here or here. I'm also following some bloggers that sometimes give me insights on how to do this stuff. Here is a post that helped me adding classes to blocks:

https://nickdiego.com/programmatically-add-classes-to-blocks-in-the-wordpress-editor-based-on-attributes/

matteomarchiori commented 1 year ago

Hi @mateuswetah , thank you again for the suggestions. I will document better on the new HTML API (finally, at version 6.2...).

Anyway, as I want to maintain the theme as much possible compatible with older versions of WordPress and PHP I decided to explore better.

I think I was missing a bit on the callback for the buffer flushed, it always has to return a string when a flush is called.

The problem now seems to be solved. As soon as possible I will publish a new version on the official repository

mateuswetah commented 1 year ago

Nice! I'll take a look anyways, good job!

matteomarchiori commented 1 year ago

Hi @mateuswetah , I forgot. I thought it was the same problem that prevents the Customizer to preview correctly on the wordpress.org website preview (when you click on the "Preview" button there is a never ending spinner, similar to the one showed by the FSE editor).

Anyway, this is not new, it has always been there since the first versions of the theme.

Maybe, do you know a possible reason for this?

I tried different times to solve it, also asked to the WordPress support, but I didn't found the cause