Giter Site home page Giter Site logo

gfscott / eleventy-plugin-embed-twitter Goto Github PK

View Code? Open in Web Editor NEW
13.0 1.0 3.0 617 KB

An Eleventy plugin to automatically embed Tweets in posts

Home Page: https://gfscott.com/embed-everything/

JavaScript 100.00%
eleventy eleventy-plugin 11ty 11ty-plugin twitter

eleventy-plugin-embed-twitter's People

Contributors

antonio-laguna avatar dependabot-preview[bot] avatar dependabot[bot] avatar gfscott avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

eleventy-plugin-embed-twitter's Issues

Option to disable script

Hi @gfscott !

Great plugin here.

I was wondering if you'd be open for a PR that adds three options.

  • Theme: There's no way to change the theme for tweets.
  • Enabling dnt. I think in a privacy world it's great to have DNT enabled by default.
  • Completely disabling the script. I want to build a dark theme switcher and I realised that I'd need to tinker the tweets with JS before the file is injected so I was planning on doing that on my own and realised I can't disable the JS.

I've seen you have an unmerged PR so I'm not sure if you're maintaining this! If you're not let me know too!

Compatibility with Eleventy 1.0.0

Hey @gfscott !

I've found that this and YouTube misbehave a lot with Eleventy 1.0.0-beta2 I'm unsure right now of what could be the root cause and will dig into it a bit.

To summarise what happens is that content just banishes between the embeds for some reason. I thought it could be malformed content but it's not that. The output is just not there.

See below.

This could obviously be something else but I only changed Eleventy's version. I'd need a much more narrowed-down test case to be certain of what the issue could be. I'm wondering if you've considered making it so tests run Eleventy instead of "just the function".

Eleventy 1.0.0

Screenshot 2021-10-21 at 16 31 52

Eleventy 0.12.1

Screenshot 2021-10-21 at 16 32 44

Option to center tweet and hide cards/conversations

Hey! I'd love to see some other options to customize the embed, in addition to #17! According to Twitter, there are options to define the alignment and hide cards or conversations with attributes at the blockquote element, just like data-theme and data-dnt.

Btw, I really appreciate the embed-everything plugins - it helps me a lot!

Calling `eleventyConfig.addPlugin` without a config object results in errors

OK

eleventyConfig.addPlugin(embedTwitter, {
  cacheText: false,
})

OK

eleventyConfig.addPlugin(embedTwitter, {})

FAILS (This is what's shown in the README)

eleventyConfig.addPlugin(embedTwitter)

Error output:

❯ npm start

> @ start REDACTED
> ELEVENTY_ENV=development eleventy --serve & postcss styles/tailwind.css --o _tmp/style.css --watch

Unhandled rejection in promise ([object Promise]): (more in DEBUG output)
> Cannot convert undefined or null to object

`TypeError` was thrown:
    TypeError: Cannot convert undefined or null to object
        at Function.keys (<anonymous>)
        at getKeys (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/deepmerge/dist/cjs.js:61:16)
        at mergeObject (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/deepmerge/dist/cjs.js:86:2)
        at deepmerge (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/deepmerge/dist/cjs.js:117:10)
        at module.exports (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/eleventy-plugin-embed-twitter/.eleventy.js:8:23)
        at UserConfig.addPlugin (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/@11ty/eleventy/src/UserConfig.js:273:7)
        at module.exports (/Users/glenn/src/github.com/REDACTED-www-tailwind/.eleventy.js:50:18)
        at TemplateConfig.mergeConfig (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/@11ty/eleventy/src/TemplateConfig.js:91:25)
        at new TemplateConfig (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/@11ty/eleventy/src/TemplateConfig.js:25:24)
        at Object.<anonymous> (/Users/glenn/src/github.com/REDACTED-www-tailwind/node_modules/@11ty/eleventy/src/Config.js:5:14)

warn - You have enabled experimental features: extendedSpacingScale, defaultLineHeights, extendedFontSizeScale
warn - Experimental features are not covered by semver, may introduce breaking changes, and can change at any time.

risk - There are upcoming breaking changes: purgeLayersByDefault
risk - We highly recommend opting-in to these changes now to simplify upgrading Tailwind in the future.
risk - https://tailwindcss.com/docs/upcoming-changes

REDACTED

Benchmark (Configuration): "svgContents" Nunjucks Filter took 461ms (21.5%, called 1602×, 0.3ms each)
Copied 465 files / Wrote 53 files in 1.91 seconds (36.0ms each, v0.11.0)
Watching…
[Browsersync] Access URLs:
 -------------------------------------
       Local: http://localhost:8080
    External: http://10.147.20.71:8080
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 -------------------------------------
[Browsersync] Serving files from: _site
File changed: _tmp/style.css
File changed: _tmp/style.css


REDACTED

[Browsersync] Reloading files that match: *.css
Benchmark (Configuration): "svgContents" Nunjucks Filter took 266ms (21.5%, called 1602×, 0.2ms each)
Copied 465 files / Wrote 53 files in 1.23 seconds (23.2ms each, v0.11.0)
Watching…
[Browsersync] Reloading files that match: *.css

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.