478 lines
14 KiB
HTML
478 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
|
|
<title>Comments as a service | Remarkbox</title>
|
|
|
|
<!-- this makes mobile pretty... -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<meta name="theme-color" content="#D40000">
|
|
|
|
<link rel="stylesheet" href="normalize.css">
|
|
<link rel="stylesheet" href="skeleton.css">
|
|
<link href="https://cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css">
|
|
<link rel="stylesheet" href="custom.css">
|
|
|
|
<script src="jquery-3.2.0.slim.min.js"></script>
|
|
<script src="custom.js"></script>
|
|
|
|
|
|
<!-- reviewing the data - https://getmirrorshades.com/view.html?siteKey=NwkBplCe -->
|
|
<!--
|
|
<script async src="https://getmirrorshades.com/agent.js" data-siteId="MA-EWUFWH-64A"></script>
|
|
-->
|
|
|
|
<script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
|
ga('create', 'UA-82107349-1', 'auto');
|
|
ga('send', 'pageview');
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body class="remarkbox-body">
|
|
|
|
<a id="top" class="anchor"></span>
|
|
|
|
<div class="redline"></div>
|
|
|
|
<div class="navbar hidden-on-tablet">
|
|
<a href="http://www.remarkbox.com"><img src="remarkbox-minified.png" class="navlogo" alt="Remarkbox Logo" /></a>
|
|
|
|
<div class="navlinks">
|
|
<a class="navlink" href="#plans">Plans</a>
|
|
<a class="navlink" href="https://faq.remarkbox.com">Faq</a>
|
|
<a class="navlink" href="https://meta.remarkbox.com">Meta</a>
|
|
<a class="navlink" href="#about">About</a>
|
|
<a class="navlink" href="#remarkbox-demo">Demo</a>
|
|
<a class="button" href="#beta">Log in</a>
|
|
<a class="button red" href="#beta">Join</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="text-align: right; margin-top: 25px; width: 100%;" class="hidden-on-tablet">
|
|
<a class="button" href="#beta">Log in</a>
|
|
<a class="button red" href="#beta" style="margin-right: 40px;">Join</a>
|
|
</div>
|
|
|
|
<a id="free" class="anchor"></a>
|
|
|
|
<div class="proposition">
|
|
<div class="container">
|
|
|
|
<center><a href="http://www.remarkbox.com">
|
|
<img src="remarkbox-minified.png" class="herologo" alt="Remarkbox Logo" /></a>
|
|
<h2>Your readers want <span class="avoidwrap">to communicate</span> <span class="avoidwrap">with you</span></h2>
|
|
</center>
|
|
|
|
<div class="row">
|
|
<div class="one-half column">
|
|
|
|
<center>
|
|
<span style="font-size: 1.25em;">
|
|
|
|
<br />
|
|
<br />
|
|
<br />
|
|
Remarkbox offers a <span class="avoidwrap"><b>comment system</b></span> to
|
|
<br />
|
|
help engage readers <span class="avoidwrap">with your content.</span>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
It works everywhere, <span class="avoidwrap">even <b>static sites</b>.</span>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
To get started, put this <a href="https://my.remarkbox.com/embed-iframe.txt" target="_blank">snippet</a> into
|
|
<br />
|
|
your HTML, <b>we handle the rest!</b>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<!--<button style="color: #FFFFFF; background-color: #AA0000; border-color: #AA0000;">Get Started</button>
|
|
-->
|
|
<span class="avoidwrap">To see <a href="#remarkbox-demo">Remarkbox in action</a></span> scroll <span class="avoidwrap">down to the bottom of this page.</span>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
|
|
<a class="button red" href="#beta">Join Remarkbox</a>
|
|
<br />
|
|
<b>or <a href="#learn">learn more</a></b>
|
|
<!-- <b>or <a href="#beta">join beta</a></b> -->
|
|
<br />
|
|
<br />
|
|
</span>
|
|
</center>
|
|
|
|
</div>
|
|
<div class="one-half column">
|
|
<center>
|
|
<img src="/static/img/remarkbox-instant-preview-of-comments.gif" style="margin-top: 100px; width: 98%;" alt="Remarkbox Demo animated gif">
|
|
</center>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<div class="row">
|
|
<center>
|
|
<h3 style="margin-top: 80px">Looking for a <span class="avoidwrap">Disqus alternative?</span></h3>
|
|
</center>
|
|
Disqus serves advertisements and has a distracting user experience which causes your visitors to bounce. We all want a better way.
|
|
As a result, Remarkbox was created as a comment system that <b>works for the site owner</b>, not against them.
|
|
<span class="avoidwrap"><a href="#learn">... read more</a></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
|
|
<div class="nav hidden-on-tablet">
|
|
<div>
|
|
<a href="http://www.remarkbox.com"><img src="remarkbox-minified.png" class="navlogo" alt="Remarkbox Logo" /></a>
|
|
|
|
<div class="navlinks">
|
|
<a class="navlink" href="#plans">Plans</a>
|
|
<a class="navlink" href="https://faq.remarkbox.com">Faq</a>
|
|
<a class="navlink" href="https://meta.remarkbox.com">Meta</a>
|
|
<a class="navlink" href="#about">About</a>
|
|
<a class="navlink" href="#remarkbox-demo">Demo</a>
|
|
<a class="button" href="#beta">Log in</a>
|
|
<a class="button red" href="#beta">Join</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="reasons row-padding">
|
|
<a id="learn" class="anchor"></a>
|
|
<center>
|
|
<h4>Your search for the perfect <span class="avoidwrap">blog comment system ends today</span></h4>
|
|
<br/>
|
|
</center>
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="one-half column">
|
|
|
|
<center>
|
|
<img src="/static/img/remarkbox-instant-preview-of-comments.gif" style="margin-top: 20px; width: 98%;" alt="Remarkbox Demo animated gif">
|
|
<span style="font-size: .7em">Markdown and syntax highlighted code blocks!</span>
|
|
</center>
|
|
|
|
<br/>
|
|
|
|
</div>
|
|
<div class="one-half column" style="padding-left: 5%;">
|
|
|
|
|
|
<h5>Dissolve barriers of engagement</h5>
|
|
|
|
Everyone knows asking a visitor to create an account often leads to less engagement.
|
|
With Remarkbox, a visitor may interact with your site <b>without</b> an account.
|
|
<br>
|
|
<br>
|
|
When a user leaves a comment we collect their email address and send a verification email to log them in.
|
|
<br>
|
|
<br>
|
|
The end result is a visitor can comment right away without needing to signup or remember a password.
|
|
|
|
<br>
|
|
<br>
|
|
<br>
|
|
|
|
<h5>Say <u>No</u> to Ads!</h5>
|
|
|
|
Other comment systems, like Facebook and Disqus, track your (and your visitor's) activity to serve ads.
|
|
<br>
|
|
<br>
|
|
Here at Remarkbox we respect your privacy and never serve ads. In fact, we only <b>promote your message</b> because we work for you, not them!
|
|
<br>
|
|
<br>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<center>
|
|
<br>
|
|
<br>
|
|
<a class="button red" href="#beta">Join Remarkbox</a>
|
|
<br />
|
|
<b>or see <a href="#remarkbox-demo">it in action</a></b>
|
|
</center>
|
|
|
|
|
|
|
|
<!--
|
|
<p>
|
|
If you wonder why I would do something crazy like open source my product, watch
|
|
Bryan Cantrill's talk on "Corporate Open Source Anti-patterns":
|
|
<p>
|
|
https://www.youtube.com/watch?v=Pm8P4oCIY3g
|
|
-->
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="container row-padding" style="max-width: 960px">
|
|
|
|
<a id="plans" class="anchor"></a>
|
|
<center><h4>Plans and Pricing</h4></center>
|
|
|
|
<br/>
|
|
<br/>
|
|
|
|
<div class="row">
|
|
|
|
|
|
<div class="one-third column">
|
|
<br/>
|
|
<div class="pricebox">
|
|
<b>Production Monthly</b>
|
|
<br/>
|
|
<br/>
|
|
only
|
|
<h3 style="font-weight: bold;">$5.69<span style="font-size: .5em;">/mo</span></h3>
|
|
One moderator on one domain
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<b><a href="#beta" class="button red">Coming Soon</a></b>
|
|
<br/>
|
|
Join the <a href="#beta">beta</a> for a sneak peek
|
|
</div>
|
|
<br/>
|
|
</div>
|
|
|
|
<div class="one-third column">
|
|
<div class="redline"></div>
|
|
<div class="pricebox deal">
|
|
<b>Production Yearly</b>
|
|
<br/>
|
|
<br/>
|
|
<span style="color: #2DB52D; font-size: 20px;">save 41%</span>
|
|
<h3 style="font-weight: bold;">$3.33<span style="font-size: .6em;">/mo</span></h3>
|
|
One moderator
|
|
<span class="avoidwrap">on one domain</span>
|
|
<br/>
|
|
<br/>
|
|
<s style="color: #AA0000;">$68.28</s> $39.95 per year
|
|
<br/>
|
|
<br/>
|
|
<b><a href="#beta" class="button red">Coming Soon</a></b>
|
|
<br/>
|
|
Join the <a href="#beta">beta</a> for a sneak peek
|
|
</div>
|
|
<div class="redline"></div>
|
|
</div>
|
|
|
|
<div class="one-third column">
|
|
<br/>
|
|
<div class="pricebox">
|
|
<b>Dedicated Monthly</b>
|
|
<br/>
|
|
<br/>
|
|
Dedicated Remarkbox instance
|
|
<h3 style="font-weight: bold;">$49.95<span style="font-size: .5em;">/mo</span></h3>
|
|
Unlimited moderators
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<b><a href="#beta" class="button red">Coming Soon</a></b>
|
|
<br/>
|
|
Join the <a href="#beta">beta</a> for a sneak peek
|
|
</div>
|
|
<br/>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row">
|
|
|
|
|
|
<div class="one-third column"> </div>
|
|
|
|
<div class="one-third column">
|
|
<br/><br/><br/>
|
|
<br/><br/><br/>
|
|
<br/><br/><br/>
|
|
<div class="pricebox">
|
|
<b>Development</b>
|
|
<h3 style="font-weight: bold;">Free</h3>
|
|
No moderator
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<b><a href="https://my.remarkbox.com/embed-iframe.txt" target="_blank" class="button red">Setup</a></b>
|
|
<br/>
|
|
Just put the
|
|
<a href="https://my.remarkbox.com/embed-iframe.txt" target="_blank">snippet</a>
|
|
into your HTML
|
|
</div>
|
|
<br/>
|
|
</div>
|
|
|
|
<div class="one-third column"> </div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="graybg row-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="three columns"> </div>
|
|
|
|
<div class="six columns" style="text-align: center;">
|
|
<a id="beta" class="anchor"></a>
|
|
<h4>Remarkbox is almost ready!</h4>
|
|
|
|
<span class="avoidwrap">Join the list for <b>early access</b> to</span>
|
|
<span class="avoidwrap"> updates and advanced features</span>
|
|
|
|
<br />
|
|
<br />
|
|
|
|
<!-- Begin MailChimp Signup Form -->
|
|
<div id="mc_embed_signup">
|
|
<form action="//ballestrini.us2.list-manage.com/subscribe/post?u=c64d1bc4e5a99ee1343dba0fc&id=b4deeab70b" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
|
|
<div id="mc_embed_signup_scroll" style="text-align: center;">
|
|
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
|
<div style="position: absolute; left: -5000px;" aria-hidden="true">
|
|
<input type="text" name="b_c64d1bc4e5a99ee1343dba0fc_b4deeab70b" tabindex="-1" value=""></div>
|
|
<center>
|
|
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" style="padding: auto;" required>
|
|
<input type="submit" value="join beta" name="subscribe" id="mc-embedded-subscribe" class="button">
|
|
</center>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<!--End mc_embed_signup-->
|
|
|
|
Space is <b>limited</b> but if you are selected<br/> your <b>feedback will shape</b> Remarkbox!
|
|
</div>
|
|
|
|
<div class="three columns"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="six columns" style="padding-left: 5%">
|
|
|
|
<a id="about" class="anchor"></a>
|
|
<h4>About Remarkbox</h4>
|
|
|
|
<p>
|
|
<img src="https://lh3.googleusercontent.com/-uAPZy7NmmP0/AAAAAAAAAAI/AAAAAAAAAnI/iG2P43gCL2U/s140-c/photo.jpg" align="left" style="margin-right: 20px; margin-top: 5px;">
|
|
<b><a href="http://russell.ballestrini.net/about">Russell Ballestrini</a></b> - <i>Founder</i>
|
|
|
|
My vision of Remarkbox started back in 2013 while porting
|
|
my blog from Wordpress to Pelican, a static-site-generator.
|
|
</p>
|
|
<p>
|
|
I had a problem: what would I do with my readers comments?
|
|
</p>
|
|
|
|
<p>
|
|
My research found solutions which served ads and I didn't want that.
|
|
I set out to build my own solution because - <br/>"how long could it possibly take to build an embeddable comment system?" (hint: 3 years)
|
|
</p>
|
|
|
|
Lots of love and thought have gone into making Remarkbox. I hope you and your readers enjoy using it!
|
|
|
|
</div>
|
|
|
|
<div class="six columns" style="padding-left: 5%">
|
|
|
|
<h5>Resilient Web Design</h5>
|
|
|
|
<p>
|
|
Remarkbox follows resilient web design principles.
|
|
This means Remarkbox will work even when Javascript does not.
|
|
</p>
|
|
<p>
|
|
When Javascript works, Remarkbox will powerup and enhance the user experience!
|
|
</p>
|
|
|
|
<p>
|
|
For more details read: <a href="http://russell.ballestrini.net/capability-driven-presentation/" target="_blank">Capability driven Presentation</a>
|
|
</p>
|
|
|
|
<br />
|
|
<br />
|
|
<br />
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="graybg">
|
|
<div class="container">
|
|
<div class="row row-padding">
|
|
|
|
<a id="remarkbox-demo" class="anchor"></a>
|
|
<h4>Remarkbox Demo <span style="font-size: .65em; margin-left: 10px;">try it out! </span></h4>
|
|
|
|
<!-- Remarkbox - Your readers want to communicate with you -->
|
|
<script src="https://demo.remarkbox.com/static/js/iframe-resizer/iframeResizer.min.js"></script>
|
|
<script>
|
|
var thread_fragment = window.location.hash;
|
|
var thread_uri = window.location.href;
|
|
document.write('<iframe id="remarkbox" src="https://demo.remarkbox.com/embed?thread_uri=' + thread_uri + '" title="remarkbox" width="100%" style="width: 100% !important; border: none !important; overflow: hidden !important;" tabindex="0"></iframe>');
|
|
iFrameResize({
|
|
checkOrigin: ["https://demo.remarkbox.com"],
|
|
inPageLinks: true,
|
|
initCallback: function(e) {
|
|
e.iFrameResizer.moveToAnchor(thread_fragment)
|
|
}
|
|
}, document.getElementById("remarkbox"));
|
|
</script>
|
|
<noscript>
|
|
<iframe id=remarkbox src="https://demo.remarkbox.com/embed?nojs=true" style=height:600px;width:100%;border:none!important tabindex=0></iframe>
|
|
</noscript>
|
|
|
|
<hr>
|
|
|
|
<br/>
|
|
<center>
|
|
<h5>We need you to join the <a href="#beta">beta</a> test!</h5>
|
|
</center>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="row-padding">
|
|
<center>
|
|
<b>
|
|
Remarkbox ©2016-2017 | USA, Connecticut, New London | <a href="https://twitter.com/RussellBal" target="_blank">@russellbal</a> | <a href="https://twitter.com/remarkbox" target="_blank">@Remarkbox</a>
|
|
</b>
|
|
</center>
|
|
</div>
|
|
<div class="redline"></div>
|
|
|
|
</body>
|
|
|
|
</html>
|