How to Add Google Custom Search Box in Navigation Menu

We all know navigation of a website gives more impression to the readers. Most of the people want important things like search box, categories in navigation. In this tutorial I am going to explain how to add google custom search box in navigation bar.
Thesis offers the simple navigation  menu with home and about tabs. After your installation you may filled sixty or 70 percent width of the navigation bar with pages and categories. previously i have explained that how to add search box in navigation menu. Now I would like to add google custom search box in navigation menu. In this tutorial I am going to add google custom search box in right side of the navigation menu.

Add the following code in custom_function.php or launch.php file

/*google custom search box*/
//remove thesis navigation
remove_action('thesis_hook_before_header', 'thesis_nav_menu');

/*custom Nav*/
function custom_nav() {
echo '<div id="nav">';
echo '<div id="nav_container">';
thesis_nav_menu();
echo '<div class="searchs">';
?>

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'en'});
google.setOnLoadCallback(function(){
var customSearchControl = new google.search.CustomSearchControl('004112828313249196776:vifdttuqeui');
customSearchControl.setResultSetSize(google.search.Search.LARGE_RESULTSET);
customSearchControl.draw('cse');
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />

<?php
echo '</div>';
echo '</div>';
echo '</div>';
}
add_action('thesis_hook_before_header', 'custom_nav');

The above code I have first step I have removed the default nav menu in thesis theme. Then inside my custom_nav function I have called the default nav menu and also added the javascript for google custom search box. The reason for this I have added my menu tabs and searchbox  inside the common nav_container. You should replace your google custom search javascript code.

To paste the code in custom_function.php. login your wordpress admin.

  1. Choose ‘custom file editor’ under thesis options in left sidebar of the wordpress dashboard.
  2. Select custom_function.php file and click on edit selected file.
    Paste the above code and save it then visit your site.

To place the code in launch.php login your ftp.

  1. Select the path public_html/fourblogger.com/wp_content/theme/thesis_16/cusom/lib/functions/launch.php.
  2. Open the file by right clicking on the file.
  3. Paste the above code and save it the visit your site. Paste the above code any one of the file only. Your navigation now contains  menu as well as google custom search box.

In order to align the two boxes in perfect line you need to style the nav bar. For doing this Just add the below code in custom.css file. This code is used to align your search box in right end of the navigation bar.

/* navigation custom search*/

.custom .menu { background-color: #fff;
width:75.5%;
 }

.custom .menu  li a{
line-height:1.6em;
font-size:1.5em;}

.custom .searchs{
width:24.5%;
float:right;
margin-top:-3.5em;

}

This code I divided my navigation menu 75.5% for menu tabs and remaining 24.5% for google custom search. This code I increased my navigation height also.
To paste the code in custom.css file
Choose ‘custom file editor’ under thesis options in left sidebar of the wordpress dashboard. Select custom.css file and click on edit selected file.
Paste the above code and save it the visit your site with search box in navigation.

google custom search

How to show search results in separate page?

  1. If you need search results in separate page then create a new page in the name of search to show google custom search results.
  2. go to http://google.com/cse the click on create new search engine. create search engine as per the instruction.
  3. In the left sidebar of the page we have “Look and Feel” option. by using this option you can design your search box and and the layout of search result page. one you finished this step save it.
  4. click on ‘get code’ option, give search results page url.  Here we have two codes one is for the search box appearance. copy one code and paste where your search box is to appear. If you need in navigation follow the above post or you want in sidebar paste this code in text widget in the sidebar.
  5. copy the second code and paste it in the page (html editing mode) that you have created to display search results and update the page. That’s all.

Share your experience in comment section. For more checkout our all Thesis theme tutorials..

{ 90 comments… add one }

Leave a Comment

  • Jaydip Parikh December 30, 2009, 10:49 AM

    Hey Pascal,

    thx for your wonderful article. This will help many people.

    Reply
    • Pascal December 30, 2009, 11:09 AM

      Thanks Jaydip.

      Reply
  • Tony February 2, 2010, 3:03 AM

    Hello Pascal – the code is not working for me. When I try it, using FTP to add the code to launch.php, it removes my nav bar entirely. I see the add_action statement near the end, and include it. Is there a reason that it is also in a box above?

    Reply
    • Pascal February 2, 2010, 10:47 AM

      hi tony once again copy and paste that two codes, you can get google custom search box in your site navigation. Incase you got any problem contact us via g-talk.

      Reply
  • Alex February 2, 2010, 3:57 AM

    Hi mate,

    I’ve tried doing this (nothing else in custom_functions.php) and it seems to make the entire navbar menu dissapear. Any ideas as to why this happens?

    Has the naming changed in Thesis 1.6?

    Thanks,
    Alex

    Reply
    • Pascal February 2, 2010, 7:39 AM

      hi alex it will work surely. i dont know why it is happens. give your site name then only i can resolve that problems..

      Reply
  • Alex February 2, 2010, 8:12 AM

    Hi Pascal,

    The domain in question is beingpractique.com

    At the point of testing I had nothing else in the custom_functions.php file

    Reply
    • Pascal February 2, 2010, 10:43 AM

      hi alex once again copy and paste that two codes, you can get google custom search box in your site navigation. Incase you got any problem contact us

      Reply
  • Clint March 14, 2010, 8:48 AM

    Hello Pascal,

    Question,

    Can you also give a tutorial on how to get the “subscribe newsletter” box at the upper right side just like on your fourblogger.com site?

    Thanks for your time and all the other great tutorials!

    Reply
    • Pascal March 14, 2010, 9:44 AM

      Hi…That newsletter box managed by aweber. If you get “aweber”, then you can design the newsletter box through available default newsletter templates..

      Anyway i will try to create one tutorial for creating newsletter box using aweber.

      Reply
    • Pascal March 16, 2010, 12:22 AM

      Just get the code and paste in text widget at your sidebar. You no need to do through custom functions…

      Reply
  • Lakhyajyoti saikia March 23, 2010, 2:03 AM

    Finally I got my answer.Thanks for the post pascal.

    Reply
  • Richard March 26, 2010, 5:46 AM

    I pasted everything as you provided and it gave me my old nav menu but not search box.

    I am already using a different menu.

    I very much want to add search and rss feed above the header.

    Reply
    • Suresh March 26, 2010, 3:49 PM

      hai richard,
      I saw your site there is no code for google custom search.. If you need your navigation menu above header use the hook(thesis_hook_before_header)..once again do the same process you will get it.

      Reply
      • Richard March 28, 2010, 7:39 PM

        Thanks,
        I am getting closer.
        The search appears now.
        The only changes I made was the background color and adding in my search code.
        However, I get the home box and the line below it. How do I remove those?
        Also, how do I get the search and rss to line up?
        How can I add other links to face book etc?

        Reply
        • Richard March 30, 2010, 5:05 PM

          I got the email but the changes did not work.

          I have changed it back and will try again later.

          The search and email remained in the same spot.

          The footer and the alert box changed the background color to black.

          Any thoughts?

          I will try later.

          Reply
          • Suresh March 30, 2010, 6:26 PM

            hai,
            Now i checked, first place the code in css file and do changes in custom function.php file ..
            it will work.. otherwise place the code and contact us…then only i can find the problem.. if you are removed the code i cant
            identify your issue..

            Reply
      • Suresh March 29, 2010, 12:11 PM

        hai Richard,

        First To remove the line left remove the below code in custom_functions.php file
        ul class="menu" /ul>

        To align search and rss in same line
        First remove the .custom .searchs{…} code in custom.css file.
        add the below code in custom.css file
        .custom .searchs .rss {float:right; margin-top:-2em;}

        also add the below part in custom_functions.php file

        In this file in rss update part you have the code class="rss" replace this with div class="rss" and closing part of this rss update part is like this /class="rss'> replace this code with /div> now you get the search box and rss update in line..

        Reply
        • Suresh March 29, 2010, 11:18 PM

          hai,
          send me the code (custom_functions.php and custom.css ) via contact form attach files..

          Reply
          • Suresh March 30, 2010, 10:14 AM

            hai,

            Ya.. i got your code and corrected it.. I send it via email ..

            Reply
            • Richard March 30, 2010, 5:06 PM

              The changes did not work.

              The search and email stayed on the left.

              The background for the footer and alert box changed to black.

              Any ideas?

              Reply
              • Suresh March 30, 2010, 6:31 PM

                hai,
                do you want to change your footer background into black?.. if yes.
                add the below code in custom.css file.

                .custom #footer{background:#111111;}

                Reply
              • Suresh April 1, 2010, 9:34 PM

                hai richard,
                In your custom.css file
                add the below code if not fixed modify the value 50em..
                .custom .searchs{margin-left:50em;}
                your site not loading thats why i give you approx value..

                Reply
              • Pascal April 1, 2010, 9:55 PM

                Hi Richard your sites show oops error. so i cant see your site.

                Reply
                • Pascal April 1, 2010, 10:00 PM

                  hi richard using margin-left is 57em.

                  Reply
              • Suresh April 1, 2010, 10:41 PM

                hai richard,
                In custom.css file change
                .custom .searchs{margin-left:57em;}

                .custom .searchs .email{float:left; margin:-2.3em 1em 0 20em;}
                now all will fixed as you like..

                Reply
              • Richard April 2, 2010, 7:19 AM

                Although it works in IE, in FF and Safari the email sits on top of the RSS link.

                Any thoughts on how to fix this?

                Reply
                • Suresh April 2, 2010, 9:30 AM

                  hai,

                  check my previous comment i gave you float:left in .custom .searchs .email {} but your site shows float:right; check this…

                  Reply
              • Suresh April 3, 2010, 10:32 AM

                hai richard,
                I checked your site in ff it is working fine…check it again

                Reply
              • Pascal April 6, 2010, 6:17 PM

                I couldn’t figure out what may be the issue…

                Reply
                • aviaitonMY April 11, 2010, 2:52 PM

                  Hi, Pascal.

                  if you take a look at Shoutmeloud.com when i try to put any key words in his search box..it came up with a nice Google SERP and all the Search result only pointing to his blog with his blog URL .

                  how to do that kind of cool stuff??

                  and its a single column SERP like the browser in his blog…hope you know it. i think its very2 cool than a normal result page!

                  Reply
                • aviaitonMY April 11, 2010, 3:12 PM

                  hey, what pleasure..YOU HAVE THAT TOO..

                  so to be easy..when i put fourblogger at your search-box at the far top in your sidebar..

                  it shows like a mini Google SERP in your blog…its cool and you also changed the font to pink..

                  hope you could guide me how to make my search result exactly like yours!

                  cheers! :-p

                  Reply
                  • Suresh April 12, 2010, 9:36 AM

                    hai aviationMY,

                    do you want search box exactly like fourblogger?

                    go to http://www.google.com/cse then click on create custom search engine with the procedure given by that page.
                    There in the left sidebar we have options to change the look and feel of the search result page..
                    the click get code options here we have to java script code, one is for google search box paste this code where the search box to be appear.
                    another one is where the search results to be appear.
                    if You need search results in separate page give crate new page and give the page url here.
                    now copy the code and paste inside the page and update it..
                    If you need search box in navigation menu follow the instruction in the post. Or if you need it in side bar paste the code in sidebar text widget.

                    Reply
  • Smart Blogs March 27, 2010, 10:12 AM

    Hi Pascal

    Can you customizing search result page on thesis theme, please give me your tutorial
    I think that is much more better if we can adding an archive, search box, tags, recent and popular posts, etc. in the search results page.

    For example: if I search on “handphone” in this blog the search results page will look like this

    “Sorry, but no results were found

    Do not give up-try another search! ”

    url: http://fourblogger.com/?s=handphone

    I Hope you can help me.
    Thank’s before

    Reply
    • Pascal March 27, 2010, 11:09 AM

      Hi Smart Blogs, It will take more time and coding, I think… Thats why Chris Pearson still doesn’t do it. Anyway, I am also thinking of Search structure in Thesis search. If i do it, I will inform you.

      Reply
      • Smart Blogs March 27, 2010, 11:52 AM

        Hi Pascal

        Thank’s for your answer
        Actually I have been able to make changes to search result page on my blog, (You can try search result page on my blog)
        but I do it not in my direct custom_function.php change in the thesis / lib / functions / document and thesis / lib / functions / loops (but this is not recommended)

        I wish I could change it through custom_function.php as has been suggested

        Reply
      • Smart Blogs March 27, 2010, 11:55 AM

        Hi Pascal

        Thank’s for your answer
        Actually I have been able to make changes to search result page on my blog, (You can try search result page on my blog)
        but I do it not in my direct custom_function.php change in the thesis / lib / functions / document and thesis / lib / functions / loop (but this is not recommended)

        I wish I could change it through custom_function.php as has been suggested, but i can’t do that

        Reply
        • Pascal March 27, 2010, 12:18 PM

          Hi, I can’t see any thesis search box in your blog..

          A search box is in bottom toolbar. but it is google custom search box…

          Isn’t it?

          Reply
          • Smart Blogs March 27, 2010, 12:27 PM

            You can see in right sidebar, please check it

            Reply
            • Suresh March 27, 2010, 12:56 PM

              hai,
              check your e-mail…

              Reply
  • Paramjit April 6, 2010, 8:51 PM

    Hi pascal,

    First of all, great job with your tutorials. You cannot imagine how helpful these are.

    I did all of the above and got the search working. Only problem is that all of the search results appear in a narrow column on the right side above the blog header. Aren’t the searches supposed to appear on a new page? What in your opinion is the best way to display these results?

    Paramjit

    Reply
    • Suresh April 9, 2010, 5:00 PM

      hai,
      go to http://www.google.com/cse then click on create custom search engine.
      here in the left sidebar we have options to change the look and feel of the search result page..
      the click get code options here we have to java script code one is for google search box paste the cod ewhere the search box to appear.
      another one is where the search results to be appear.
      if You need search results in separate page give crate new page and give the page url here.
      now copy the code and paste inside the page and update it..

      Reply
  • Tony April 15, 2010, 12:31 AM

    This is working almost perfectly. I have the code in my custom.php file, and the Google CSE is placed almost correct, but it is a little high. Is it possible to move it down, flush with the top of the header?

    See http://agakhan.tonyfleming.org

    Reply
    • Suresh April 15, 2010, 8:24 PM

      hai tony,
      In your custom.css code change .custom .searchs {margin-top -3.6em to -2.6 em it will fine..

      Reply
  • Tony April 15, 2010, 10:41 PM

    Hello, I changed .custom .searchs {margin-top -3.6em to -2.6 em } as instructed, and it caused my nav bar to be separated from my header. See the website now. Is there a way to make the nav bar larger so that it comes down and meets the header again?

    Reply
    • Suresh April 15, 2010, 10:59 PM

      hai tony,

      In custom.css file change .custom .searchs {margin-top:-2.4em }

      and add the following
      .custom .gsc-control-cse {padding:0em;}
      .custom form.gsc-search-box{margin:0em;}
      .custom .menu {padding-top:0.1em;}

      then it work fine..

      Reply
  • Jim April 29, 2010, 1:08 PM

    Hello,

    Thanks for this tutorial.

    I followed the instructions in this tutorial and was able to place my Google Custom Search box in my Nav menu where I wanted it. However, when doing a test search, the following code is displayed on the ‘Search Results’ page rather than the search results. I’m using the Iframe option offered by Google.

    var googleSearchIframeName = “cse-search-results”;
    var googleSearchFormName = “cse-search-box”;
    var googleSearchFrameWidth = 600;
    var googleSearchDomain = “www.google.com”;
    var googleSearchPath = “/cse”;

    Can anybody offer any advice on how to get my search results to display rather than the code?

    FYI, I’ve removed the search box code from my blog until I get my problem figured out.

    Thank you.

    Reply
    • Suresh April 29, 2010, 6:46 PM

      hai Jim,
      Paste the second part of the code you got from google.com/cse in search result page that you already created in wp-admin. Use HTML mode(which is important) to paste this code in search result page. If you are pasting the code in visual mode. It will be displayed in search result page.
      the path for doing the above process is wordpress admin/pages/edit/searchresultpage.

      Reply
      • Jim April 30, 2010, 1:51 AM

        Thanks for your reply Suresh.

        I did paste the code in the HTML Editor, not the Visual Editor, but for some reason the code displays rather than the search results.

        Any other ideas?

        Thanks.

        Reply
        • Suresh April 30, 2010, 10:13 AM

          hai,

          Just now i checked i checked the code it works fine.. check have you missed any html tags in your custom search code.
          and check the below line available in your code that you have pasted in search results page.
          script type="text/javascript"
          this tag should be available before the five lines displayed in you search result page instead of search results..
          If not code will be displayed search results page..

          check the code otherwise do it once again..

          If so it may appear like your problem.

          Reply
          • Jim April 30, 2010, 10:24 AM

            This is the exact code I’ve pasted in the Search Results page;

            var googleSearchIframeName = “cse-search-results”;
            var googleSearchFormName = “cse-search-box”;
            var googleSearchFrameWidth = 600;
            var googleSearchDomain = “www.google.com”;
            var googleSearchPath = “/cse”;

            WP is inserting a tags for some reason too.

            The code as shown above still displays on my blog’s search results page, instead of the search results.

            Reply
            • Suresh April 30, 2010, 12:40 PM

              hai jim,

              Comment section won’t display any php code or script comments section.. that why code will not appear fully. from those comments i slightly figure out your problem..
              your code for search result page should be look like this http://pastebin.com/dwqAnjX1. If not check your code you got fron google.

              In your code remove p> tag in between script..

              Use http://pastebin.com to send your codes. paste the php code there submit it and get the page url from paste bin. give this url in comments section..

              Reply
              • Jim April 30, 2010, 2:08 PM

                Thanks Suresh, here’s the link to both code snippets that Google provided;

                http://pastebin.com/JDtC8TP7

                Reply
                • Suresh April 30, 2010, 2:54 PM

                  hai,
                  I saw your code via pastebin that you have send..

                  check the search result code line no 17 mentioned in pastebin link in your comment.
                  check this line available in your search results page html mode or not?. If not That may cause the problem..

                  otherwise check any open and close script tags missed in your search page? if any one tag missed code will displayed in search page.

                  Reply
                  • Jim April 30, 2010, 2:59 PM

                    Here’s a link to a screenshot of my Google Code – http://doggybytes.ca/images/google-cse-code.jpg

                    One of the search results page on preview – http://doggybytes.ca/images/google-cse-code.jpg

                    and one of my Search Page in the WP Admin – http://doggybytes.ca/images/wp-admin-search-results-page.jpg

                    Reply
                    • Suresh April 30, 2010, 7:11 PM

                      hai,

                      go to edit search result page page in visual editor or in html editor if the below code is there just remove it..

                      http://pastebin.com/WSfGSCqX

                      I saw it via webpage developer tool in your search result page only the above code placed..
                      now once again paste the code that you got from google in search results page. it will work.

                      I checked it on your web page via developer tools..

                      If again you are facing the same problem create new page for search results then paste the code..

                  • Jim April 30, 2010, 3:07 PM

                    Yes, line 17 is there in the search page.

                    Reply
                    • Jim April 30, 2010, 4:32 PM

                      Also, here’s a link to your tutorial code with my Google CSE code in it;
                      http://pastebin.com/GK5LippU

                      and to the CSS Code’
                      http://pastebin.com/uiEJ8H45

                      The search box is live, so you can test it and see what the search page shows. The left side of the search box is cut off too. :/

                      Thanks for your help Suresh!

                    • Suresh April 30, 2010, 7:14 PM

                      @ jim,
                      This code wont create any problem.. for the left side cuff adjust the menu width in custom.css code I think 74.5% is good for you instead fo 75.5%..

  • Jim May 1, 2010, 4:57 AM

    Hi Suresh,

    It looks like this might be my problem, wpautop: http://codex.wordpress.org/Function_Reference/wpautopwp.

    Changes double line-breaks in the text into HTML paragraphs (…). Which I think might be stripping out the rest of the code. I’m told that disabling wpautop globally can have negative consequences elsewhere in Wordpress. Have you ever encountered this before? Can you think of a workaround?

    Thanks Jim.

    Reply
    • Suresh May 1, 2010, 2:28 PM

      hai,
      After saving the code you got from google in html editor.. Is there any change in that code like auto generated html tags (br,cdata and etc) addition.

      also check you have added any tinyMCE plugins, that may create some problems with ifarme codes..

      Reply
      • Jim May 2, 2010, 1:56 PM

        Hi Suresh,

        Just wanted to let you know that I got my Google CS results to work, but had to come at it from a completely different direction based on this Youtube video – http://www.youtube.com/watch?v=TLfrPOwPsYA.

        Thanks for your help, I love fourBlogger! =)

        Reply
        • Suresh May 2, 2010, 2:46 PM

          hai Jim,

          Nice video.. different approach to create search results page instead of using wordpress admin to create new page.. but the editing is not easy as like the page created via wp-admin. One more thing if you are upgrading the theme you should create this page again..

          And one suggestion I think you first created the search.php after that you added search box in navigation menu..
          Thats why your search results page don’t have search box.. which may uncomfortable to your readers if they want to search search again. They will come to homepage. which may increase bounce rate..

          so first add search box in navigation then create search results page as per the video… It will be fine..
          also to remove the left cut-off in search box reduce the menu width to 74.5% from 75.5% in custom.css file..

          Reply
          • Jim May 3, 2010, 5:51 AM

            Thanks Suresh.

            I would like to have been able to accomplish integrating Google Custom Search via creating a page from within the WP admin, but after nearly a week of trying unsuccessfully, the way I ended up doing it is the next best option.

            Reply
            • Jim May 3, 2010, 6:56 AM

              I just couldn’t find a way to stop the Google Custom Search javascript from being stripped out of the page and displaying the 5 lines of code between the script tags.

              Reply
              • Suresh May 3, 2010, 9:43 AM

                hai Jim,

                If you are having any tinymce plugins just deactivate it and try again.. because sometimes it may break iframe codes..
                have try by choosing other options except iframe code in google cse…

                Reply
                • Jim May 3, 2010, 10:15 AM

                  Suresh,

                  I did have TinyMCE installed, but I uninstalled it a couple of days ago, however my problem still persists.

                  Did you include code in the comment below this one? This is all I see;

                  “This option is also a good way to create search result page…”

                  Reply
                  • Suresh May 3, 2010, 10:34 AM

                    hai jim,

                    No I didn’t added any code.. can you send screen shot (both visual and html) after saving search result page the code in html editor.

                    Reply
                    • Jim May 3, 2010, 11:32 AM

                      Sent via your contact form.

                      Thanks.

                    • Jim May 5, 2010, 12:56 PM

                      Suresh, were you able to determine the cause of my problem from the screenshots I sent the other day?

                    • Suresh May 5, 2010, 5:49 PM

                      Jim,
                      I couldn’t find any exact reason for your problem.. i will check it .. if i find the reason.. i will inform you..

            • Suresh May 3, 2010, 9:39 AM

              hai Jim,

              This option is also a good way to create search result page…

              Reply
  • Hadi May 2, 2010, 7:02 PM

    Pascal,
    I am trying to add the google custom search box. But I do not know where to paste the code to create a search results page. Also, how can I make my logo move up to near my nav menu?
    my website is sierraleone365.com
    Thanks for the good work. I think you should create a donate button on your blog.
    Hadi

    Reply
    • Suresh May 2, 2010, 7:35 PM

      hai Hadi,

      Create new page in wordpress admin example search ..
      while getting the custom search code from google/cse . It is asking the search result page url.
      Give newly created search page url here.
      then get the code…
      Go to wordpress admin
      edit newly created search page..
      In html mode paste the code you got from google.. (normally edit page open in visual mode change it in html mode)
      update your page thats all…

      Reply
      • Suresh May 2, 2010, 8:24 PM

        hai Hadi,
        To remove the gap between navigation and logo use the below code in custom.css file
        .custom .gsc-control-cse{padding:0px}
        and change
        .custom #header{margin:0px;}
        .custom .searchs {margin-top:-2.8em;}

        Reply
  • Analyn Gravoso July 9, 2010, 11:44 AM

    Hi Suresh

    …and thank you for all your wonderful tutorials which I am working my way through.

    I find the Google Custom Search results of limited value since they ONLY return results from pages that are currently indexed by Google. On large sites it is rare for Google to index more than 80% of pages at any one time. This renders at least 20% of your sites content untraceable via Google Custom site Search. Not good!

    But I liked the way the code enabled the use of a custom search page. So here’s my question (and request).

    I want to use Relavanssi http://www.mikkosaari.fi/relevanssi/ hand in hand with the standard thesis_search_form. But the search results page is crappy. Additionally, I only want the search to be performed on post ‘excerpts’. This requires the standard WP search result template to use the_excerpt() to display post excerpts.

    1. How can I create a custom search page template and force the search results to appear on same?
    2. How can I change Thesis to use only ‘excerpts’?

    Many thanks in advance. I have searched everywhere for a solution to this but no luck thus far. I am staggered why users would find the Google Custom Search in any way satisfactory to their site search needs.

    ..

    Reply
  • Imran Shariff July 23, 2010, 11:54 PM

    Hi Pascal,

    I have been going through with the search setup in my blog, but unable to find the HTML code to views results.

    Can you please help.

    Thanks & Regards
    Imran Shariff

    Reply
    • Pascal July 24, 2010, 2:11 PM

      i will do any single thesis theme customization issue for $5. if it is ok for you, i will send my paypal id after paying money, give your site details i will do it.

      Reply
  • spicysouth September 30, 2010, 8:31 AM

    how to insert google adsense in nav bar ?

    Reply
  • Scott November 15, 2010, 9:12 PM

    I trying to install the google search in the nav bar in thesis 1.8, but it’s wants to drop down below the Nav bar. Any help would be greatly appreciated.

    Thanks,

    Scott

    Reply
  • Ankit @ Unlimited Blogging December 17, 2010, 1:29 AM

    Hello,

    Thanks for the tip, I added Google Custom Search Box into My site http://www.unlimitedblogging.com as you can see.

    Problem is Its showing my adsense ad while search as these codes are of Google Custom Search which i created here. http://www.google.com/cse
    Now I want this search with my adsense intigrated as you did on your site.

    can you please help me with this?

    Reply
  • James January 4, 2011, 7:09 PM

    Hi Pascal, excellent tutorials you have here.

    I’m having some trouble with my search box. When I place it above the Headline, the size gets drastically reduced for some reason. I’ve tried it on other sites too, but the problem persists. Could you help me out with it please?
    I’ve provided the domain name in this form.

    Thanks

    Reply
  • Sachin February 14, 2011, 11:28 PM

    Hi Pascal,
    I saw some tutorial about thesis theme. Really you people are genius. You have really good knowledge of CSS, particularly the thesis theme. I have recently got a website. I am using thesis 1.7. But watching all the tutorials I could not able to make a navbar like your site.

    Could you please make tutorial of only for Navbar, like color, border, Menus, separating the navbar to the header and content area.. This will really help to get good look of a site. Thanks in advance.

    Reply
  • JVillar February 24, 2011, 7:35 PM

    Hello!! I have a question, I’m not sure if you allow questions that are not directly related to your article. Anyway, my question is: how do I add excerpts on my search results? I’m using thesis theme. My search results just show the Post Title and the post was done.

    Please help me… I’m quite new at website building..

    Reply
  • Urdu, Hindi, English SMS/Text Messages March 28, 2011, 9:47 AM

    Thanks for tutorial..

    Can you make the same tutorial for blogger blogs please.

    Reply
  • Arthur May 8, 2011, 5:21 PM

    Went through the tutorial and I get the nav bar repeating rather than replacing. I am on the latest version of Thesis.

    Is there any updates to the code you have listed in the tutorial that I should be looking out for?

    Reply
  • Lyrics October 31, 2011, 6:04 PM

    Good tutorial! Can you tall me how can I add image in the background of the search box?

    Reply
  • Michael February 17, 2012, 1:41 AM

    Hello

    Does the Google Custom Search Box code work on the Thesis 1.8

    Reply