# Thursday, 05 October 2006
Vielfach bekomme ich die Frage, wie man die Windows Live Suche in seine eigene Webseite einbinden kann.
Gute Frage - nächste Frage ... dachte ich immer. Denn die Integration lassen ja alle Suchmaschinen zu die man so kennt.
 

Aber bei http://search.live.com/ habe ich vergeblich so eine Seite gesucht. Sicherlich, es gibt die diversesten Gadget-Möglichkeiten die Suche einzubinden, aber ich möchte es ja schlichtweg als Suchfeld bei mir in der Seite einbinden. Da ich auf Live.com nicht fündig geworden bin, hier ein Mashup einfach aus dem Quelltext von http://search.live.com/ genommen und angepasst mit einem Logo.

Einzig alleine das Stylesheet könnte man sich selber zusammenbasteln und lokal auf seinem Space ablegen. Der Abschnitt in letzten Drittel des CSS ist wichtig - dort wo die Search Styles anfangen.
Für Änderungsvorschläge - einfach bescheid sagen. Ist ja nur ein erster schneller Versuch.

Wer oben gesuchte Möglichkeit doch auf Live.com findet - bitte mir bescheid sagen, manchmal sieht man den Wald vor lauter Bäumen nicht.

Code:

 

   1:  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
   2:  <html>
   3:   
   4:  <head>
   5:  <title></title>
   6:  <link rel="stylesheet" type="text/css" media="screen" href="http://www.live.com/live/1.100.7.337/css/searchlanding.css" />
   7:  </head>
   8:   
   9:  <body>
  10:   
  11:  <div id="search">
  12:     <ul>
  13:        <li>
  14:        <a href="http://www.live.com/?searchLive Searchonly=true" target="_blank">
  15:        <img src="http://shared.live.com/~live.themes/~/~/~live.search/~/~de-DE/Base/controls/img/jewel.png" alt="Live.com Suche" width="49" height="49" border="0" align="absmiddle"></a><span id="searchLandingTitle"> Live Search</span>
  16:        <ul class="details">
  17:           <li>
  18:           <div id="searchBar">
  19:              <form id="searchform" name="searchform" action="http://search.live.com/results.aspx" target="_blank" onsubmit="return onSearch(event);">
  20:                 <span class="sc"><input class="q" id="q" name="q" value="" /><input style="border: 1px solid rgb(170, 170, 170);" name="mkt" value="de-de" type="hidden" /><input name="FORM" value="LVSP" type="hidden" /><input name="go" id="go" class="go" src="http://www.live.com/live/1.100.7.337/img/search_go.gif" target="_blank" value="Search" align="middle" type="image" /></span></form>
  21:           </div>
  22:           <script>document.getElementById("q").focus();</script>
  23:           </li>
  24:           <li>
  25:           <ul id="scopes" class="scopes">
  26:              <li class="selected" id="web">
  27:              <a href="./?scope=web" onclick="return selectScope('web');">Web</a></li>
  28:              <li id="images">
  29:              <a href="./?scope=images" onclick="return selectScope('images');">
  30:              Bilder</a></li>
  31:              <li id="news">
  32:              <a href="./?scope=news" onclick="return selectScope('news');">News</a></li>
  33:              <li id="local">
  34:              <a href="./?scope=local" onclick="return selectScope('local');">Local</a></li>
  35:              <li id="qna">
  36:              <a href="./?scope=qna" onclick="return selectScope('qna');">QNA</a></li>
  37:   
  38:           </ul>
  39:           </li>
  40:        </ul>
  41:        </li>
  42:        <li class="msg"></li>
  43:     </ul>
  44:  </div>
  45:  <script language="JavaScript">
  46:   
  47:                  var searchform = document.getElementById("searchform");
  48:   
  49:                  var searchbox = document.getElementById("q");
  50:   
  51:                  var _scope="web";
  52:   
  53:                  var _scopes={web:'http://search.live.com/results.aspx',news:'http://search.live.com/news/results.aspx',images:'http://search.live.com/images/results.aspx',local:'http://local.live.com/',qna:'http://qna.live.com/search.aspx'};
  54:   
  55:                  
  56:   
  57:                  function onSearch(ev)
  58:   
  59:                  {
  60:   
  61:                                 searchform.action=_scopes[_scope];
  62:   
  63:                                 return true;
  64:   
  65:                  }
  66:   
  67:                  
  68:   
  69:                  var scopesEl = document.getElementById("scopes");
  70:   
  71:                  function selectScope(scope)
  72:   
  73:                  {
  74:   
  75:                                 _scope=scope;
  76:   
  77:                                 if (scopesEl) for (var i=0; i < scopesEl.childNodes.length; i++) scopesEl.childNodes[i].className = "";
  78:   
  79:                                 var el = document.getElementById(scope);
  80:   
  81:                                 if (null != el) el.className = "selected";
  82:   
  83:                                 searchbox.focus();
  84:   
  85:                                 return false;
  86:   
  87:                  }
  88:   
  89:  </script>
  90:   
  91:  </body>
  92:   
  93:  </html>
Jetzt diesen Blogpost kommentieren: Comments [2]




Jahresübersicht: 2016 | 2015 | 2014 | 2013 | 2012 | 2011 | 2010 2009 | 2008 | 2007 | 2006


Visual Studio Code - ein kostenloser Code-Editor für  Linux, OSX und Windows - jetzt ausprobieren