TangibleInc / template-system

A template system for WordPress with content type loops and conditions
https://docs.loopsandlogic.com/reference/template-system/
6 stars 2 forks source link

L&L issues with the Max Mega Menu plugin #83

Closed jfacemyer closed 6 months ago

jfacemyer commented 7 months ago

In Loops and Logic 4.0.2:

When I add anything in the Script tab, I get unexpected output in the preview pane and the page displaying a template. It's potentially different on both, sometimes not rendering on the preview pane while rendering on the front end.

I tried finding documentation on how to add a script correctly but couldn't come up with much. (e.g. do I use script tags or not? Can I import external jquery files using a script tag there? These seem to work, while anything else seems to fail, but everything gives me garbage output...)

editor: https://imgur.com/7gbZAYM.png

front-end: https://imgur.com/TPjdBri.png

I tried deactivating plugins and a different theme (2024), but get the same no matter what.

Is this a known issue? What kind of other info can I give? WP and everything are up to date.

BenTangible commented 7 months ago

sometimes not rendering on the preview pane while rendering on the front end

We'd have to get confirmation from @eliot-akira on this, but based on this comment from an earlier thread, it seems that scripts might not be fully supported in the preview pane at the moment. Not sure if this only affects L&L's dynamic tags that load scripts or if that would include all scripts, including those in the script tag.

One other thing, you mention "When I add anything in the Script tab, I get unexpected output" but when I look at the screenshot you posted, I can see that your script is wrapped in a <script> tag. This is an HTML tag, whereas the script tab in L&L, as far as I understand, only accepts javascript code (i.e. the part inside those script tags). You could place this whole block of code in the template tab since HTML script tags would be valid there, or you could remove the script tags if you want to place that in the script tab.

jfacemyer commented 7 months ago

Thanks for your reply!

Here's what I get on the front end when I load that way: https://imgur.com/9dzOSFo.png

script editor, for reference: https://imgur.com/m2z0qQd.png

I may have been unclear - no matter what I put in the script editor, I get garbage on the front end (as posted in the screenshot) - with or without script tags. It's just that sometimes it shows garbage on the script editor as well, and sometimes it doesn't (only saying that for reference, not that it matters since it's known the preview doesn't work quite right in this regard yet.)

The reason I put the script tags in in the first place is because that was the one way I could get my script to actually work. I tried loading the external jquery scripts in the template pane and removing the script tags from the script pane, and I get the above, and the script doesn't work at all.

BenTangible commented 7 months ago

I'm no JS excerpt, but it looks like your code relies on JQuery (that was the https://code.jquery.com/jquery-3.6.0.js bit you removed). I know very little about JS so this might be the blind leading the blind here, but I imagine you'd still need to enqueue JQuery in some way other than using the script tag before you can use the .tabs() method in your script. Or you could simply place your whole original block of code, script tags and all, in the template tab.

What are you using L&L for in all of this? Based on your screenshots, you seem to be trying to load up a JS script wrapped in HTML tags, which I imagine would work just as well in a standard HTML block in WordPress. Does your script give you "garbage output" when you add it to your page without using L&L?

jfacemyer commented 7 months ago

Ah, crap...looks like this is a continuation of the Divi issue I reported previously: https://github.com/TangibleInc/template-system/issues/45

I tried changing the theme again, and it seems to work correctly there now (not sure why it seemed like it was still a problem before when I switched themes...)

So, it looks like I'm getting garbage no matter what at the bottom of the Divi rendered page. It just seems to have showed up more prominently when I put in some JS, so I guess I assumed that twas the culprit.

jfacemyer commented 7 months ago

I'm using it to render a complex menu system for all pages, so it needs to be part of the template, as well as for custom post display.

(I did enqueue the other scripts in the template part, but that's moot now, since it seems like my debugging led me down the wrong path and it's not JS related at all :/ )

BenTangible commented 7 months ago

not sure why it seemed like it was still a problem before when I switched themes

Personally, caching is the root of all of my problems 😆

In any case, glad you were able to identify that this is a Divi issue and not a script-rendering issue!

jfacemyer commented 7 months ago

Yeah, caching is the frenemy.

Should I change the title to reflect the issue better?

Also, just FYI, seems like moving the scripts all to the template tag makes the JS not work at all in Divi, but that seems to work fine in 2024 theme. Not sure if that helps at all.

jfacemyer commented 7 months ago

Ok, so a little further testing reveals more quirks...

I realized L&L 4.02 was working fine with Divi on another site, so I was comparing the two to find the differences and narrow down what's causing this behavior.

