Skip to content

Instantly share code, notes, and snippets.

@davidsharp

davidsharp/kofi-widget.jsx

Created March 20, 2023 12:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save davidsharp/a400ec3c194dc82f9a20adc8d7b15fd8 to your computer and use it in GitHub Desktop.
Save davidsharp/a400ec3c194dc82f9a20adc8d7b15fd8 to your computer and use it in GitHub Desktop.
Download ZIP
A Preact component for displaying Ko-fi embed
Raw
kofi-widget.jsx
import {useEffect} from 'preact/hooks';
export default function Kofi({name='davidsharp',text='Tip Me',backgroundColor='#fcbf47',textColor='#323842'}){
const widgetScript = (`console.log('Donate @ ko-fi.com/${name}')
kofiWidgetOverlay.draw('${name}', {
'type': 'floating-chat',
'floating-chat.donateButton.text': '${text}',
'floating-chat.donateButton.background-color': '${backgroundColor}',
'floating-chat.donateButton.text-color': '${textColor}'
});`)
useEffect(()=>fetch('https://storage.ko-fi.com/cdn/scripts/overlay-widget.js').then(response=>response.text()).then(script=>{
(new Function(`${script};${widgetScript}`))()
}))
// need to output an element to render
return <span></span>
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment