joelmalach Posted August 10, 2017 Share Posted August 10, 2017 Hi My setup is that I have a main site with just an index.html page and the shop in a subfolder, like this www.mainsite.com/shop Is there any way to add the shop's search box to my main site homepage (www.mainsite.com/index.html), so that clients can search the shop from the homepage? Thanks in advance Joel Quote Link to comment Share on other sites More sharing options...
Robando Posted August 10, 2017 Share Posted August 10, 2017 You could add a google search engine quite easily https://cse.google.com/cse/ 1 Quote Link to comment Share on other sites More sharing options...
bsmither Posted August 10, 2017 Share Posted August 10, 2017 Please code the search box to send the search terms in the GET request: www.mydomain.com/shop/index.php?_a=category&search[keywords]=XYZ Quote Link to comment Share on other sites More sharing options...
joelmalach Posted August 16, 2017 Author Share Posted August 16, 2017 Thanks. I added a google search as per Robando's suggestion and this works fine. Sorry - I couldn't understand bsmither's suggestion - I don't know how to code a search box Thanks anyway Quote Link to comment Share on other sites More sharing options...
joelmalach Posted October 3, 2017 Author Share Posted October 3, 2017 (edited) Hi. The Google search wasn't satisfactory, so I tried again and managed to get a search box on the main page of my website. Here's how I did it Go to a page in your shop, and right click, view source Copy everything and paste into an empty html file Remove everything except the div with the search box and some necessary CSS and JS links I was left with this <!DOCTYPE html> <html class="no-js" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-GB"> <head> <title>Search results - </title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="http://www.mysite.com/shop/skins/foundation/css/normalize.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/foundation.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/cubecart.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/cubecart.common.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/cubecart.helpers.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/cubecart.default.css" rel="stylesheet"> <link href="http://www.mysite.com/shop/skins/foundation/css/jquery.chosen.min.css" rel="stylesheet"> <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" type='text/css'> <script src="http://www.mysite.com/shop/skins/foundation/js/vendor/modernizr.min.js"></script> <script src="http://www.mysite.com/shop/skins/foundation/js/vendor/jquery.js"></script> </head> <body> <svg display="none" version="1.1" xmlns="http://www.w3.org/2000/svg"> <defs> <symbol id="icon-search" viewBox="0 0 1792 1792"> <path d="M1216 832q0-185-131.5-316.5t-316.5-131.5-316.5 131.5-131.5 316.5 131.5 316.5 316.5 131.5 316.5-131.5 131.5-316.5zm512 832q0 52-38 90t-90 38q-54 0-90-38l-343-342q-179 124-399 124-143 0-273.5-55.5t-225-150-150-225-55.5-273.5 55.5-273.5 150-225 225-150 273.5-55.5 273.5 55.5 225 150 150 225 55.5 273.5q0 220-124 399l343 343q37 37 37 90z"></path> </symbol> </defs> </svg> <div class="off-canvas-wrap" data-offcanvas> <div class="inner-wrap"> <div class="row marg-top" id="top_header"> <div class="small-4 large-3 columns"> </div> <div class="small-8 large-9 columns nav-boxes"> <div class="row" id="nav-actions"> <div class="small-12 columns"> <div class="right text-center"> </div> <div class="right text-center show-for-small"><a class="left-off-canvas-toggle button white tiny" href="#"><svg class="icon icon-x2"><use xlink:href="#icon-bars"></use></svg></a> <a class="button white tiny show-small-search" href="#"><svg class="icon icon-x2"><use xlink:href="#icon-search"></use></svg></a> </div> </div> </div> <div class="row show-for-medium-up"> <div class="small-12 columns"> <div> <form target="_blank" action="http://www.mysite.com/shop/search.html" class="search_form" method="get"> <div class="row collapse"> <div class="small-10 large-11 columns"> <input name="search[keywords]" type="text" class="nomarg" placeholder="Search our store" required><small><a href="http://www.mysite.com/shop/search.html">Advanced Search</a></small> </div> <div class="small-2 large-1 columns"> <button class="button postfix nomarg nopad" type="submit" value="Search"><svg class="icon"><use xlink:href="#icon-search"></use></svg></button> </div> </div> <input type="hidden" name="_a" value="category"> <input type="hidden" name="token" value="020a24e1ef940b36da26674e98a860d0"></form> <div class="hide validate_search">Please enter a search keyword </div> </div> </div> </div> </div> </div> <div class="row hide" id="small-search"> <div class="small-12 columns"> <div> <form target="_blank" action="http://www.mysite.com/shop/search.html" class="search_form" method="get"> <div class="row collapse"> <div class="small-10 large-11 columns"> <input name="search[keywords]" type="text" class="nomarg" placeholder="Search our store" required><small><a href="http://www.mysite.com/shop/search.html">Advanced Search</a></small> </div> <div class="small-2 large-1 columns"> <button class="button postfix nomarg nopad" type="submit" value="Search"><svg class="icon"><use xlink:href="#icon-search"></use></svg></button> </div> </div> <input type="hidden" name="_a" value="category"> <input type="hidden" name="token" value="020a24e1ef940b36da26674e98a860d0"></form> <div class="hide validate_search">Please enter a search keyword </div> </div> </div> </div> <div class="row"> <div class="small-12 columns small-collapse"> <div class="hide" id="val_lang_back">Back </div> </div> </div> <div class="row"> <div class="small-12 columns small-collapse"> </div> </div> </div> </div> <script src="http://www.mysite.com/shop/skins/foundation/js/1.foundation.min.js" type="text/javascript"></script> <script src="http://www.mysite.com/shop/skins/foundation/js/2.cubecart.js" type="text/javascript"></script> </body> </html> I saved this as search.html *** Note that you must put target="_blank" in the form tags or it won't work *** Then, on the home page of my site, I added an iframe, like this <iframe src="search.html" height="50px" width="100%" scrolling="no" frameborder="0"></iframe> That's it. The search box now shows on my website's home page and opens a new tab with the search result Hope this helps someone Edited October 3, 2017 by joelmalach put my website address in code by accident. changed to mysite.com Quote Link to comment Share on other sites More sharing options...
joelmalach Posted October 6, 2017 Author Share Posted October 6, 2017 (edited) Hi I've had to do a further small amendment so that the search box displays properly on mobiles and smaller screens - please let me know if you want it [email protected] Edited October 6, 2017 by joelmalach Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.