<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<!-- Standard Meta -->
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
|
|
|
<!-- Site Properities -->
|
|
<title>Telegraph</title>
|
|
<link rel="stylesheet" type="text/css" href="/semantic-ui/semantic.min.css">
|
|
|
|
<style type="text/css">
|
|
|
|
.hidden.menu {
|
|
display: none;
|
|
}
|
|
|
|
.masthead.segment {
|
|
min-height: 700px;
|
|
padding: 1em 0em;
|
|
}
|
|
.masthead .logo.item img {
|
|
margin-right: 1em;
|
|
}
|
|
.masthead .ui.menu .ui.button {
|
|
margin-left: 0.5em;
|
|
}
|
|
.masthead h1.ui.header {
|
|
margin-top: 3em;
|
|
margin-bottom: 0em;
|
|
font-size: 4em;
|
|
font-weight: normal;
|
|
}
|
|
.masthead h2 {
|
|
font-size: 1.7em;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.ui.vertical.stripe {
|
|
padding: 8em 0em;
|
|
}
|
|
.ui.vertical.stripe h3 {
|
|
font-size: 2em;
|
|
}
|
|
.ui.vertical.stripe .button + h3,
|
|
.ui.vertical.stripe p + h3 {
|
|
margin-top: 3em;
|
|
}
|
|
.ui.vertical.stripe .floated.image {
|
|
clear: both;
|
|
}
|
|
.ui.vertical.stripe p {
|
|
font-size: 1.33em;
|
|
}
|
|
.ui.vertical.stripe .horizontal.divider {
|
|
margin: 3em 0em;
|
|
}
|
|
|
|
.quote.stripe.segment {
|
|
padding: 0em;
|
|
}
|
|
.quote.stripe.segment .grid .column {
|
|
padding-top: 5em;
|
|
padding-bottom: 5em;
|
|
}
|
|
|
|
.footer.segment {
|
|
padding: 5em 0em;
|
|
}
|
|
|
|
.secondary.pointing.menu .toc.item {
|
|
display: none;
|
|
}
|
|
|
|
@media only screen and (max-width: 700px) {
|
|
.ui.fixed.menu {
|
|
display: none !important;
|
|
}
|
|
.secondary.pointing.menu .item,
|
|
.secondary.pointing.menu .menu {
|
|
display: none;
|
|
}
|
|
.secondary.pointing.menu .toc.item {
|
|
display: block;
|
|
}
|
|
.masthead.segment {
|
|
min-height: 350px;
|
|
}
|
|
.masthead h1.ui.header {
|
|
font-size: 2em;
|
|
margin-top: 1.5em;
|
|
}
|
|
.masthead h2 {
|
|
margin-top: 0.5em;
|
|
font-size: 1.5em;
|
|
}
|
|
}
|
|
|
|
.ui.inverted.segment.masthead {
|
|
background-image: url(/assets/telegraph-header.jpg);
|
|
background-position: center;
|
|
}
|
|
|
|
.ui.secondary.inverted.pointing.menu, .ui.secondary.pointing.menu {
|
|
border: 0;
|
|
}
|
|
|
|
pre.code {
|
|
padding: 8px 12px;
|
|
border-radius: 4px;
|
|
border: 1px #ddd solid;
|
|
background-color: rgba(248,246,255,1);
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
</style>
|
|
|
|
<script src="/assets/jquery-1.11.3.min.js"></script>
|
|
<script src="/semantic-ui/semantic.min.js"></script>
|
|
<script>
|
|
$(document)
|
|
.ready(function() {
|
|
|
|
// fix menu when passed
|
|
$('.masthead')
|
|
.visibility({
|
|
once: false,
|
|
onBottomPassed: function() {
|
|
$('.fixed.menu').transition('fade in');
|
|
},
|
|
onBottomPassedReverse: function() {
|
|
$('.fixed.menu').transition('fade out');
|
|
}
|
|
})
|
|
;
|
|
|
|
// create sidebar and attach to menu open
|
|
$('.ui.sidebar')
|
|
.sidebar('attach events', '.toc.item')
|
|
;
|
|
|
|
})
|
|
;
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<?php
|
|
$menu = [
|
|
'/' => 'Home',
|
|
'/api' => 'API',
|
|
];
|
|
?>
|
|
|
|
<!-- Following Menu -->
|
|
<div class="ui large top fixed hidden menu">
|
|
<div class="ui container">
|
|
<?php foreach($menu as $href=>$name): ?>
|
|
<a class="item" href="<?= $href ?>"><?= $name ?></a>
|
|
<?php endforeach; ?>
|
|
<div class="right menu">
|
|
<div class="item">
|
|
<a class="ui button" href="/login">Log in</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sidebar Menu -->
|
|
<div class="ui vertical inverted sidebar menu">
|
|
<?php foreach($menu as $href=>$name): ?>
|
|
<a class="item" href="<?= $href ?>"><?= $name ?></a>
|
|
<?php endforeach; ?>
|
|
<a class="item" href="/login">Login</a>
|
|
</div>
|
|
|
|
|
|
<!-- Page Contents -->
|
|
<div class="pusher">
|
|
<div class="ui inverted vertical masthead center aligned segment">
|
|
|
|
<div class="ui container">
|
|
<div class="ui large secondary inverted pointing menu">
|
|
<a class="toc item">
|
|
<i class="sidebar icon"></i>
|
|
</a>
|
|
<?php foreach($menu as $href=>$name): ?>
|
|
<a class="item" href="<?= $href ?>"><?= $name ?></a>
|
|
<?php endforeach; ?>
|
|
<div class="right item">
|
|
<a class="ui inverted button" href="/login">Log in</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ui text container">
|
|
<h1 class="ui inverted header">
|
|
Telegraph
|
|
</h1>
|
|
<h2>Easily send Webmentions from your website</h2>
|
|
<a class="ui huge primary button" href="/login">Get Started <i class="right arrow icon"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="ui vertical stripe segment">
|
|
<div class="ui text container">
|
|
<h3 class="ui header">We send webmentions for you</h3>
|
|
<p>Instead of messing with the details of sending webmentions yourself, we have a simple API that will handle endpoint discovery, gracefully handle failures and retries, and will let you know whether a webmention was successfully sent. All you have to do is tell us the page you want to send the webmention to and we'll take it from there.</p>
|
|
<a class="ui large button" href="/api">Read More</a>
|
|
<!--
|
|
<h4 class="ui horizontal header divider">
|
|
Case Studies
|
|
</h4>
|
|
<h3 class="ui header">Did We Tell You About Our Bananas?</h3>
|
|
<p>Yes I know you probably disregarded the earlier boasts as non-sequitor filler content, but its really true. It took years of gene splicing and combinatory DNA research, but our bananas can really dance.</p>
|
|
<a class="ui large button">I'm Still Quite Interested</a>
|
|
-->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ui vertical stripe segment">
|
|
<div class="ui middle aligned stackable grid container">
|
|
<div class="row">
|
|
<div class="seven wide column">
|
|
<img src="/assets/dashboard-screenshot.jpg" class="ui large bordered rounded image">
|
|
</div>
|
|
<div class="eight wide column">
|
|
<h3 class="ui header">Webmentions at a glance</h3>
|
|
<p>Sign in to quickly send webmentions from the Dashboard, and see the status of your previously sent webmentions.</p>
|
|
<p>The status of each webmention can be viewed individually, so you can tell whether it worked or how it failed.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ui vertical stripe segment">
|
|
<div class="ui middle aligned stackable grid container">
|
|
<div class="row">
|
|
<div class="eight wide column">
|
|
<h3 class="ui header">Send Webmentions with a Simple API</h3>
|
|
<p>Let Telegraph send webmentions for you. With a simple API, Telegraph will handle sending webmentions to other websites. Let us handle webmention endpoint discovery and handling failures.</p>
|
|
<h3 class="ui header">Get updates on webmention delivery</h3>
|
|
<p>With a simple web hook, Telegraph will notify your site when a webmention was successfully sent or if an error occurred.</p>
|
|
<!--
|
|
<h3 class="ui header">Send webmentions automatically</h3>
|
|
<p>You can even let Telegraph subscribe to your feed, and it will send webmentions whenever you publish a new post.</p>
|
|
-->
|
|
</div>
|
|
<div class="seven wide right floated column">
|
|
<pre class="code"><code>
|
|
POST /webmention HTTP/1.1
|
|
Content-type: application/json
|
|
|
|
{
|
|
"source": "http://source.example.com/post/100",
|
|
"target": "http://target.example.net/",
|
|
"callback": "http://yoursite.example.org/webmention-status"
|
|
"token": "xxxx"
|
|
}
|
|
</code></pre>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="center aligned column">
|
|
<a class="ui huge button" href="/api">API Docs</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!--
|
|
<div class="ui vertical stripe quote segment">
|
|
<div class="ui equal width stackable internally celled grid">
|
|
<div class="center aligned row">
|
|
<div class="column">
|
|
<h3>"Nice thing"</h3>
|
|
<p>A quote by a nice person</p>
|
|
</div>
|
|
<div class="column">
|
|
<h3>"This makes everything so much easier."</h3>
|
|
<p>
|
|
<img src="/assets/ben.jpg" class="ui avatar image"> <b>Ben</b> Chief Ben Officer
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
-->
|
|
|
|
|
|
<? $this->insert('footer-block') ?>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|