Introduction: This guide will show you how to create multiple sliders in a single node. Currently Leadshook is only capable of having one slider in a single node. You can use the Custom code below to have multiple sliders. Note: You will need a developer if you wish to alter the code we provide for […]
Articles Tagged: CSS
Guide to CSS Class Transition for Decision Tree Conversion from V1 to V2
Please Note: You can easily optimize for V2 using Appearance setting, this guide is tailored for users who has custom CSS from V1 and want to retain it in V2. They will need to use the updated CSS selectors based on the mapping below in order for their previous CSS code to work properly with […]
Align the image either left or right on the answer button
Introduction There are no settings or options to put the image side by side with the text on the answer button, however, a little CSS should do the job. Here is the CSS code: And here is the code explanation. Please feel free to adjust the code according to your needs. And here is the […]
Version 1 and version 2 grid design differences
You might notice design differences between version 1 and version 2 of LeadsHook. The main reason for this is that version 1 uses bootstrap while version 2 uses pure CSS. One major difference between the two is the use of the grid system. Bootstrap Grid System Bootstrap includes a responsive, mobile-first fluid grid system that […]
How to create 2 columns in mobile view
Here is how to create 2 columns in mobile view. Step 1: Go to the decision tree scripts as shown in the image below. Step 2: Click on the “Add” button under the Decision Tree Scripts. Step 3: Add the code below Step 4: Save and publish.
How to add CSS to a node
Introduction Its possible to modify the visual aspect of any given HTML in a node. As we are scripting, we should really do a comprehensive course on HTML & CSS first. I recommend the official W3C tutorial online: https://www.w3schools.com/ Once we understand that, it will be relatively easy to modify the design of HTML elements […]
How to use Google Fonts in LeadsHook
Introduction: LeadsHook supports a number of fonts in the appearance settings, however, if what you need is not on the list then you use Google Fonts instead. Step-by-Step Instructions: Step 1: Select a font Go to https://fonts.google.com/ and select the font of your choice. Take note of the import script and the CSS rule as […]
2 Column Layout on Mobile
Introduction: Before After Video instructions: UPDATED Some users were complaining that the script doesn’t work for them. The reason for this is because in the above example the answer labels are one word answers. If you have answer labels that are several words long, then you will need to adjust the script accordingly. Please use […]
Using the Appearance Settings
In this article we will show you how to design a decision tree using the appearance settings. You don’t need to have any web design skills. Although, it would make your job a lot easier if you are familiar with CSS. If you would like to learn HTML/CSS/JS we recommend you try the official tutorials: […]
