Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/eallion/mastodon-embed-timeline

🚧🚧🚧🚧🚧Mirror🚧🚧🚧🚧🚧 Mirror of mastodon-embed-timeline. Source: https://gitlab.com/idotj/mastodon-embed-timeline
https://github.com/eallion/mastodon-embed-timeline

embed gotosocial masto mastodon timeline toot

Last synced: 18 days ago
JSON representation

🚧🚧🚧🚧🚧Mirror🚧🚧🚧🚧🚧 Mirror of mastodon-embed-timeline. Source: https://gitlab.com/idotj/mastodon-embed-timeline

Awesome Lists containing this project

README

        

# 🐘 Mastodon embed timeline

![Mastodon timeline widget screenshot](screenshot-light-dark.jpg "Mastodon timeline widget screenshot")

Embed a Mastodon timeline in your page, only with a CSS and JS file.

Demo running:

## πŸ“‹ Table of contents

- [Installation](#installation)
- [Download](#download)
- [CDN](#cdn)
- [Package manager](#package-manager)
- [Setup](#setup)
- [Initialize](#initialize)
- [Local timeline](#local-timeline)
- [Profile timeline](#profile-timeline)
- [Hashtag timeline](#hashtag-timeline)
- [Customize](#customize)
- [API](#api)
- [Examples](#examples)

## Installation

You have three different ways to install it in your project, choose the one that best suits your needs:

### Download

Download into your project the following compiled and minified files:

- `dist/mastodon-timeline.min.css`
- `dist/mastodon-timeline.umd.js`

Now call the CSS and JS files in your HTML page using the `` and `` tags as follows in this example:

```html
<!DOCTYPE html>

<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Your site title</title>
<!-- CSS -->
<link href="path/to/mastodon-timeline.min.css" rel="stylesheet" />
</head>

<body>
<!-- Your HTML content -->

<!-- JavaScript -->
<script src="path/to/mastodon-timeline.umd.js">

// You can initialize the script here