Using HTML and custom code

  • Knowledge Base
  • Responsive Website Builder
  • Using HTML and custom code
  • Duda Support > Responsive Website Builder > Editing a Site

Overview

The editor is flexible in that it allows you to both modify existing code or add your own. Doing this allows you to extend the functionality of the platform and provides you with additional features. For example, you can add a custom calendar widget or even a 3rd party custom contact form for taking payments on your site.

This article will cover 3 different methods of adding code to your site.

The HTML widget

The HTML widget is the easiest method of adding code to your site. Simply drag the HTML widget into a column or row into your site and paste in your code.

Steps

  1. You can type HTML in the widget in the search bar to find the HTML widget
  2. Drag the HTML widget into a column.
  3. Insert your code in the menu that pops up

Editing your custom code

After dropping in your custom code via the HTML widget, you should be able to simply click the widget in your editor to edit your code.

Sometimes, however, due to the nature of the code it isn't possible to do this as easily. In that case, you can try selecting the container to see if you can edit the entire container (which will include the code).

Editing the code inline

You can edit the code of anything in your site inline by right clicking to bring up the context menu. You can then click "Edit HTML/CSS" to get into the raw code of anything in your editor.

Clicking this will bring up the code editor for the code you're editing. Once there, it's recommended to read the documentation before you start tinkering.

A note on editing CSS

While you can edit the CSS in the developer mode, it is not recommended that you add any new selectors in this menu. You can add new rules to selectors here without a problem.

For creating new CSS selectors, please do this through developer mode.

Developer mode

Duda offers you a way to view the code of your entire site within the editor. You can access this by clicking the </> icon at the top right of your editor.

The code for your site is broken into sections to allow fine tuning over your site.

For more information on developer mode, please read our full developer mode documentation here.

FAQ's and troubleshooting

I broke my site with custom code, what do I do?

If you broke your site with custom code, you can fix it by;

  1. Restoring to a backup
  2. Fixing the code manually
  3. Access a different part of the page

For a full guide on troubleshooting custom code, see this article here;
https://help.dudamobile.com/hc/en-us/articles/226190687-Troubleshooting-custom-code

Do you have anyone who can help me with custom code?

While we don't have developers at Duda who can help you make your site, we do have a network of pros familiar with our platform who would be happy to help you make your site. You can contact them and see samples of their work on our pros page.

What are some good custom coding guidelines?

Some guidelines are;

  • Create a backup
  • Use a test page
  • Create a backup

See this article for a detailed article on custom coding guidelines;
https://help.dudamobile.com/hc/en-us/articles/225786328-Custom-coding-guidelines

×

Priority Phone Support

English phone support is available 18 hours a day,
Monday through Friday, 3am to 9pm (EST).

United States +1 866-776-1550 3am to 9pm (Eastern)
United Kingdom +44 (0)800-011-9071 8am to 2am (London)
France +33 (0)9-75-18-84-74 9am to 3am (Paris)
Israel +972 (0)3-720-8922 10am to 4am (Jerusalem)
Australia +61 (0)2-8880-9166 7pm to 1pm (Sydney)
To schedule a call in French, Portuguese, Hebrew or Russian, please email us at prioritysupport@duda.co
×

Please Log in as a DudaPro

Priority Phone Support is available exclusively to DudaPros. Log in to your DudaPro account now to see our international support numbers.

Log In
Not a DudaPro? Start a free trial now!