Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

inyansuta's avatar

Admin template without css/js collission with another web template

Amazing, great and sophisticated administration templates are nowadays huge.

But I'm looking for a single template that will not use specific frameworks (bootstrap, jquery), because I need to incorporate it directly into other websites (other templates). For clarification - I develop an administration where the user edits the content of the web site directly from the site.

Unfortunately, no template that should have own unique css styles can not find.

I'll be happy for any help, otherwise I'll have to style all admin components (panels, buttons ...) myself.

0 likes
5 replies
inyansuta's avatar

It does not necessarily have to be an administration template; in fact, it is enough to strain the basic elements (especially the form). However, they must have their own unique styles that do not interfere with other templates.

SteveCove's avatar

An admin template is typically ran as a seperate section of the website, eg example.com/admin, so conflicts are fairly easy to avoid.

Perhaps you mean something else - could you elaborate?

inyansuta's avatar

@stevecove Yes, admin template is "typically" ran as a separate section of the website"...

But as I said, I'm developing an administration that is part of a website. Individual elements in html are populated with special tags in the case of a logged-in user, so the site administration is done directly.

And rightly, I would not like to style the right part myself (unfortunately, so far) and I would like to use already existing elements (buttons, panels, form elements etc ...). Unfortunately, I still have not found a css template that would use own unique css that does not collide with the website css.

For a better understanding, I'm attaching the printscreen, left is a classic web, right then the administration, which is displayed by right-clicking the element.

Note: My own administration is created using Vue.

https://petrzavicak.cz/admin-example.jpg

I tried to load the entire "purchased" administration template via iframe and view it as a sidebar, then everything is fine, however access to individual site elements, updates, etc. is crazy between this ifram and the web.

SteveCove's avatar

OK yes i see what you mean. Well i have bad news, no matter if you carefuly hand craft you admin interface elements to have non confilcting names etc, it will never work on an to_be_edited page containing arbitary css and javascript, since css and js are frequantly attached via element body p {} etc.

You either need to strip out css and js (breaking the WYSIWYG concept), or load the to_be_editied page in an iframe, which is what pretty much every front end editor does.

There is a nice tutorial here: http://blog.stackhive.com/post/137799349684/building-a-seamless-drag-and-drop-interface

What issues are y ou facing when you tried this approach?

Please or to participate in this conversation.