Option to Render "Custom HTML "

  • 17 June 2015
  • 5 replies
  • 43 views
Phillip

This is an alternate solution to the following issue:
Simple Solution for Image Compression and Retina Images

Besides the use case in the previous conversation, I’d also like to start transitioning to using SVGs for many of my images (for the many benefits). Since IE8 is the main browser that doesn’t support SVG, I predict as IE8 usage drops SVGs will gain in popularity.

Ideally, I’d just include it as straight code with Unbounce’s “Custom HTML” feature so it loads fast (fewer http requests) and allows me to apply CSS to the SVG (so I can change color without an image editor).

I get the desired result in the preview or published version of my page:

But the html doesn’t render when editing, making it hard to visually design the page:

I’m sure you have your reasons for not rendering these HTML blocks. But is there any way you can at least add an option to render the HTML?

There is plenty of room in the Customer HTML properties panel for this option. How about a little check box that says, “Render HTML”.

5 replies

Stuart_Mitchell

Seconded! This would be a big step forwards.

Paul_Kalupnieks
Rank

Hey Phillip,

SVG to replace images for retina is a great idea! We’re even starting to incorporate these into the page builder for icons. I would love to see direct support for these types of images in Unbounce pages, but unfortunately the HTML module will probably not be the way we will support it.

TL;DR : We would love to do it as you’re suggesting, but it could cause some security problems.

The HTML module allows for any valid html, it also allows users to insert script tags and use attributes such as onclick. If we rendered these page elements into the page builder it could pose a security problem. This wasn’t much of an issue before added support for downloading and uploading .unbounce page bundle files since the only person it would effect would be you or someone else on your account.

Preview and publish are different beasts altogether as they don’t have the same types of account permissions as the page builder itself.

Since adding that feature, we have increased security on what types of html code is allowed in page builder module elements such as the text box and video tag insertion. This was discussed in these community posts: here & here and resolved shortly after.

Rendering pasted HTML would open this issue up wide open again which we obviously don’t want to do.

I’ve bounced some ideas off of some of the team here that works on the Page Builder and while I can’t promise anything, it’s definitely on our radar. Some possibilities could be allowing SVGs to be uploaded, adding a new component for html that is more strictly filtered, or even adding a new component altogether.

We would have to weigh the options and perhaps others we haven’t thought up yet before we decide, especially since are very commited to our customers that would like to support older versions of Internet Explorer. Yes, SVGs work great in newer, better browsers, but we don’t want to have a confusing experience that forces our customers to make a potentially confusing decision.

Phillip

Thanks for the feedback! See I knew you had your reasons.

Is there a way you can add the “Render HTML” option and have it apply to only certain “safe” HTML?

I envision it working like this:

  • User checks the option to “Render HTML”.
  • Unbounce scans the code against a whitelist.
  • If it is deemed safe it renders.
    If not, a popup notifies the user the code is not compatible with “Render HTML”.
  • Additionally, you could log this incompatible code and refine your whitelist. 
    I’m sure most people use the HTML component for iFrames. Shouldn’t be any security issues enabling those since they are limited by cross domain policy.

As far as SVGs specifically, I would prefer inline SVGs (reduce http requests), which means adding support to the Image element wouldn’t be ideal.

Paul_Kalupnieks
Rank

Philip,

With the large number of things to consider, I am not sure how we might fit it in. I’m going to talk to the product owner and see what the plan is for retina image support. 

P.

S

The ability to render custom html in-app would be a huge deal. We could use paste a design using more efficient html code than the gui comes up with and make minor tweaks to the design within Unbounce. This would reduce page load or render times which can only help.

Plus everything else that we can do in html that Unbounce doesn’t have a built in option for.

I really like this feature idea and hope it gets added, too bad it doesn’t seem to have many “likes.”

Reply


Terms & ConditionsCookie settings