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.

Sign up for GitHub

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

Jump to bottom

Add Pagefind search #37

Merged
merged 29 commits into from
Jan 23, 2024
Merged

Add Pagefind search #37

merged 29 commits into from
Jan 23, 2024

Conversation

cjyabraham
Copy link
Contributor

@cjyabraham cjyabraham commented Dec 26, 2023 •
edited
Loading

This addresses #35 by integrating Pagefind search.

Preview: https://deploy-preview-37--dot-org-hugo-theme-demo-jh.netlify.app/

It adds the search icon to the topnav on both mobile and desktop. It also demonstrates language-specific search results in both English and Spanish.

You can set up your own local instance of this following these instructions.

@netlify Netlify
Copy link

netlify bot commented Dec 26, 2023 •
edited
Loading

✅ Deploy Preview for dot-org-hugo-theme-demo-thetwopct ready!

Name Link
🔨 Latest commit f3cfc11
🔍 Latest deploy log https://app.netlify.com/sites/dot-org-hugo-theme-demo-thetwopct/deploys/65aea1df346129000830dcdf
😎 Deploy Preview https://deploy-preview-37--dot-org-hugo-theme-demo-thetwopct.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@netlify Netlify
Copy link

netlify bot commented Dec 26, 2023 •
edited
Loading

✅ Deploy Preview for dot-org-hugo-theme-demo ready!

Name Link
🔨 Latest commit f3cfc11
🔍 Latest deploy log https://app.netlify.com/sites/dot-org-hugo-theme-demo/deploys/65aea1dfc25e7e00083350e7
😎 Deploy Preview https://deploy-preview-37--dot-org-hugo-theme-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@cjyabraham cjyabraham requested a review from thetwopct December 26, 2023 21:29
@cjyabraham cjyabraham marked this pull request as ready for review December 26, 2023 21:29
@cjyabraham cjyabraham mentioned this pull request Dec 26, 2023
Closed
@thetwopct
Copy link
Collaborator

@cjyabraham Do you think adding the search to the site/header should be a theme option?

@thetwopct
Copy link
Collaborator

thetwopct commented Jan 22, 2024 •
edited
Loading

@cjyabraham A few things popped up when running locally

  1. Was it intentional to leave out this data-pagefind-body attribute as currently the header and footer are searched, which could give some poor results.
[Parsing files]
Did not find a data-pagefind-body element on the site.
↳ Indexing all <body> elements on the site.
  1. There is no /es/demo-page, so maybe Hugo is using the en language content? If Hugo does that, I wonder if we need to add some smarts to the head of the page to detect it (I'm still not 100% sure how the languages/fallover/works)
[Reading languages]
* "/es/demo-page/" has no html lang attribute
  1. I find the Search icon a little bold and jarring. There is a thinner one in the TODO branding icons section which matches the font a little closer. I will swap that in and add a hover color change.

Screenshot-2024-01-22 --15 20 33

  1. Locally, I cannot get the search bar to appear on the page, the paths are not valid

Screenshot-2024-01-22 --15 28 10

I've played about with this and cannot get it to load. I also cannot reach the public/pagefind/ file directly (404 error) even though the files exist.

@cjyabraham
Copy link
Contributor Author

  1. I did add data-pagefind-body here. You may need to build your site first before you run pagefind?

@cjyabraham
Copy link
Contributor Author

@cjyabraham Do you think adding the search to the site/header should be a theme option?

Yes, good idea.

cjyabraham and others added 21 commits January 22, 2024 23:58
@cjyabraham @thetwopct
Added pagefind to topnav
9e9392f 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Created pagefind shortcode with styling
db543ed 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Added search pages in both languages
0ff3f25 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Added pagefind index build command to netlify
54c924d 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
add instructions to the readme
6d5251e 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
improve instructions
3793bbb 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
tweak
cb97c77 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Only index pages; skip listings of other pages like /blog/
66cb5fb 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Updating Search
5446a2f 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
pushed the breadcrumb and byline font size up to match the body text
31ae741 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Tweaked heading sizing and spacing
7edb104 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Provide a way to noindex a page (#2)
01f334f 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
don't follow or index when not on production
43099e4 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
check if env is production
ce3311b 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
try setting the baseurl
7cde301 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
revert a few commits
30b0ac8 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Adds an intro shortcode for larger paragraph text
68da1f9 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Added bottom margin to intro para
eed73fc 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
makes cursor default for menu items with children
d35e55e 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
moved menu submenus up a bit higher
26bf958 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
only change cursor hover on desktop widths
e90e113 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
cjyabraham and others added 5 commits January 22, 2024 23:58
@cjyabraham @thetwopct
Uses correct filename convention for scss files (fixes #33)
058b922 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Updating cursor to be applied if device supports hover
c702918 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Revert "Updating cursor to be applied if device supports hover"
59da2be 
This reverts commit c3935a7.

Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@cjyabraham @thetwopct
Provides option to keep the header sticky (#4)
7cf4251 
Signed-off-by: Chris Abraham <cjyabraham@gmail.com>
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Making search optional in header
3b74002 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Merge branch 'main' into search
5426d45 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Turn search on
748855a 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Fixing desktop search button
f3cfc11 
Signed-off-by: James Hunt <10615884+thetwopct@users.noreply.github.com>
@thetwopct
Copy link
Collaborator

  • Updated search SVG to be a bit more modern looking
  • Moved the search position so flow is better and language is last
  • I made the search optional in the UI.
  • Formatted the search in the mobile menu
  • Added new npm run script commands for dev and dev build and dev with search (got it working locally eventually)
  • Updated the readme
  • Local works, deploy works ✅

@cjyabraham cjyabraham merged commit 47e7ade into main Jan 23, 2024
9 checks passed
@cjyabraham cjyabraham deleted the search branch January 23, 2024 06:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@thetwopct thetwopct thetwopct approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@cjyabraham @thetwopct