Endangered-Language-Alliance / ela-website

Endangered Language Alliance website
1 stars 0 forks source link

Sitewide search #47

Closed abettermap closed 2 years ago

abettermap commented 2 years ago

Search bar or some other input to search for a phrase found in content anywhere in the site.

abettermap commented 2 years ago

@rperlin-ela I think this is very doable. I learned the graphql query for it and below are example results for Ngaju (no language instances, 1 project, 1 post, and 1 page).

So, what should be presented for each result? I'm thinking:

Title page or lang or project or post

custom excerpt if available, otherwise regular excerpt (see screenshot: project and posts have regular, and pages has custom). If neither excerpt type is available (or maybe that's impossible) then empty barren space? Might not be a thing. And then of course a "View" button to visit each result.

So, based on that...

  1. does that sound legit?
  2. What should the result limit be? I think for "normal" searches, e.g. "himalayan" or something, it doesn't matter. But if someone searches for the or and, then that's a crap-ton of results. Ya never know, people do weird 💩 ! So, maybe limit it to 5-10 results per page type (10 max for langs, 10 max for projects, etc.)
  3. what are we searching? it should be pages, posts, projects, and langs, right? that's the whole site i think.
  4. no autocomplete, no frills, bells, whistles. Just a search box, you click "Go" or similar, then it opens a results page just like the Googles. Cool?
  5. Should the results all be in a single list and then indicate somehow for each one what the result actually is? e.g. post vs. page or language.
  6. ...OR (and this seems easier to read and far easier to code), simply group them by their thing:

Languages

No results

Projects

Posts

...etc.

If grouped like that, to make it easier to see most of the results without scrolling, probably best to limit it to 5 results per page type. If first type (e.g. Languages) has a ton of results, mobile users might not know of other types (e.g. Projects) w/o a lot of scrolling.

Last thing- what order should the grouped results be in? I'm guessing:

  1. langs
  2. projects
  3. pages
  4. posts

image

abettermap commented 2 years ago

Actually, do we need any excerpt at all? Reasons to avoid:

  1. if it's the WP regular excerpt, i have to do HTML surgery to deal with its "Continue reading" link.
  2. it doesn't always contain the search text (and no I don't think we should use the content of the page because more surgery that's also a lot of unneeded content to return just for search results (like up to 40 full pages if a generic search was entered). even if i did use the content, and somehow extracted the part of the page that included the search term, it might show up in weird contexts that are hard to code for due to inconsistencies, e.g. baked into some html vs. a page title vs. just regular ol' text
abettermap commented 2 years ago

@rperlin-ela got this wired up (well via the URL bar so far, not an input box yet), working like a champ. Just wondering how to present this layout:

image

here's where it got ugly with Posts, as expected, so maybe if i just strip out the "Continue reading" HTML, aka everything after the dots, we'll be all set?

image

rperlin-ela commented 2 years ago

This looks super and works great. So the input will change (and input font size increase a bit)? Still planning on stripping out the "Continue reading..."? A little wordy, but it's not the worst thing, just should go to the same right link as the linked headline right above

abettermap commented 2 years ago

So the input will change

Elaborate please, not sure what you mean.

(and input font size increase a bit)?

Wow yeah not great on mobile, I'll fix it and look at desktop when I'm on a desktop.

Still planning on stripping out the "Continue reading..."?

For sure. It's just weird because the custom excerpt is a nice clean bit of text, whereas the Continue is HTML. But yeah Near-future J will tackle it.

rperlin-ela commented 2 years ago

Great, just meant font size, that's all

abettermap commented 2 years ago

k fixed the font size and the page transition, just wondering should there be a button or should user just know they need to hit Enter? I tried a few different options but couldn't find anything i liked.

image

image

other examples (use your imagination):

image

image

image

image

i don't feel like google's left-side button is very intuitive. it just seems like an icon to represent search-ness, not a button (i didn't even know it was a btn until i tried it).

the least crappy IMO

i'll roll w/this unless i hear otherwise:

image

abettermap commented 2 years ago

as for stripping out the "continue reading", note that:

  1. it will remove all HTML, not just links. I'm not even sure it's possible to put other html in the excerpt, but just fyi.
  2. it assumes the remaining text begins with "Continue reading"

and we end up with this:

image

abettermap commented 2 years ago

going to merge this and #45 once i push, so if any minor tweaks after it's up-n-runnin, i'd say chuck em in a new issue and i'll tackle it separately.