Kami's Corner

A simple webmention submission form

Heya!
I adapted gobinos webmention form into a web component. To use it, simply add this javascript code to your site:

class WebmentionForm extends HTMLElement {
  constructor() {
    super();
  }
  connectedCallback() {
    const website = window.location.hostname;
    const postUrl = window.location.href
    this.innerHTML = `<form method="POST" action="https://webmention.io/${website}/webmention" class="webmentions__form" target="_blank">
    <input type="hidden" name="target" id="target-input" value="${postUrl}">
    <input id="wm-url" type="url" name="source" placeholder="your-url.com" required="" class="webmentions__url">
    <input type="submit" value="Send Mention" class="webmentions__submit">
  </form>`
  }
}

customElements.define("webmention-form", WebmentionForm);

And then add this to the html of whatever post you want to put the webmention form into:

<webmention-form></webmention-form>