May 15, 2014

Weebly Tricks #49 - Custom Search Engine for Weebly Free Users

Posted by Domz at 5/15/2014

Custom Search Engine for Weebly

Never miss to include a search widget to your site. This small widget will greatly help lessen your navigation problems. Assuming you have a free account in Weebly, there's no way you can include their search widget unless you upgrade to PRO. But there is still a solution for that, you can try Google Custom Search Engine or CSE. It is free service provided by Google. If you already have one, just continue reading because I added some tips you might need like preventing search results from opening in new tab when clicked.







1. Before anything else, you must have a Google Account and a Webmaster Tool Account (WT). Make sure you already registered your site to Webmaster because you need to submit the sitemap of your website as early as possible for fast indexing.

If you haven’t registered yet just go to www.google.com/webmasters/tools, and sign with your Google account. Inside WT, click on the Add Site and follow the steps for verification. After being verified, click on the "sitemap" on the left panel and click Add Sitemap on the right side. You must enter like this:

http://myweeblytricksdemo.weebly.com/sitemap.xml

Where in the red marked text will be placed on the box provided. You’re done for step 1.

2. Now time to create your CSE, just go https://www.google.com/cse. Sign In.

3. On the left panel, click “New search engine”. Simply fill up the form and press “create”. A confirmation message will appear, now click the “modify” on the bottom right.

4. On “Basics” Tab, you can include images on search results or you may want to upgrade to Pro for Ad Free CSE. Other than that please click on the “Look and Feel” tab on the right panel.

5. On the “Look and Feel” Tab, you will be given choices of what CSE type you want, just choose compact and save. Compact is usually used on  side bar as the search results will also appear below it. You may change it later. Click on the next tab which is “Theme”, here just choose your preferred color combinations and press save after. Now on the “Customize” tab, you can change the border colors and backgrounds of your CSE,  press “Save and Get Code”.

6. You will be given a code which is something like this:

<script>
  (function() {
    var cx = '003074870824758447082:2efnarx24wu';
    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>

You need to copy your own code and insert to your Weebly site by going to Weebly > preferred page, drag an “embed code” element and paste it.

7. Your custom search engine is now ready. We just need to tweak it.

Things not to forget:

1. You can enable image results by activating the “Image Search” on Set Up > Basics > Image Search.

2. You can Monetize your CSE by integrating your AdSense on Set Up > Monetization.

3. You can instantly index and include your pages in search results by going to Set Up > Indexing > Urls in a Sitemap > paste your sitemap address which you can get from your Webmaster tool on step 1. After that click “Index Now”.

4. You can prevent your search results from opening in a new tab/window by modifying your CSE code.
Please refer to the code on step 6, instead of:

<gcse:search></gcse:search>

on the last line, change to:

<gcse:search linktarget="_parent"></gcse:search>

You've just added the red marked text to prevent it from opening in a new tab.
That’s it, you finished my tutorial. Goodluck and always update your site!

Get email updates and more access! (Free)
Email *
email marketing by activecampaign


If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you subscribe to my regular Email Updates. Subscribe Now!

...

0 comments:

Have any question? Feel Free To Post Below:

 

© 2014. All Rights Reserved | My Weebly Tricks | Template by Blogger Widgets

Home | | Privacy Policy | Top