Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Course Theme: Add gravatar hovercard in comments #7333

Open
wants to merge 7 commits into
base: trunk
Choose a base branch
from

Conversation

Imran92
Copy link
Contributor

@Imran92 Imran92 commented Aug 28, 2023

Changes proposed in this Pull Request:

  • Added gravatar hovercard to comment query block

Gravatar hovercard library documentation

https://github.com/gravatar/hovercards/blob/0.5.8/README.md

Testing instructions:

  • Enable this branch of course theme
  • Enable comments on a page/post
  • Go to the page/post from frontend
  • Comment as a user who's email has a gravatar account
  • Hover on the gravatar image you see in the comment
  • Make sure you see the hovercard
Screen.Recording.2023-08-28.at.5.46.58.PM.mov

Related issue(s):

#7306

@Imran92 Imran92 added this to the Course 1.3.3 milestone Aug 28, 2023
@Imran92 Imran92 requested a review from a team August 28, 2023 11:52
@Imran92 Imran92 self-assigned this Aug 28, 2023
@donnapep donnapep linked an issue Aug 28, 2023 that may be closed by this pull request
@donnapep donnapep modified the milestones: Course 1.3.3, Course 1.3.4 Sep 12, 2023
@donnapep donnapep modified the milestones: Course 1.3.4, Course 1.3.5 Oct 14, 2023
@@ -0,0 +1,9 @@
document.addEventListener('DOMContentLoaded', () => {
Copy link
Contributor

@donnapep donnapep Oct 19, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we follow the same whitespace rules in this JS file as we do for Sensei?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yapp, good point. I've updated it here 07d099e

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, looks like the spaces get removed by this pre-commit hooks #3596

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, looks like the spaces get removed by this pre-commit hooks #3596

@donnapep
Copy link
Contributor

donnapep commented Oct 19, 2023

This doesn't look so great on mobile. I wonder if we could use wp_is_mobile to not load the Gravatar files in that case? Not sure how reliable that function is, but if it shows on tablets and not phones, that's actually better.

Screenshot 2023-10-19 at 11 37 01 AM

@donnapep
Copy link
Contributor

Is there any P2 or similar that documents how to integrate hovercards that we could link to in the description?

*
* @return string The <script> tag for the enqueued script with defer attribute.
*/
function defer_parsing_of_js( $tag, $handle ) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What do you think about bumping the minimum supported WP version to 6.3 and specifying a loading strategy instead?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've used loading strategy and updated the version number here 4ee873d. Very nice idea Donna! Thank you!!

@donnapep donnapep modified the milestones: Course 1.3.5, Course 1.3.6 Oct 31, 2023
@donnapep
Copy link
Contributor

@Imran92 Can you provide an update here?

@Imran92
Copy link
Contributor Author

Imran92 commented Jan 29, 2024

Thanks for the ping Donna. Some theme PRs got left out when we moved to other project. I'll update this PR as per the suggestions above. Adding it to my to-do

@Imran92
Copy link
Contributor Author

Imran92 commented Feb 7, 2024

This doesn't look so great on mobile. I wonder if we could use wp_is_mobile to not load the Gravatar files in that case? Not sure how reliable that function is, but if it shows on tablets and not phones, that's actually better.

Screenshot 2023-10-19 at 11 37 01 AM

Yap you are absolutely right. Looks like gravatar-hovercard library fixed it themselves on 0.5.8 release to not load the hovercard on mobile! So I've just pointed to the updated version here c3f3eba. On my testing, it looks like it doesn't detect resizing, so we have to reload the page to understand that it's working. Thanks!!

@Imran92
Copy link
Contributor Author

Imran92 commented Feb 7, 2024

Is there any P2 or similar that documents how to integrate hovercards that we could link to in the description?

I found their readme very helpful and contained all the required information. I'm adding it to the PR description.

@donnapep donnapep modified the milestones: Course 1.3.6, Course 1.3.7 Mar 20, 2024
@donnapep donnapep removed this from the Course 1.3.7 milestone Apr 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Integrate Gravatar Hovercards with comments
2 participants