[Resolved] How to Edit CSS and Javascript after discontinuation of Toolset Layouts

[Author]

Posts

[liatG]

Hi,
I'd like to get help on how to edit my CSS and Javascript already in the editor now that Toolset Layouts is unavailable.

Thanks

[Christian Cox]

Hello, the editors for Views and Content Templates both have dedicated CSS and JS editing panels where you can add your own custom CSS and JS. Any CSS and JS you add to a Content Template will be enqueued in the page when that template is used to display some content. Similarly any CSS and JS you add to a View editor will be enqueued in the page when that View is displayed.

To add CSS and JS in a more global way not dependent upon a template or View, it's best to add that code to a custom theme and enqueue it using WordPress best practices, like using wp_enqueue_scripts, as there is no simple way to add global CSS and JS anymore without Toolset Layouts. https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/

[liatG]

Thank you Christian! Is there a way to remove the existing JS that is saved in the Toolset CSS and JS from before the updates?

[Christian Cox]

I think not - you will not have access to that code editor anywhere in wp-admin after you deactivate the Layouts plugin, as there is no place to find it elsewhere with Layouts deactivated, other than by directly inspecting the database. I would reactivate the Layouts plugin temporarily, remove the existing code from Layouts CSS & JS, paste it in another location if necessary, and deactivate the Layouts plugin again.

[liatG]

Sorry, I think I was a bit unclear. I am still using the Layouts plugin and have no plans to deactivate it at present. Right now there is code in the JS editor but the "Save" button is disabled. So there is no way for me to remove the code to paste it in another location.

[Christian Cox]

I was just trying this and it looks like the save button is disabled until some change is made in the existing code. If you select the code and cut it, or delete it, does the Save button become active for you as it does in my screenshots here?

If not, that sounds like a JavaScript conflict with a theme or other plugin. I would try temporarily activating a default theme like Twenty Twenty One and deactivating all plugins except Types, Views/Blocks, and Layouts, then testing again. If the Save button still does not work after cutting or deleting the existing code, I can take a closer look.