Creating Scroll to Top in Gutenberg Without Plugin
The scroll to top button in WordPress can be created with just a Gutenberg editor and CSS.
Here is the CSS code:
.scroll-to-top {
position: fixed;
bottom: 2rem;
right: 2rem;
z-index: 100;
opacity: 0;
animation: fadeIn 0.5s forwards;
animation-delay: 5s;
}
@keyframes fadeIn{
to {
opacity: 1;
}
}
html {
scroll-behavior: smooth;
}
My favorite hosting 🌐 https://nusapixel.com/CloudHosting
Screen recorder (40% off) 🎥 https://nusapixel.com/ScreenRecorder
Microphone 🎤 https://amzn.to/43MElAX
Boom arm 💥 https://amzn.to/4cMj7ak
https://nusapixel.com/
/ nusapixelweb
00:00 Example of scroll to top button
00:24 A few caveats...
01:01 Start creating button
03:09 Adding some CSS
06:56 Fixing jaggy issue
https://nusapixel.com/how-to-create-s...