www.remarkbox.com/index.html
2017-03-20 20:08:23 -04:00

417 lines
13 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">
<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="custom2.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 name="top"></a>
<div class="redline"></div>
<div class="navbar hidden-on-tablet">
<a href="http://www.remarkbox.com"><img src="remarkbox-minified.png" class="navlogo" /></a>
<div class="navlinks">
<a href="#plans">Plans</a>
<a href="#faq">FAQ</a>
<a href="#beta">Beta</a>
<a href="#about">About</a>
<a href="#remarkbox-demo">Demo</a>
</div>
</div>
<div class="proposition">
<div class="container">
<center><a href="http://www.remarkbox.com">
<img src="remarkbox-minified.png" class="herologo" /></a>
<h2>Your readers want <span class="avoidwrap">to communicate with you</span></h2>
</center>
<div class="row">
<div class="one-half column">
<center>
<span style="font-size: 1.25em;">
<a name="free"></a>
<br />
<br />
<br />
Remarkbox offers a <span class="avoidwrap"><b>free comment system</b></span>
<br />
to keep readers engaged <span class="avoidwrap">with your content.</span>
<br />
<br />
It works everywhere, <span class="avoidwrap">even <b>static sites</b>!</span>
<br />
<br />
Simply copy and paste into your HTML.
<br />
We handle the rest!
</span>
<br />
<br />
<br />
<!--<button style="color: #FFFFFF; background-color: #AA0000; border-color: #AA0000;">Get Started</button>
-->
<a class="button red" href="#remarkbox-demo">Try Remarkbox</a>
<br />
<b>or <a href="#learn">learn more</a></b>
<br />
<br />
</center>
</div>
<div class="one-half column">
<center>
<br />
<br />
<br />
<br />
<textarea style="width: 96%; height: 270px; font-size: .7em; color: #999999; border-color: #cccccc;" disabled><!-- Remarkbox - readers want to communicate with you -->
<script type="text/javascript" src="https://demo.remarkbox.com/static/js/iframe-resizer/iframeResizer.min.js"></script><script type="text/javascript">thread_fragment=window.location.hash; 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;" allowtransparency="true" scrolling="no" horizontalscrolling="no" verticalscrolling="no" tabindex="0" seamless></iframe>'); iFrameResize({inPageLinks: true, initCallback: function(iframe){iframe.iFrameResizer.moveToAnchor(thread_fragment);}}, document.getElementById("remarkbox") );</script><noscript><iframe id="remarkbox" src="https://demo.remarkbox.com/embed?nojs=true" frameborder="0" style="height: 600px; width: 100%; border: none !important;" allowtransparency="true" height="600px" width="100%"></iframe></noscript></textarea>
<br />
<b>&#11014; Setup on your web page in 30s or less</b>
</center>
</div>
</div>
<div class="row">
<center>
<h3 style="margin-top: 80px">Looking for a Disqus alternative?</h3>
</center>
We all agree that Disqus has jumped the shark. Their user experience is distracting and they serve advertisements.
<br/>
Not only that, but they actively cause your visitors to bounce to their dashboard.
As a result, Remarkbox was created to satisfy the need for a comment system that <b>works for the site owner</b>, not against them.
<a href="#about">... read more<a/>
</div>
</div>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<span id="learn">
<div class="nav">
<div>
<a href="http://www.remarkbox.com"><img src="remarkbox-minified.png" class="navlogo" /></a>
<div class="navlinks">
<a href="#plans">Plans</a>
<a href="#faq">FAQ</a>
<a href="#beta">Beta</a>
<a href="#about">About</a>
<a href="#remarkbox-demo">Demo</a>
</div>
</div>
</div>
<div class="reasons row-padding">
<center>
<h4>Your search for the perfect blog comment system ends today</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" width="98%" style="margin-top: 20px;">
<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>
<ul style="margin-bottom: 40px;">
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!
</ul>
</div>
</div>
<!--
<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
-->
<span id="plans">
<span id="faq">
</div>
</div>
<div class="container row-padding" style="max-width: 960px">
<center><h5>Plans and Pricing</h5></center>
<br/>
<div class="row">
<div class="one-third column">
<br/>
<div class="pricebox">
<b>None</b>
<h3>Free</h3>
No moderator
<br/>
<br/>
<br/>
<b><a href="#free" class="button red">Free</a></b>
<br/>
Just put the snippet into your HTML
</div>
</div>
<div class="one-third column">
<div class="redline"></div>
<div class="pricebox deal">
<b>One</b>
<h3>$6/mo</h3>
One moderator on<br/>
<span class="avoidwrap">one verified domain</span>
<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>Many</b>
<h3>$16/mo</h3>
One moderator on<br/>
<span class="avoidwrap">unlimited verified domains</span>
<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>
</div>
<br><br><br><br>
<div class="row">
<h5>FAQ</h5>
<div class="one-half column" style="padding-left: 5%;">
<p style="margin-bottom: 10px;">
<b>Do you have any real examples?</b>
<ul style="margin-left: 20px;">
<li><a href="http://russell.ballestrini.net/random.html" target="_blank">http://russell.ballestrini.net/random.html</a></li>
<li><a href="https://linkpeek.com/blog" target="_blank">https://linkpeek.com/blog</a></li>
<li><a href="http://westworld2.com/">http://westworld2.com</a></li>
<li><a href="http://webscale.plumbing/managing-apt-repos-in-s3-using-lambda" target="_blank">http://webscale.plumbing</a></li>
<li><a href="http://gumyum.com/" target="_blank">http://gumyum.com</a></li>
<li><a href="http://www.remarkbox.com/#remarkbox">http://www.remarkbox.com/#remarkbox</a></li>
</ul>
</p>
</div>
<span id="beta">
</div>
</div>
<div class="graybg row-padding">
<div class="container">
<div class="row">
<div class="three columns">&nbsp;</div>
<div class="six columns">
<h5>Remarkbox Beta</h5>
For <b>beta access</b> to advanced features and updates <span class="avoidwrap"> join the email list.</span>
<br />
<br />
<!-- Begin MailChimp Signup Form -->
<div id="mc_embed_signup">
<form action="//ballestrini.us2.list-manage.com/subscribe/post?u=c64d1bc4e5a99ee1343dba0fc&amp;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">
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
<!-- 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>
<div class="clear"><input type="submit" value="join beta" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
<i>(only 2 messages a month)</i>
</form>
</div>
<!--End mc_embed_signup-->
<span id="about">
Your <b>feedback will shape</b> Remarkbox!
</div>
<div class="three columns">&nbsp;</div>
</div>
</div>
</div>
<div class="row-padding">
<div class="container">
<div class="row">
<div class="six columns" style="padding-left: 5%">
<h5>About Remarkbox</h5>
<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>
<span id="remarkbox-demo">
</div>
</div>
</div>
<div class="graybg">
<div class="container">
<div class="row row-padding">
<h5>Remarkbox Demo <span style="font-size: .65em; margin-left: 10px;">try it out! </span></h5>
<!-- Remarkbox - readers want to communicate with you -->
<script type="text/javascript" src="https://demo.remarkbox.com/static/js/iframe-resizer/iframeResizer.min.js"></script><script type="text/javascript">thread_fragment=window.location.hash; 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;" allowtransparency="true" scrolling="no" horizontalscrolling="no" verticalscrolling="no" tabindex="0" seamless></iframe>'); iFrameResize({inPageLinks: true, initCallback: function(iframe){iframe.iFrameResizer.moveToAnchor(thread_fragment);}}, document.getElementById("remarkbox") );</script><noscript><iframe id="remarkbox" src="https://demo.remarkbox.com/embed?nojs=true" frameborder="0" style="height: 600px; width: 100%; border: none !important;" allowtransparency="true" height="600px" width="100%"></iframe></noscript>
</div>
</div>
</div>
<div class="row-padding">
<center>
<b>
&#169;2016-2017 | USA, Connecticut, New London | <a href="https://twitter.com/RussellBal" target="_blank">@russellbal</a>
</b>
</center>
</div>
<div class="redline"></div>
</body>
</html>