Community X.

Connect with other creators, share ideas, give feedback and get the latest product updates.

Oct 13
Edited: Oct 13

How can we create a reusable component with custom code?

Hi, I've implemented a custom search engine that fit my needs, and I have a custom design using a few lines of custom code to make the UI dynamic and displaying the search result.

I would like to reuse this search UI on another page and of course, I would like to avoid duplicating all the custom code and design...

I know we can make a section as a master and reuse it on any page but in that case how can we attach custom code to this section??

Anyway, sections are full width and I just would like to reuse my custom design+code in any container that is not necessarily full width...

Unfortunately, I'm afraid it is not possible, unless I missed something...

Could someone of the Wix team confirm or explain how to do that?

Any chance it could be part of your backlog?

Thanks a lot in advance.


Hey, Regarding reusable code: If the search is part of the Header, you can add the code at the site level and not the page.

If you do not want it on every page, you can create a file in Public and import the file on any page you want.

Hi Matanya,

Thanks a lot for your response.

Yes, you're right, I guess a shared include in Public folder could do the job to reuse the custom code in case my UI is part of a master section.

Ideally, I would prefer being able to create a little custom component that would integrate the UI + Custom code in a single "package", that I could select from the left panel in the same way as any other component like a container, an image, etc. It could be so useful for any kind of component, like a custom button, even without any custom code...

But I'm afraid I will have to choose the master section solution despite the full width constraint..

Thanks again

got it.

You basically want to create a custom component with all its functionality and reuse it on different pages.

You're right, that would be awesome!

Editor X

Design your boldest creations.