Leadclick - Widget

A widget built for fast communication in your landing page, allow your customers to contact you easily and in just in a few clicks.

Wordpress - Usage

From your admin dashboard go to Pages and search the page you want the widget to appear. Once you've found it, click on it.

Scroll down and click on "Edit with elementor".

From that new page, search for HTML on the left sidebar. Drag the icon that says HTML and has a </> icon. Drop it into the center of the page.

The sidebar will change and display a textbox. Paste the code generated in leadsales here and click on update.

And done, you have your widget up and running.

Note: If you want to hide the widget for any reason, set the orientation property to none

Shopify - Usage

From your admin dashboard go to Themes.

Then go to your current theme and click on Actions, then on Edit code

On the Layout folder click on the file named theme.liquid

Scroll down to the end of the file and after the closing </ body > tag paste the generted code from Leadsales.

Finally click on the green save button at the top of the page. And done, you have your widget up and running.

Note: If you want to hide the widget for any reason, set the orientation property to none

React - Usage

Install the project with npm

  npm install @leadsales/leadclick --save

Hydrate components inside your index.js file

import { applyPolyfills, defineCustomElements } from '@leadsales/leadclick/dist/loader';

applyPolyfills().then(() => {
  defineCustomElements(window);
});

Import our component into our App.js file and use the html tag in your code.

import '@leadsales/leadclick';

function App() {
  return (
      //Use snippet generated on leadsales here
  )
}

Angular - Usage

Paste the script tag inside your index.html

<script type="module" src="https://cdn.jsdelivr.net/npm/@leadsales/[email protected]/dist/leadclick/leadclick.esm.js"></script>
<meta charset="utf-8" />

Use the leadsales generated snippet in your app.component.html file.

Vue - Usage

Install the project with npm

  npm install @leadsales/leadclick --save

Hydrate de component in your main.js file

import { defineCustomElements as defineLeadclick } from '@leadsales/leadclick/dist/loader';

defineLeadclick(window);

Vue.config.ignoredElements = ['leadclick-widget'];

And that's it, you can use the leadsales generated snippet in any template you want

Component documentation

Check the this link to see the props and structure of the widget

leadclick-widget

Demo

Check our demo at leadsales.io

Contributors

• @karlaromerox3

License

MIT