Dynamic Author Bio Popup

A nifty little solution to create a dynamic author bio popup using GenerateBlocks!

Kyle Van Deusen

Published:

Filed Under:

Design

Kyle Van Deusen

Kyle Van Deusen

The Admin Bar

After spending 15 years as a graphic designer and earning a business degree, I launched my agency, OGAL Web Design, in 2017. A year later, after finding the amazing community around WordPress, I co-found The Admin Bar, which has grown to become the #1 community for WordPress professionals. I'm a husband and proud father of three, and a resident of the Commonwealth of Virginia.

This content contains affiliate links. View our affiliate disclaimer.

In this video, I’m going to show you how to create a nifty little “popup” that displays author information when you hover over the author’s name in a blog post. Most of it will be done using just GenerateBlocks, but we’ll need just a pinch of CSS to get it. functioning.

Here’s the CSS you need:

@media (min-width: 1025px) {
  .author-popup{
	width: 410px;
	position: absolute;
	display: none;
  }

  .author-link:hover ~ .author-popup{
	display: block;
  }

  .author-popup:hover{
	display: block;
  }
}

.author-popup {
	display: none;
}
Share This Article!
Kyle Van Deusen

Kyle Van Deusen

The Admin Bar

After spending 15 years as a graphic designer and earning a business degree, I launched my agency, OGAL Web Design, in 2017. A year later, after finding the amazing community around WordPress, I co-found The Admin Bar, which has grown to become the #1 community for WordPress professionals. I'm a husband and proud father of three, and a resident of the Commonwealth of Virginia.

Come Join Us!

Join the #1 WordPress Community and dive into conversations covering every aspect of running an agency!

Kyle Van Deusen

Community Manager

Latest Events

September 16, 2025

Termageddon 2.0

Better Tools, Smoother Workflows, Happier Clients

August 19th, 2025

Which WordPress Page Builder is the Most Accessible?

The 2025 Page Builder Accessibility Report

August 15, 2025

Managing Your Agency with Moxie

Can this all-in-one solution help you streamline your agency and calm the chaos?
Care Plan Toolkit

Save time, boost profits, and confidently manage client websites with proven tools, tips, and resources.

Bento Toolkit
The Friday Chaser

Wash down the week with the best of The Admin Bar! News, tips, and the best conversations delivered straight to your inbox every Friday!

More Articles

Vitality Lcp 3

How to Fix Website Cumulative Layout Shift (CLS) Issues

Understand Cumulative Layout Shift (CLS), its impact on user experience, and practical tips to measure and improve your website’s performance.

Taxonomy Featured Img

Understanding WordPress Taxonomies

Learn how to create and manage custom taxonomies in WordPress to better organize your content and improve site structure.

Finance Concept 2023 11 27 05 15 46 Utc

6 Ways Creative Outsourcing Can Drive Sales and Boost Profits for Your Agency

Looking for innovative ways to increase sales and boost profit for your digital or creative agency? Here are some expert insights to help guide your journey.