Google site search - javascript

I need to implement google site search I am using the below code
<script>
(function() {
var cx = '012847953619635190580:vrz-2wloub8';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchbox></gcse:searchbox>
Problem is shows a warning saying "unknown tag".
Pls help me out

I've never had that issue before, but I use Google Site Search and can make some educated guesses.
Place that script tag at the end of the 'head' section of the enclosing file. It should be there ideally.
This is your best friend: https://developers.google.com/custom-search/docs/element
That page shows many different ways to implement Google Custom Search, and even gives you examples that you can toy with.
And on a side note, do you have a corresponding section somewhere?
To quote that page: "two-column and A two-column layout with search results on one side and a search box on the other. If you plan to insert multiple elements in two-column mode in your webpage, you can use the gname attribute to pair a search box with a block of search results."
Basically, if you are using a 'searchbox' section, you will also need a 'searchresults' section.

Related

Opening web page as I see it in browser with Python

Using the google CSE utilities I've made a HTML file that is a barebones version of Google Search (about 1/10th page size), which is as follows:
<script>
(function() {
var cx = '011947631902407852034:gq02yx0e1mq';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchresults-only></gcse:searchresults-only>
I can open this in my browser like C:\Users\Me\Documents\MyWebpage.html?q=MyQuery and it shows something like this:
This is obviously not what's in the HTML file, so I assume it's generated via JavaScript. Indeed, when I look at the page in my browser there's a lot more HTML than is in the actual file. The 1/10th size comment refers to the size of all of this, if I download it using Inspect Element, selecting the topmost node, Edit HTML, and copying all the HTML and placing it in a file.
My question is: how can I read in all of this HTML for a given query with Python?

google custom search engine execute does not show the results

learning web application. I had usually been in firmware and desktop application software development. I have done a few web pages before, but not as intensive to say a competent front end. Back end I might have more confidence.
Anyway I followed the basic in the development like include the script:
<script>
(function() {
var cx = 'XXXXXXXXXXXXXXXXX:XXXXXXXXX';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<div class="gcse-searchbox" data-gname="hobbyinfo"></div>
<div class="gcse-searchresults-only" data-gname="hobbyinfo"></div>
then a button which onclick will call a javascript function that will execute a search.
function doSearch() {
google.search.cse.element.getElement('hobbyinfo').execute('archery');
}
When I test the web application and just put archery on the search box and click search there is a search result showing but when I use the doSearch() nothing is showing. I am just learning google cse, facebook api, and mojolicious. But I think I am implementing the onclick correctly since I am using the simple view page where I can see the html text.
I am not sure if its correct to use "google.search.cse.element.getElement('hobbyinfo').execute('archery')" since I use HTML5 "div class="gcse-searchbox" ..." . Like I said I am not really an experienced Front End developer. Is it still correct to use google.search.cse ... if I use the 'div class="gcse-...' to create the searchbox and searchresults?
I am don't think that its because I am still just working on a virtualbox and have no real web hosting area yet, that the results are showing. Can someone tell me if this is the case?
Although when I manually do a search on the searchbox it does show the search result.

Calling Google Custom Search overlay from text link

I'm using the newish style of Google Custom Search that overlays your search results over your current page.
The code below creates a search box that calls the overlay. I'm wondering if there's anyway to create a text link that would also launch the results of the overlay as some of our articles have a line like "You can always search for more references on [person] on our site." The older two page CSE ethod allowed us to call a results page with /search.shtml?q=person
<script>
(function() {
var cx = 'myCSEidnumber';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>
I created a text link like this: /currentpage?cx=myCSEidnumber&q=$mysearchterms
Clicking on that link doesn't create the results overlay. If I copy that link and re-enter it in the browser it does pop up the overlay.
I've searched the Google CSE site and forums but can't seem to find anything. Thanks for any insight.
You don't need the cx param in your url, only the q param. However, you do need the element present in your link target page for the overlay to show up. The element will render both overlay AND search box, but you can hide the searchbox with css, e.g.:
.gsc-search-box {
display:none;
}
Here's an example (although jsfiddle will not render css for you, you need to add it on your page separately):
http://jsfiddle.net/RDHS4/3/
Your HREF should be set using this /?q=$mysearchterms
Example: To display result on the index page or any other page:
href="http://www.your-web-site.com/?q=$mysearchterms"
href="http://www.your-web-site.com/search/?q=$mysearchterms"
href="http://www.your-web-site.com/result.php?q=$mysearchterms"
Then you can go ahead to hide the input field using css.
.gsc-search-box { display:none; }

reduce page weight of google plus button

I am currently developing a website and am wanting to include the google plus button. My problem however is that the google plus button adds an extra 300kb to the page weight. A lot of this comes from one single file that the http://apis.google.com/js/plusone.js file calls.
I've managed to keep the page load time down to a minimum by loading it asynchronously but I would like to know if there's any way to adapt the code to minimise the page weight?
Here is the code I am using...
<script>
window.___gcfg = {lang: 'en-GB'};
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
<div id="google-plusone">
<g:plusone annotation="none" size="medium"></g:plusone>
</div>
You shouldn't really worry about it as it doesn't affect your code startup time. Most users will most likely just have it in cache already and load it from there. Trying to provide your own somehow "minimized" copy is actually counter-productive, because it won't profit from being cached from visiting other sites.

provide integration for ajax/javascript modal view on ruby on rails

I am trying to generate javascript code that can be provided to website owners for them to integrate into their HTML. This code would display a button somewhere on their page which opens up a feedback form in a modal view type overlap on their website.
I realize there are a few plugins for ruby online that go with jQuery to create the modal view on a website but how would I create an integration script like shown below
<script type="text/javascript">
var uvOptions = {};
(function() {
var uv = document.createElement('script');
uv.type = 'text/javascript';
uv.async = true;
uv.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'widget.uservoice.com/KwRuyHwCUkk17M8jW64HDA.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(uv, s);
})();
</script>
I am specifically looking for a gem or a plugin for rails 3 that would make the job easier. If none are available, how hard is it to implement this in rails?
Appreciate any help

Categories

Resources