We use cookies to enrich your experience on MyBBoost by providing personalized content. We do not share any kind of information with other websites or companies. By browsing on MyBBoost you accept that we gather and store some data in your browser. For more informations about our cookies policy, read Cookies policy.
Beta
Hovercards beta 1
Hovercards is a plugin which shows a delightful preview of your users when they hover on usernames around your board. You can customize Hovercards at your wish, fine-tuning what users data to show inside the hovercard and its visual aspect as well.

[Image: GLvYk8J.gif]

Main features


Hovercards is not a complicated plugin. As such, it does not come with many hardcoded options, but it does what it's supposed to do: display cards on hover.

Extensibility


You decide what data to include in a card: once a data point becomes available, you can reference it in Hovercards' unique template, which is then packed and built upon every single hover on an username. Hovercards adds 1 stylesheet you can play around with to customize the visual aspect of the card. By default, MyBBoost's style is included.

Adaptive colors


Every card has its own background color which is picked upon the dominant one from the user's avatar. Text color is adjusted to be readable according to the background color. This is available as an option. Adaptive colors use a nasty technique which absolutely demands the image data, however since it is powered by JavaScript there are many limitations about fetching data across domains. This is circumvented by using Google's public image proxy, which helps gathering the image data while needing some extra time to process the image itself. Usually, the delay does not last longer than 100 ms, which is barely noticeable for humans and their reactivity patterns.

All-in-one query


Hovercards queries the database just the first time you hover on a username, gathering all the users available in the page with one query. This adds an extra layer of trust when it comes to properly assign an user's data to the respective target on screen, and it also saves resources by avoiding too many queries over time.

Requirements


Hovercards requires MyBB 1.8.0+ and PHP 5.4+. It has not been tested, but should be compatible with MyBB 1.6.0+. Just change the compatibility line if you are willing to use it on older versions of MyBB. Support will be given only for boards with 1.8.0+.

Installation instructions


Before installing the plugin you must perform a core edit, which is not handled automatically in the first beta.

  1. Open your inc/functions.php file;
  2. Find the build_profile_link() function;
  3. Find the following snippet:

    return "<a href=\"{$mybb->settings['bburl']}/".get_profile_link($uid)."\"{$target}{$onclick}>{$username}</a>"

    Replace it with:

    return "<a data-uid='{$uid}' href=\"{$mybb->settings['bburl']}/".get_profile_link($uid)."\"{$target}{$onclick}>{$username}</a>"

  4. Save the file.

The installation from now on is as simple as uploading the files maintaining the same folder structure they are compiled to and clicking the button Install & activate within your board's plugin list.

Settings


Hovercards adds 2 settings. Adaptive colors has already been explained above. Fields to use lets you select the available data points. The more data points you will select, the more intense and slow the query will be (although you shouldn't notice the difference most of the times). A FIELD is then available within Hovercard's template with the following, simple syntax: {FIELD}. For example, if you activate the field "username", you will be able to use {username} into Hovercard's template and it will be replaced with the user's formatted username when watching his card.

Templates and stylesheets


Hovercards adds a CSS file named hovercards.css to every theme of your board. You can customize the card's appearance by editing the stylesheet's CSS rules. It also adds a template called hovercards_template which you can customize to change the appearance and the data points to show in a single card, as explained above.

Availability


Hovercards is available in beta testing to Gold subscribers. Subscription policy applies.

Reporting issues


If you encounter an issue, feel free to open a new thread in this forum with detailed instructions on how to reproduce your issue. Suggestions and feature requests are appreciated as well.

Hovercards beta 1.zip

Size: 29.44 KBDownloaded: 16 times
YES! Yay Finally
Awesome plugin!
Thanks for this great plugin.
Thank for releasing more and more amazing plugins, keep it up!
Shade I'm trying to use if conditionals plugin from ZIngaBurga in the hovercard template.

Something like
<if fid7 then>Content for fid7<else>something here if no fid7</if>

Not working though, is there a different variable I should be using?
Thank you for supporting me @'Clark Richard' by buying a lifetime premium subscription. I am not at home at the moment but I will look into your issue as soon as possibile. It's likely conditionals won't work in beta 1, but they will in beta 2.
No problem, you deserve it. Any news on a fix to this, or will it be considered in the next beta?
It's likely you will need to wait till beta 2.
(21 Mar 2017, 18:08)Shade wrote It's likely you will need to wait till beta 2.

No worries. Figured an alternative by display:none the content if the fid is blank through CSS.
<style>
#showfid A[href=""], A[href="null"] {
  display: none;
}
</style>

Still would be nice in the next release to have template conditionals working for more customization abilities.

Thanks again for the plugin Shade, my staff team and users love it.