Turns out this one isn't Divi related after all! I was right when I saw that it happened with 2024, I reproduced the issue.

It's a conflict with Max Mega Menu! https://wordpress.org/plugins/megamenu/

When the plugin is active along with L&L and there's a Mega Menu on the page, that's when the garbage appears. When there's no mega menu, there's no garbage.

(I thought it was Divi because my Divi layouts with the Mega Menu weren't rendering when I switched to a different theme...but I was sort of right originally!)

I'll try to see if there's a conflict with the last 3.x version of the plugin, if I get a chance, but I'm very certain the conflict is between these plugins.

I'll also leave a comment on their support page pointing back here - hopefully a friendly collaboration can resolve this issue!

jfacemyer commented 7 months ago

Another issue is that, when both plugins are active, the Divi editor has all kinds of problems...that seem to be resolved when one or the other is deactivated. Sometimes the editor won't load, you can't edit colors in the module editor, the visual text editor doesn't load correctly, to name the ones I've come across.

BenTangible commented 7 months ago

I'm using it to render a complex menu system for all pages, so it needs to be part of the template, as well as for custom post display.

Forgive me if I'm asking unhelpful questions here since I don't have much experience with JS, but I'm noticing that the script seems to be all by itself in your screenshots. It also seems to very broadly be targeting items with the ia-tab-menu-tabs class. Does the issue with your script still arise if you were to try loading the script on the page or in the document head using some other method or plugin? That might help narrow down whether this is an issue with the script itself or with L&L.

Another issue is that, when both plugins are active, the Divi editor has all kinds of problems...that seem to be resolved when one or the other is deactivated. Sometimes the editor won't load, you can't edit colors in the module editor, the visual text editor doesn't load correctly, to name the ones I've come across.

This sounds like something more specific we'd be able to replicate and attempt to resolve. Since you seem quite comfortable playing around with different plugin stacks, would you be able to provide me with some specific steps that I could follow to replicate some specific example of this incompatibility between L&L + Divi + Max Mega Menu? I can't say that we'll be able to make this a priority since L&L is a free plugin and we can't support every combination of plugins for WordPress, but if there's a clearer process we can follow to see the issue, that would certainly increase the likelihood that we could check whether this is a compatibility bug or if it's just a quirk of Divi doing things its own way.

jfacemyer commented 7 months ago

That might help narrow down whether this is an issue with the script itself or with L&L.

As mentioned previously, this happens no matter whether I have any JS in the template or script panes - I caused this confusion because I thought that the script pane was the culprit previously, but it happens regardless of whether I'm using the script or not, as far as I can tell. (If I remove it entirely from the template, it still happens - it's just that the garbage output specifically includes the content of the script pane, if there's anything in there, in some conditions.)

This sounds like something more specific we'd be able to replicate and attempt to resolve. Since you seem quite comfortable playing around with different plugin stacks, would you be able to provide me with some specific steps that I could follow to replicate some specific example of this incompatibility between L&L + Divi + Max Mega Menu? I can't say that we'll be able to make this a priority since L&L is a free plugin and we can't support every combination of plugins for WordPress, but if there's a clearer process we can follow to see the issue, that would certainly increase the likelihood that we could check whether this is a compatibility bug or if it's just a quirk of Divi doing things its own way.

Yes, I'm happy to help here - however, as I mentioned in my latest posts, it's NOT specific to Divi (I still get garbage output in 2024 theme), but it definitely affects Divi behavior in addition to the garbage output.

I'll try to give some specifics in a bit to reproduce.

I do greatly appreciate the attention to this, and sorry for the runaround :) If there's any way I can contribute some $ in return for support, this project will allow for that!!

BenTangible commented 7 months ago

As mentioned previously,

My bad, I missed that. Thanks for clarifying.

If there's any way I can contribute some $ in return for support, this project will allow for that!!

Feel free to start by giving us some steps to reproduce these specific bugs you're noticing and we can probably find some time to take a look at that free of charge at some point. However, if this does end up requiring some custom dev to implement compatibility with a particular plugin stack, or if you'd want to expedite the development process or get hands-on support on your specific site, you can always reach out through our agency site to sponsor some specific L&L development you might need to make this plugin better suit your needs.

I look forward to hearing back from you about this :) And do let me know if you learn anything from the folks at Max Mega Menu.

jfacemyer commented 6 months ago

Ok, after some serious digging on a completely clean site, I think that I've got it narrowed down to a conflict I've introduced simply by the complexity of what I'm trying to accomplish. (In other words - it's my fault!)

Thank you for your help with this, and I'm glad to report that there's no problem!