diff --git a/demo/src/bluesky.md b/demo/src/bluesky.md new file mode 100644 index 00000000..2a931e50 --- /dev/null +++ b/demo/src/bluesky.md @@ -0,0 +1,5 @@ +--- +title: Bluesky +--- + +https://bsky.app/profile/bsky.app/post/3lgu4lg6j2k2v diff --git a/demo/src/index.md b/demo/src/index.md index d39d9af1..77269885 100644 --- a/demo/src/index.md +++ b/demo/src/index.md @@ -1,5 +1,6 @@ This is an example site to demonstrate and test the functionality of [Embed Everything](https://gfscott.com/embed-everything). +- [Bluesky example](/bluesky/) - [Instagram example](/instagram/) - [OpenStreetMap example](/osm/) - [Soundcloud example](/soundcloud/) @@ -9,4 +10,4 @@ This is an example site to demonstrate and test the functionality of [Embed Ever - [Twitch example](/twitch/) - [Twitter example](/twitter/) - [Vimeo example](/vimeo/) -- [YouTube example](/youtube/) \ No newline at end of file +- [YouTube example](/youtube/) diff --git a/packages/bluesky/CHANGELOG.md b/packages/bluesky/CHANGELOG.md new file mode 100644 index 00000000..fd3ba3e0 --- /dev/null +++ b/packages/bluesky/CHANGELOG.md @@ -0,0 +1,5 @@ +## 1.0.0 + +### Major Changes + +- Adds support for embedding Bluesky posts using just their URLs. diff --git a/packages/bluesky/README.md b/packages/bluesky/README.md new file mode 100644 index 00000000..208d236f --- /dev/null +++ b/packages/bluesky/README.md @@ -0,0 +1,107 @@ +# eleventy-plugin-embed-bluesky + +This [Eleventy](https://www.11ty.dev/) plugin automatically embeds Bluesky posts from URLs in markdown files. It's part of the [`eleventy-plugin-embed-everything`](https://gfscott.com/embed-everything/) project. + +## Install in Eleventy + +In your Eleventy project, [install the plugin](https://www.11ty.dev/docs/plugins/#adding-a-plugin) through npm: + +```sh +$ npm i eleventy-plugin-embed-bluesky +``` + +Then add it to your [Eleventy config](https://www.11ty.dev/docs/config/) file (usually `.eleventy.js`): + +```javascript +const embedBluesky = require("eleventy-plugin-embed-bluesky"); + +module.exports = function (eleventyConfig) { + eleventyConfig.addPlugin(embedBluesky); +}; +``` + +## Usage + +To embed a Bluesky post into any markdown page, paste its URL into a new line. The URL should be the only thing on that line. + +### Markdown file example: + +```markdown +... + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vehicula, elit vel condimentum porta, purus. + +https://bsky.app/profile/shellen.com/post/3ldmp5qd6es2p + +Maecenas non velit nibh. Aenean eu justo et odio commodo ornare. In scelerisque sapien at. + +... +``` + +## Settings + +You can configure the plugin to change its behavior by passing an options object to the `addPlugin` function: + +```javascript +eleventyConfig.addPlugin(embedBluesky, { + // just an example, see default values below: + embedClass: "custom-classname", + embedDomain: "staging.bsky.app", +}); +``` + +### Plugin default options + +The plugin's default settings reside in [lib/defaults.js](lib/defaults.js). All of these values can be customized with an options object passed to the plugin. + +| Option | Type | Default | Notes | +| ------------------- | ------- | ------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- | +| `allowFullscreen` | Boolean | `true` | Set to false to prevent the embedded post from being viewed in fullscreen mode. | +| `containerCss` | String | `"position: relative; width: 100%; padding-bottom: 0;"` | CSS applied to the container `