A few days ago, I had looked at my WordPress follow button because I don’t like how it placed and it’s style. I needed a way to hide and show the follow my blog button. In fact, my inspiration came from the original style. So, I started googling for helpful WordPress Plugins. For example, I need a way to attach my follow button to the bottom right and fade it when the user scrolls the mouse wheel. Despite my journey with WordPress support, I managed to find a few plugins/CSS to help me with the result I needed. Here is a list of useful items that helped me:
The 4 Plugins
Headroom.js is a lightweight, high-performance JS widget (with no dependencies!) that allows you to react to the user’s scroll. The header on this site is a living example, it slides out of view when scrolling down and slides back in when scrolling up.
Ad management plugin with many advanced advertising features. Supports all kinds of WordPress ads including Google AdSense, contextual Amazon Native Shopping Ads, Media.net and rotating banners.
- Yoast Comment Hacks
- Control Comment length and a way to email commenters
- Ultimate Category Excluder
- A way to filter out blog categories
Helpful WordPress Plugins: Let’s Customize 🏗️
The nice thing about this combination of plugins is that I can customize the look and feel. In other words, I popped in some JavaScript, CSS and got a few new features. For example, when the user scrolls down, the button hides or doesn’t bother you while you read my posts! Also, that alone was a trill because of how fluidly it disappears. Yet, Headroom works on your call to action and navigation headers. In other words, hide your header until you need it. Please let me know if you feel that I should add more to this list?
.headroom {
will-change: transform;
transition: transform 200ms linear;
}
.headroom--pinned {
transform: translateY(0%);
}
.headroom--unpinned {
transform: translateY(130%);
}
div.code-block-1:hover {
opacity: 1.0;
transition-timing-function: linear;transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
}
div.code-block-1 {
opacity: 0.4;
}
Question for you⁉️
I added some ads in between posts. What do you think? Bad idea? distracting? How do you plan to make cash from blogging? Let me know in the comments below?
What’s Crackin’ \ (•◡•) /