brookesb91 / vellum

Webrings: Reborn

Vellum

Webrings: Reborn

---

🔗 Live Site Here

Or deploy your own

Heroku no longer provides a free MongoDB addon tier so the deployment will require a database to be set-up for the environment and for the MONGODB_URI variable to be set.

Introduction

TODO

---

🌐 For Webmasters

🚀 Quick Set-Up

Add the Vellum iframe to your page.

referrerpolicy must be set to unsafe-url

<iframe
  src="https://vellum-app.herokuapp.com/embed"
  frameborder="0"
  referrerpolicy="unsafe-url"
></iframe>

Add the required meta information to your page head.

<meta name="vellum:title" content="Skribul" />
<meta name="vellum:description" content="Share your doodles" />
<meta name="vellum:image" content="https://skribul.app/images/logo.png" />
<meta name="vellum:tags" content="web-app,drawing,social" />

🔧 Advanced Set-Up

🎨 Custom CSS

Append the styles query parameter to link your custom CSS.

<iframe
  src="https://vellum-app.herokuapp.com/embed?styles=https://my.custom.site/styles.css"
  frameborder="0"
  referrerpolicy="unsafe-url"
></iframe>

Tags have the following markup

<!-- Tags root -->
<div class="tags">
  <!-- Each tag has a class the same as its name -->
  <!-- Passive tag -->
  <a class="tag social">
    <span>social</span>
  </a>
  <!-- Active tag -->
  <a class="tag education active">
    <span>education</span>
  </a>
</div>

---

For Developers

TODO

---

📖 Meta Reference

Items marked as required are required as a minimum to show your page on Vellum's aggregated feed.

Name	Selector	Description	Fallbacks
Title (required)	meta[name="vellum:title"][content]	Page title	meta[property="og:title"][content], title
Description (required)	meta[name="vellum:description"][content]	Page description	meta[property="og:description"][content], meta[name="Description"][content], meta[name="description"][content]
Image (required)	meta[name="vellum:image"][content]	Page image	meta[property="og:image:url"][content], meta[property="og:image"][content]
Icon	meta[name="vellum:icon"][content]	Page icon	link[rel="icon"][sizes="196x196"][href], link[rel="icon"][sizes="32x32"][href], link[rel="icon"][href]
Type	meta[name="vellum:type"][content]	Page type	meta[property="og:type"][content]
Locale	meta[name="vellum:locale"][content]	Page locale	meta[property="og:locale"][content]
Name	meta[name="vellum:name"][content]	Page site name	meta[property="og:site_name"][content]
Tags	meta[name="vellum:tags"][content]	Page tags (Max 10)	(No fallback)
Color	meta[name="vellum:color"][content]	Page theme color	meta[name="theme-color"][content]

Recommendations

TODO