Getting Random Post Suggestions from Custom Google Search Engines

Published: 2015-03-30 09:16 |

Category: Creative |

Update 3/31 – After more tinkering, I’ve changed the code to be more stable with any changes Google makes in the future. Code snippets are up to date and irrelevant instructions are now [STRIKEOUT:struck out].

You can create a custom Google search engine for your website (or group of websites) which can be very handy for a variety of reasons. If you’ve got a gigantic website, like Jerry Blumengarten, having a custom search bar can help find materials. If you’re working with students, a custom search can help limit where their information comes from. They’re easy to do, but there are some limitations, so be sure to read the Terms of Service if you’re going to set one up.

John Stevens asked on Twitter if there was a way to get a random post from a custom search. I felt like there ought to be some way to do that, so I started digging. Because the MTBoS index of blogs is on all different platforms and not networked in any particular way, it turned into more of a chore than I originally thought. Really, when you get down to it, randomizing search results is the anthesis of what search engines do, so we have to accomplish the “random” aspect of the Google search with a different method.

I’ll be using a search for my own blog for the demo here (down below). Brace yourself for some code.

[STRIKEOUT:First, rather than using the Google script you get from the Control Panel, use this HTML instead:]

You’re given one line of HTML to put in your page where you want to search bar to appear. Simply add the button line to add the random button:

google-cse-html

Random

Line 5 adds a new button – the Random button – to the search form. That button is important. Rather than needing some text in the input field, a user can click on the Random button and some JavaScript magic will happen.

If you want to use this, you’ll need to do a couple things:

[STRIKEOUT:Make sure your site has jQuery installed. If you’re not sure, go to your site’s code and paste this in before the closing header tag:]

You’ll need to put a script in the footer of your site. You can also do this with a widget with a lot of platforms…there are too many to list, and the footer solution is usually the best approach. If you’re not sure what to do, leave a comment, and I can try to help you out.

`
// This is the array holding the serach terms
var queries = [‘animals’,’dogs’,’cats’, ‘emu’,’fish’,’snakes’, ‘panda bears’,’meerkats’,’spiders’,’birds’];

// When you click on the Random button, it'll grab a random search term and run it through Google
document.querySelector('button').addEventListener('click', function() {
var search = google.search.cse.element.getElement('standard0');
var rand = Math.floor(Math.random() * queries.length);
search.execute( queries[rand] ); }, false);
`

This script will take that Random button we added earlier and pop a random term into the search box and carry out the search. yOu need to set the terms in the array (line 3), each term in single quotes and each term separated by a comma. Make sure to keep that syntax correct or else it won’t work.

[STRIKEOUT:Also, if you try this on any site other than your own, you can run into issues. I’ve been testing this on Codepen.io with mixed results. Once thrown into my own page, though, it works just fine.] I’d create a new page on your site and drop the code into place. Test it as a draft page to make sure everything is kosher and then run with it.

If you want to see a sample implementation (proof of concept, not really helpful), check out this spartan search page. You can type in a search term and hit submit to see how it works. Then, try hitting Random without putting any text in to see what it does.

Do note that WordPress has a pretty good random post feature built-in. This is meant more for wider searches across multiple platforms using the Google index of sites.