Attaching a CSS to an HTML page in the widget

1

We currently use a CRM that allows us to create forms and imbed them directly into webpage with a custom CSS. I can get the form to work, but I can’t figure out where to put the CSS. Below is the code that the CRM gives me that I place in the widget.

script type=“text/javascript” src="//hypersign.worketc.com/v3.0/js/WebForms.js"></script
script type=“text/javascript”>
RenderWebForm({“TemplateID”:2,“Domain”:“hypersign.worketc.com”,“UseCustomCSS”:false,“LoadingMessage”:“Please wait”});
/script>

Here’s the how-to they provide us to use a custom CSS.
https://hypersign.worketc.com/v2.0/CustomStyleGuide.html

2

I am not sure if this is really what you want.

But if I place this code in a HTML widget :smile:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../webforms.css">
</head>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

I can then place the webforms.css file in the same directory as the webpage’s html file.

Or more simply I can add the .css file to the Hype documents Resources
And use the substitution variable ${resourcesFolderName} in the path of the stylesheet link to point to the file.

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="${resourcesFolderName}/webforms.css">
</head>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>
1 Like