Webflow to Webstudio (Custom Code)

At a glance

The community member is using a template from osmo.supply and can copy it to Webflow without any issues. However, when they copy it from Webflow to Webstudio, the effect no longer works, and they need to integrate external scripts and custom JavaScript. In Webflow, they copy the JavaScript under Site Settings in the Custom Code 'Before tag' section, which is not possible in Webstudio. The community member asks how they can integrate this for the entire project and not just for one page.

The comments suggest that the community member can use an HTML embed to add custom code. They also ask if they can store the script element in slots so they only have one place to make changes, or if Project Settings/General/Custom Code would be a better choice. Another community member responds that they can use a slot to output scripts in the head, and HTML embed is a good place for scripts that should output on every page.

The community member is satisfied with the information provided and thanks the others for their help.

ssylvio

I have a question. I am using a template from osmo.supply. I can copy this to Webflow without any problems. However, when I copy it from Webflow to Webstudio, the effect no longer works. I still have to integrate external scripts and custom Javascript. In Webflow, I copy the JavaScript under Site Settings in the Custom Code ‘Before </body> tag’ section. This is not possible in Webstudio. How can I integrate this here for the entire project and not just for one page?
In Webflow, I work with Slater, because I can structure and edit the code better there. What can you recommend for Webstudio?

4 comments

JJohn Siciliano

If you are trying to add custom code, you can use an HTML embed. Or am I misunderstanding the question?

ssylvio

Ok, I wasn't sure whether I could use these elements for <script>. Would I also be able to store this element in slots so that I only have one place to go when I want to make changes and don't have to go into each page, or would Project Settings/General/Custom Code be the better choice? I was just unsure because in Webflow this is added in the site settings.
Sorry for all the questions.

JJohn Siciliano

Yeah you can use a slot. from docs

Custom Code – Global field to output scripts in the head. Custom Code is often used to add analytics scripts such as Google Analytics, PostHog, Plausible, and any other scripts/code you want to output on every page. Please note that this code does not output in the Builder, so your scripts aren't tracking Builder page views. For outputting a script in the body on every page, use a Slot. For example, add HTML Embed(s) to your Footer Slot so that it outputs on every page.

In Webflow, html embed does not render on the canvas which is partially why site settings are the go to. In Webstudio, your html embed scirpts can run on canvas (there is a toggle on them as you may not always want them to execute), so HTML embed is a great place for them

ssylvio

Perfect. Thanks a lot for the information.

Add a reply

Join the Webstudio community

Webflow to Webstudio (Custom Code)