WordPress.org

Making WordPress.org

Opened 5 months ago

Last modified 4 months ago

#4508 assigned enhancement

Suggestion to make "make glossary" less obtrusive

Reported by: tobifjellner Owned by: tellyworth
Milestone: Priority: normal
Component: Make (Get Involved) / P2 Keywords: has-patch needs-testing
Cc:

Description

The new https://wordpress.org/plugins/wporg-glossary/ is a good idea.
However, if a page on make has many matches against the glossary, it may become hard to handle the page: whenever you move the pointer over the page you almost always happen to pass over some explained term (that you almost always know very well...) and ... poff a popup blows up and you have to wait a bit before you can continue what you were doing.

Suggestion: Make the popups trigger on click and not on hover.

I've suggested the same in https://wordpress.org/support/topic/could-it-be-a-bit-less-obtrusive/ I just don't know where is the best place for this.

Attachments (1)

4508.diff (632 bytes) - added by garrett-eclipse 4 months ago.
Patch for the wporg-glossary plugin to switch tippy to click and use hoverintent to trigger the click

Download all attachments as: .zip

Change History (11)

#1 @garrett-eclipse
5 months ago

Thought: If hover is too fast and click isn't desired there's always hover-intent.

#2 @dd32
5 months ago

  • Keywords needs-patch added

We had considered using click, in combination with a few other things for accessibility, but ultimately had ruled out using click for a few different reasons that I'm not going to go into right now.

Using hoverintent style approach however makes a lot of sense here, and will mostly avoid unintentional expansions.

If there's any pages which are showing the glossary definitions particularly badly, I'd appreciate it being linked here for reference so it can be taken into account. Some glossary items have been removed if they're not as useful as could be.

#3 @tobifjellner
5 months ago

If there's any pages which are showing the glossary definitions particularly badly,
I'd appreciate it being linked here for reference so it can be taken into account.
Some glossary items have been removed if they're not as useful as could be.

@dd32 The pre-existing Polyglots glossary has some quite long "explanations", if several of them happen to match a in page, then there may be several dangerous spots in a post, where I need to, say, mark some checkboxes... See, for instance, https://make.wordpress.org/polyglots/2019/06/11/clpte-request-woobewoo-plugins/

#4 @garrett-eclipse
5 months ago

One other thing to note with the post @tobifjellner pointed out, along with the quick to popup it takes a long time to go away so you either need to click away or wait to read the content that gets hidden behind the post. When a user desires to read the content they usually stay on the word or in the tooltip so leaving the hover area might be improved by dismissing a little faster.

This ticket was mentioned in Slack in #accessibility by sergey. View the logs.


5 months ago

#6 follow-up: @tellyworth
5 months ago

@talldanwp suggested https://github.com/tristen/hoverintent as a possible candidate for implementing this.

#7 in reply to: ↑ 6 @SergeyBiryukov
5 months ago

Replying to tellyworth:

@talldanwp suggested https://github.com/tristen/hoverintent as a possible candidate for implementing this.

Since Make blogs appear to include jQuery, can't we just use core's bundled hoverIntent.js?

This ticket was mentioned in Slack in #meta by tobifjellner. View the logs.


4 months ago

#9 @tellyworth
4 months ago

  • Owner set to tellyworth
  • Status changed from new to assigned

hoverIntent is a little tricky to hook into tippyjs. As a compromise for now I've tweaked the delay parameter, to add a delay before hovering and decrease the delay before hiding. It's not ideal but seems an improvement.

@garrett-eclipse
4 months ago

Patch for the wporg-glossary plugin to switch tippy to click and use hoverintent to trigger the click

#10 @garrett-eclipse
4 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

Thanks @tellyworth

Playing around with this via inspect I found switching tippy to click and then triggering the click action on hoverIntent works nicely. I didn't find the code in meta SVN so pulled the plugin SVN to make the 4508.diff patch, not sure if that's the right approach?

I also dropped the delay as hoverIntent basically has it's own delay.

Please give it a test and let me know how you feel.

Note: See TracTickets for help on using tickets.