Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/piyushkmr/awesome-marketing-chat-sliders
Chat sliders for marketing of your whatsapp group or facebook page (can be scaled to any chat system)
https://github.com/piyushkmr/awesome-marketing-chat-sliders
List: awesome-marketing-chat-sliders
Last synced: 13 days ago
JSON representation
Chat sliders for marketing of your whatsapp group or facebook page (can be scaled to any chat system)
- Host: GitHub
- URL: https://github.com/piyushkmr/awesome-marketing-chat-sliders
- Owner: piyushkmr
- Created: 2015-04-09T15:03:40.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2021-08-09T07:35:45.000Z (over 3 years ago)
- Last Synced: 2024-05-20T22:35:58.133Z (6 months ago)
- Language: CSS
- Size: 2.1 MB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
Awesome Marketing Chat Sliders
Chat sliders for marketing of your whatsapp group or facebook page (can be scaled to any chat system).
Chat sliders for showcasing the Whatsapp Group Chat or your Facebook page posts to attract new users to join you. It can be scaled to any chat system that you may want to design for your next project.I created it for website GREIO.com, but decided to distribute them openly for bugs and improvements.
For a demo just got to Demo folder and got to Faceboo-page or Whatsapp-page folder for respective demo.
For live demo visit:
http://greio.com/facebook
http://greio.com/whatsapp
How to use
The files
To use each folder insrc
has three files:
-chat.js (core file for the chat sliders)
-data.js (file from where all the variables are fetched)
-facebook.css/whatsapp.css (the stylesheet for respective pages)
To use just import all three files:
<script type="text/javascript" src="data.js"></scirpt>
<script type="text/javascript" src="chat.js"></scirpt>
<link type="text/css" rel="stylesheet" href="facebook.css"/>The HTML
The best part is that it requires least html setup.
Initialize on any html div element:
<div class="chat-box"></div>
Then initialize just like any other jQuery plugin:
<script>
$('.chat-box').chatSlider();
</script>The Javascript
You don't need to dig into javascript code, but you will have to change variables as per your need.
Go todata.js
of any folder insrc
:
Contains following variables:
- message : Json variable for mesage strings
- pageUrl : Url of facebook page to be liked
- profileName : Profile name to be shown on posts
- profilelogo : Profile logo URL (can be absolute or relative to index.html page)
Contains following variables:
- groupName : Group Name to be shown to user
- users : list of dummy users can be listed to any users
- chat : Json variable for chat messages, keys denote users index from users Array
- colors : font color for respective users (input any number of colors)