Zingtree is an interactive decision tree widgets provider. I’ve been told they are best comparing to other providers of such services. You integrate their app into your site with an iframe code or WordPress plugin. It’s also integrates well with Zendesk support platform. I was ordered to customize their trees design to match customer’s responsive site design. Completed the theme and want to write down my findings.
Design a Custom Theme on Zingtree.
It provides an easy option to add a custom .css file into their system. You just upload it somewhere on your server and edit with FTP. Great option to developers. Notice that for Zendesk embed external .css file must use https protocol. So after debug you may just to upload it into Zendesk custom theme assets.
However during CSS development you may find many areas of their templates missing unique classes and IDs. And therefore adding specific styles to such parts will be hard enough. Moreover you’ll miss body classes / id for their “nodes”. So for example, if you’ll want to customize a home node before the actual tree (which has a unique ID) with CSS, you’ll have a problem. Zingtree will not allow any changes in their templates HTML. And you can’t add any JavaScript into it by default.
Adding JavaScript into Zingtree.
Since whole trees widget is actually one page with tree node divs, we were able to add some JavaScript into it inside one of the nodes. It works, but JS must listen to Zingtree JS, and it’s quite complicated. Needed it to identify the homepage tree node – added classes to the body tag, when a user is on homepage node. And customized its look with CSS. Not the best solution, but it solves the problem. I’ve told to Zingtree support they are not marking their HTML with enough IDs.
Anyway the theme is OK now, and I was able to fulfill customer’s task. Love CSS file inclusion. Don’t like missing IDs in Zingtree app code, that decreases the power of custom included CSS file.
They Love It
This custom theme integration was later featured on Zingtree Blog within a dedicated post. After that Zingtree have ordered several themes creation for Zingtree app itself. And sent me some clients to implement specially crafted custom themes.
Yeah, hard to modify their templates, agree!