Add Copy To Clipboard Buttons To Code Blocks
Learn how to add a button to your code blocks that lets your users easily copy the code to their clipboard. We make the buttons a web component too which makes it extremely portable to use in any project.
▬▬▬▬▬▬▬▬▬▬ Links
Source code: https://github.com/littlesticks/astro...
▬▬▬▬▬▬▬▬▬▬ Let's Connect
Join our Discord; https://littlesticks.dev/discord
Jaydan's Twitter: / jaydanurwin
Little Sticks Twitter: / littlesticksdev
▬▬▬▬▬▬▬▬▬▬ Timestamps
What We're Building and How - 0:00
Our Starter Files - 2:14
Styling our Pre Elements - 2:55
Creating the Copy Code Button Web Component - 5:20
Adding Buttons to all Code Blocks - 7:50
Hydrating the Copy Buttons - 11:00
Styling the Copy Buttons - 12:15
Adding the Copy Function - 13:50
Wrap Up & Using In Your Own Site - 19:50