# How to add custom scripts or CSS to ProSite > Add custom CSS or JavaScript to your ProSite website to extend its appearance and functionality beyond the default settings. Source: https://www.kualo.com/knowledgebase/prosite-seo/how-to-add-custom-scripts-or-css-to-prosite Updated: 2026-06-09 --- ProSite lets you build and launch a website without any coding knowledge, but sometimes you need to go further. Adding custom scripts or CSS gives you precise control over your site's appearance and functionality. :::warning This is an advanced feature intended for users with developer knowledge. Incorrectly added code can break your site's layout or functionality. ::: ## Inserting code onto a page or the entire site 1. Open the **Pages** dialogue from the main config menu. ![Pages dialogue in the ProSite config menu](https://kb-cdn.kualo.com/82/9c/829cd065866bac7b6dae94334302cc5c1c2ae202.png) 2. In the **Pages** modal, select the **Scripts** tab. You can insert custom code - including CSS - in one of three positions: - Before the `` tag - After the `` tag - Before the `` tag To apply the code to every page, select **Default**. To target specific pages only, select the relevant page from the list. ![Scripts tab in the Pages modal](https://kb-cdn.kualo.com/49/1e/491e08390c11946b14d73a94b1b4e322eaa77987.png) :::info Code inserted here only runs on the published site. It will not execute inside the editor. ::: 3. If you want to apply custom CSS to a specific element on the page, you can assign it a custom class name. Select the element on the canvas, then enter a class name in the **Advanced** config options on the right-hand side. You can then target that class in your CSS. ![Adding a custom class name in the Advanced config panel](https://kb-cdn.kualo.com/39/5a/395a0d27825e16b15590477bf732ad606faa8761.png) ## Adding custom code at a specific place on a page If you need to embed code at a particular point in the page layout - for example, a third-party widget - use the HTML element. 1. Drag an **Advanced** element onto the canvas in the position where you want the HTML to appear. 2. Select **HTML** from the list of element options. ![Selecting the HTML element from the Advanced options](https://kb-cdn.kualo.com/a5/10/a5107e4405893f9d6ab43c4400209c8a165aa4ed.png) 3. With the HTML element selected, click the **pencil icon** in the right-hand config panel to edit its contents. ![Pencil icon to edit the HTML element](https://kb-cdn.kualo.com/bf/06/bf06a7229b251627c57a1fbceaa678ed2688bf97.png) By default, HTML content is **disabled** in the editor to prevent scripts from interfering with the editing interface. It will run on the published or previewed site. If you are confident the code is safe, you can uncheck this option to render it inside the editor as well. --- _Source: Kualo Knowledgebase — https://www.kualo.com/knowledgebase/prosite-seo/how-to-add-custom-scripts-or-css-to-prosite · © Kualo Ltd._