Ask Dave Taylor
  • Facebook
  • Instagram
  • Linkedin
  • Pinterest
  • Twitter
  • YouTube
  • Home
  • Videos
  • Most Popular
  • Top Categories
  • Books
  • About Dave
  • Ask Me
  • > Donate <
  • Home
  • HTML & Web Page Design
  • Can I embed an Etsy search box on my Web site?

Can I embed an Etsy search box on my Web site?

November 20, 2013 / Dave Taylor / HTML & Web Page Design / No Comments

I love Etsy, and so do my visitors. Instead of just pointing to the site, however, I’d like to embed a search box so people could do an Etsy search directly. How do I do that?

Of course you can embed a search box on your site!

In fact, I don’t understand why sites like Etsy don’t make it easier for people to do this sort of thing: after all, the searches are of Etsy vendors and the more ways potential customers can search Etsy, the more products will be sold. Right?

While we can crack open the source to a page from Etsy, that’s going to be complicated, so instead let’s reverse engineer the search on the site itself. I think it’s a lot easier this way and the URL itself will tell us everything we need to know.

Let me show you what I mean…

If I go to Etsy.com and search for “doctor who scarf”, say, the results show up with this as the URL on the search results page:

http://www.etsy.com/search?q=doctor%20who%20scarf&view_type=gallery&ship_to=US

Unwrapping everything after the “?”, we see this:

q=doctor%20who%20scarf
view_type=gallery
ship_to=US

My guess is that most of these will default to rational values, so let’s just try an experiment with this URL:

http://www.etsy.com/search?q=doctor%20who%20scarf

(the “%20” is how a space is encoded in a URL, by the way).

Click on it above to see what happens.

Works just fine. So once we know this, it’s really easy to turn this into a search box. We need two items: the program on the server that receives the query, and the name of the variable that’s going to identify the search pattern. The former is “http://www.etsy.com/search” and the latter “q”.

This turns into HTML like this:

<form action="http://www.etsy.com/search" method="get">
<input type="text" name="q" />
<input type="submit" />
</form>

Before I embed it, a slight tweak: add a “target” attribute to the “form” tag and you can have the results open in a new page, ideal for something you add to your own page. It’s target=”_blank” to get a new window.

Which, if I embed it on this very page, ends up looking like this:


Go ahead, try it!

Great, so we have a form that works. it’s just not very attractive, so let’s clean things up and make it look a bit more cool. How’s this:

What do you seek?

Nice? Here’s the HTML you’ll need, just copy and paste it onto your own page in “raw”, “text” or “source” mode:

<form style=”border: 2px solid #666; border-radius: 4px; padding: 10px;” action=”http://www.etsy.com/search” method=”get” target=”_blank”>
What do you seek? <input type=”text” name=”q” />
<input style=”font-size: 80%;” type=”submit” value=”Search Etsy” />
</form>

Hope that helps you out. Now about that Doctor Who scarf…

Let’s Stay In Touch!

Never miss a single article, review or tutorial here on AskDaveTaylor, sign up for my fun weekly newsletter!
Name: 
Your email address:*
Please enter all required fields
Correct invalid entries
No spam, ever. Promise. Powered by FeedBlitz
Please choose a color:
Starbucks coffee cup I do have a lot to say, and questions of my own for that matter, but first I'd like to say thank you, Dave, for all your helpful information by buying you a cup of coffee!
etsy, etsy search, html coding, html search, reverse engineering, search box

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Search

Recent Posts

  • Speed up your PC by Reinstalling Windows 10 with the Win10 “Fresh Start” Tool
  • Can I Copy and Backup My Facebook Posts to Google Drive?
  • How to Get Screen Captures in ChromeOS on a Chromebook?
  • Is There a Way to Scan And Paste OCR’d Text within Android?
  • How Can I Remove All Colors From A Graphic Logo?

On Our YouTube Channel

New Watches Purchased on Alibaba.com: The Unboxing!

One by Wacom -- Student Drawing Tablet -- DEMO & REVIEW

Categories

  • AdSense, AdWords, and PPC Help (106)
  • Amazon Echo & Kindle Help (79)
  • Amazon, eBay, and Online Shopping Help, (158)
  • Android Help (162)
  • Apple Watch Help (49)
  • Articles, Tutorials, and Reviews (329)
  • Business Advice (193)
  • Computer & Internet Basics (728)
  • d) None of the Above (160)
  • Facebook Help (367)
  • Google, Chrome & Gmail Help (159)
  • HTML & Web Page Design (243)
  • Instagram Help (44)
  • iPad Help (137)
  • iPhone & iOS Help (573)
  • iPod & MP3 Player Help (173)
  • LinkedIn Help (79)
  • Linux Help (150)
  • Linux Shell Script Programming (86)
  • Mac & MacOS Help (838)
  • Most Popular (14)
  • Outlook & Office 365 Help (14)
  • PayPal Help (68)
  • Pinterest Help (53)
  • Reddit Help (13)
  • SEO & Marketing (80)
  • Spam, Scams & Security (85)
  • Trade Show News & Updates (23)
  • Twitter Help (212)
  • Video Game Tips (66)
  • Web Site Traffic Tips (62)
  • Windows 10 Help (837)
  • Wordpress Help (202)
  • Writing and Publishing (72)
  • YouTube Help (43)
  • YouTube Video Reviews (159)
  • Zoom, Skype & Video Chat Help (45)

Archives

Social Connections:

Ask Dave Taylor


Follow Me on Pinterest
Follow me on Twitter
Follow me on LinkedIn
Follow me on Instagram


AskDaveTaylor on Facebook



microsoft insider mvp


This web site is for the purpose of disseminating information for educational purposes, free of charge, for the benefit of all visitors. We take great care to provide quality information. However, we do not guarantee, and accept no legal liability whatsoever arising from or connected to, the accuracy, reliability, currency or completeness of any material contained on this site or on any linked site. Further, please note that by submitting a question or comment you're agreeing to our terms of service, which are: you relinquish any subsequent rights of ownership to your material by submitting it on this site. Our lawyer says "Thanks for your cooperation."
© 2020 by Dave Taylor. "Ask Dave Taylor®" is a registered trademark of Intuitive Systems, LLC.
Privacy Policy - Terms and Conditions - Accessibility Policy