You are viewing page #4
Show original post
Hovercards is a plugin which shows a delightful preview of your users when they hover on usernames around your board. You can customize Hovercards as you wish, fine-tuning what users data to show inside cards and their visual aspect as well.
![[Image: S6lj3yD.gif]](https://i.imgur.com/S6lj3yD.gif)
PHP 5.4
MyBB 1.8.0
PluginLibrary
664 chmod permissions on inc/functions.php
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.
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. A minimal style is included by default.
You can also use JavaScript conditionals to adapt each data point's display. For example, you might want to display a different label when an user hasn't posted yet. You can use the buildTemplateCallback(html, user) function to manipulate the template accounting for each user's values every time it is displayed. The base example is included in the hovercards_script template.
Every card can hold an unique background color which is chosen upon the dominant one from the user's avatar. Text color is adjusted to be readable accounting for the background contrast. This is available as an option. Adaptive colors uses a nasty technique which absolutely demands the image data; cross-site scripting blocks is circumvented by using Google's public image proxy, which helps gathering the image data.
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.
Upload the files maintaining the same folder structure as they come in the package and click the button Install & activate within your board's plugin list.
Hovercards adds 4 settings.
Adaptive colors has already been explained above. If you disable it, you can manually choose and add a default background color for all cards in HEX format.
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 Hovercards' template with the following, simple syntax: {FIELD}. For example, if you activate the field "username", you will be able to use {username} into Hovercards' template and it will be replaced with the user's formatted username when watching his card.
Card positioning lets you decide the orientation of cards relative to their attached object out of 9 possible vertical/horizontal placements. The default orientation is "bottom left".
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 2 templates which you can customize to change both the appearance and data points to show in a single card, as explained above.
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 is available for free.
Support is discontinued due to my departure from programming. Read more why here.
Commercial use
Modification
Distribution
Private use
Warranty
Liability
License notice
Copyright notice
Minimum requirements
PHP 5.4
MyBB 1.8.0
PluginLibrary
664 chmod permissions on inc/functions.php
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. A minimal style is included by default.
You can also use JavaScript conditionals to adapt each data point's display. For example, you might want to display a different label when an user hasn't posted yet. You can use the buildTemplateCallback(html, user) function to manipulate the template accounting for each user's values every time it is displayed. The base example is included in the hovercards_script template.
Adaptive colors
Every card can hold an unique background color which is chosen upon the dominant one from the user's avatar. Text color is adjusted to be readable accounting for the background contrast. This is available as an option. Adaptive colors uses a nasty technique which absolutely demands the image data; cross-site scripting blocks is circumvented by using Google's public image proxy, which helps gathering the image data.
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.
Installation
Upload the files maintaining the same folder structure as they come in the package and click the button Install & activate within your board's plugin list.
Settings
Hovercards adds 4 settings.
Adaptive colors has already been explained above. If you disable it, you can manually choose and add a default background color for all cards in HEX format.
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 Hovercards' template with the following, simple syntax: {FIELD}. For example, if you activate the field "username", you will be able to use {username} into Hovercards' template and it will be replaced with the user's formatted username when watching his card.
Card positioning lets you decide the orientation of cards relative to their attached object out of 9 possible vertical/horizontal placements. The default orientation is "bottom left".
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 2 templates which you can customize to change both the appearance and data points to show in a single card, as explained above.
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.
Availability
Hovercards is available for free.
Support is discontinued due to my departure from programming. Read more why here.Permissions
Commercial use
Modification
Distribution
Private use
Limitations
Warranty
Liability
Conditions
License notice
Copyright notice
| Filename | Size | Downloads |
|---|---|---|
| 39.83 KB | 336 |
Icons are not included. You can customize cards by editing Hovercards' main and only template to your preferences.
I don't see why not. You might get some warnings which may be logged in your error.log file (and which I am glad if you could report as I do not have yet a 7.3 test suite), but otherwise you are safe to run all my plugins on PHP 7.3.
He doesn’t have access to the plugin so he can’t know how. Anyway, MentionMe should be already supported as you can see here on MyBBoost. I’d be happy to help if you can provide your board url.
He doesn’t have access to the plugin so he can’t know how. Anyway, MentionMe should be already supported as you can see here on MyBBoost. I’d be happy to help if you can provide your board url.I can see MentionMe working here, however it doesn't work on my forum, using the latest version of hovercards and mentionme (3.2.12). I'll PM you my board details.
The latest version of MentionMe introduces its own parser which does not use standard MyBB functions. Therefore you will need to edit it and add the data-uid attribute yourself to let Hovercards detect links.
I am not home at the moment but will provide a quick search and replace tutorial as soon as I get home.
I am not home at the moment but will provide a quick search and replace tutorial as soon as I get home.
The latest version of MentionMe introduces its own parser which does not use standard MyBB functions. Therefore you will need to edit it and add the data-uid attribute yourself to let Hovercards detect links.Thanks! I thought it would be that as I read that that was the case with DVZ mentions, I tried to look but couldn't quite find what to replace. Looking forward to the tutorial! Thanks. :)
I am not home at the moment but will provide a quick search and replace tutorial as soon as I get home.
Well shame on me, I am using DVZ Mentions and not MentionMe. Anyway, find line 140 in inc/plugins/MentionMe/forum.php:
Replace with:{$mybb->settings['mention_display_symbol']}<a id="mention_{$user['uid']}" href="{$url}" class="mentionme_mention" title="{$title}"{$target}>{$username}</a>
{$mybb->settings['mention_display_symbol']}<a id="mention_{$user['uid']}" data-uid="{$user['uid']}" href="{$url}" class="mentionme_mention" title="{$title}"{$target}>{$username}</a>