/ html

Using HTML/CSS to make stunning Paperform forms that do even more

We offer HTML/CSS as a feature of our Paperform Agency plan. These features allow you to have the highest level of customization for your forms. From using your own fonts to embedding widgets, we're unpacking these a little more to help you make the most of them.

What's this HTML/CSS thing?

HTML (or Hyper Text Markup Language) is the langauge used to structure and create content on a webpage. Headings, text, images, videos embeds and more are written in HTML.

CSS (or Cascading Style Sheets) is a language that is used to describe to browsers how HTML should look. This can be used to control the position, color, borders, shadows, fonts and lots lots more.

On the Paperform Agency plan, you can add your own HTML and CSS to take control of the page. Here's a quick rundown of some of the great things you can do with HTML/CSS.

What sorts of things can I do with HTML/CSS?

Embed third party widgets

Embedding third party widgets is easy with HTML support. Simply click the "Add HTML" option from the sidebar next to the selected line,

Screen-Shot-2017-11-22-at-1.57.52-pm

Then paste the third part embed script in the box for the HTML.

Screen-Shot-2017-11-22-at-1.58.58-pm

This makes embedding things like Tweets, Google Maps, Slideshare, Calendly or any third party embeds dead simple.

Using your own fonts

Custom CSS let's you take full control of the appearance of the page. Third party fonts can be added using the @font-face css property. Custom CSS can be inserted under the "Theme" section of the form editor.

Screen-Shot-2017-11-22-at-2.04.28-pm

You can read more about @font-face at https://developer.mozilla.org/en-US/docs/Web/CSS/%40font-face.

Changing the look and feel of Paperform forms

Sometimes you need the form to stand out in ways that are different. Custom CSS gives you the power to control everything down to the sizing of the padding, how thick the underline is beneath questions, the coloring of individual elements, and just about anything you can imagine.

Storm-Trooper


That Sounds Cool, But How Do I Get Started?

HTML and CSS look like pretty nerdy stuff, but they're not as hard as they seem. And, once you get the hang of them, you can do some incredible things. Here's some great resources to get started.

Courses

Resources

  • MDN Web Docs (https://developer.mozilla.org)
    A fantastic authority on web standards and compatibility.
  • StackOverflow (https://stackoverflow.com/)
    If you ever have a question or get stuck, this is the place to find the answers. A fantastic, helpful community of developers who answer questions.

CSS is accessible when using the Paperform editor - just go to 'Theme' in the topbar. Learn more here.

You can insert HTML by clicking on any line of a form in the Paperform editor, and then selecting 'Insert HTML' in the options to the left of the line. Learn more here.

Ready to create forms that get attention? Start a free agency trial now!

Dean McPherson