Advanced Search

Google Weather for Website

/ Published in: PHP
Save to your folder(s)
With this customizable code you can add google weather showing current temps, conditions, and forecast for any location to your website. User prompts are included to allow the user to change the default location easily then hit the "go" button. Auto refresh of weather conditions at the interval you desire.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <?
  2. $Fname = $_GET["Fname"];
  3. if(! isset($Fname) )
  4. {
  5. $Fname='New York, NY';
  6. }
  7. if( empty($Fname) )
  8. {
  9. $Fname='New York, NY';
  10. }
  11. $xml = simplexml_load_file('http://www.google.com/ig/api?weather=' .$Fname . '&hl=en');
  12. $information = $xml->xpath("/xml_api_reply/weather/forecast_information");
  13. $current = $xml->xpath("/xml_api_reply/weather/current_conditions");
  14. $forecast_list = $xml->xpath("/xml_api_reply/weather/forecast_conditions");
  15. ?>
  16. <html>
  17.     <head>
  18.         <title>Google Weather API</title>
  19. <style type="text/css">
  20. body
  21. {
  22.    background-color: #FFD700;
  23.    color: #000000;
  24. }
  25. </style>
  26. <script language="JavaScript" type="text/javascript">
  27. ////////////////////////////////////////////////////////////////////////////
  28. // CONFIGURATION STARTS HERE
  29.  
  30. // Configure refresh interval (in seconds)
  31. var refreshinterval=300
  32.  
  33. // Shall the coundown be displayed inside your status bar? Say "yes" or "no" below:
  34. var displaycountdown="no"
  35.  
  36. // CONFIGURATION ENDS HERE
  37. ////////////////////////////////////////////////////////////////////////////
  38.  
  39. // Do not edit the code below
  40. var starttime
  41. var nowtime
  42. var reloadseconds=0
  43. var secondssinceloaded=0
  44.  
  45. function starttime() {
  46. 	starttime=new Date()
  47. 	starttime=starttime.getTime()
  48.     countdown()
  49. }
  50.  
  51. function countdown() {
  52. 	nowtime= new Date()
  53. 	nowtime=nowtime.getTime()
  54. 	secondssinceloaded=(nowtime-starttime)/1000
  55. 	reloadseconds=Math.round(refreshinterval-secondssinceloaded)
  56. 	if (refreshinterval>=secondssinceloaded) {
  57.         var timer=setTimeout("countdown()",1000)
  58. 		if (displaycountdown=="yes") {
  59. 			window.status="Page refreshing in "+reloadseconds+ " seconds"
  60. 		}
  61.     }
  62.     else {
  63.         clearTimeout(timer)
  64. 		window.location=window.location;
  65.     } 
  66. }
  67. starttime()
  68. </script>
  69. </head>
  70. <body>
  71. <form method="get" action="<?php echo $PHP_SELF;?>">
  72. <input type="text" style="position:absolute;left:6px;top:4px;width:140px;height:21px;border:1px #000000 solid;font-family:Arial;font-weight:bold;font-size:12px;z-index:0" name="Fname" value="<?php echo $information[0]->city['data'] ?>" maxlength="30">
  73. <input type="submit" id="Button1" name="Go" value="Go" style="position:absolute;left:146px;top:3px;width:30px;height:23px;font-family:Arial;font-size:13px;z-index:1">
  74. </form><br /> 
  75. <div id="wb_Image1" style="margin:0;padding:0;position:absolute;left:5px;top:28px;width:44px;height:44px;text-align:left;z-index:0;">
  76. <img src="<?= 'http://www.google.com' . $current[0]->icon['data']?>" id="Image1" alt="" border="0" style="width:44px;height:44px;"></div>
  77. <div id="wb_Text2" style="margin:0;padding:0;position:absolute;left:5px;top:74px;width:193px;height:16px;text-align:left;z-index:2;">
  78. <font style="font-size:13px" color="#000000" face="Arial"><?= $current[0]->condition['data'] ?></font></div>
  79. <div id="wb_Text3" style="margin:0;padding:0;position:absolute;left:5px;top:92px;width:193px;height:16px;text-align:left;z-index:3;">
  80. <font style="font-size:13px" color="#000000" face="Arial"><?= $current[0]->humidity['data'] ?></font></div>
  81. <div id="wb_Text4" style="margin:0;padding:0;position:absolute;left:5px;top:110px;width:193px;height:16px;text-align:left;z-index:4;">
  82. <font style="font-size:13px" color="#000000" face="Arial"><?= $current[0]->wind_condition['data'] ?></font></div>
  83. <div id="wb_Text5" style="margin:0;padding:0;position:absolute;left:56px;top:34px;width:131px;height:29px;text-align:left;z-index:5;">
  84. <font style="font-size:24px" color="#000000" face="Arial"><b><?= $current[0]->temp_f['data'] ?>&deg; F</b></font></div>
  85. <div id="wb_Text6" style="margin:0;padding:0;position:absolute;left:12px;top:132px;width:30px;height:16px;text-align:left;z-index:6;">
  86. <font style="font-size:13px" color="#000000" face="Arial"><?= $forecast_list[0]->day_of_week['data'] ?></font></div>
  87. <div id="wb_Text7" style="margin:0;padding:0;position:absolute;left:55px;top:132px;width:30px;height:16px;text-align:left;z-index:7;">
  88. <font style="font-size:13px" color="#000000" face="Arial"><?= $forecast_list[1]->day_of_week['data'] ?></font></div>
  89. <div id="wb_Text8" style="margin:0;padding:0;position:absolute;left:97px;top:132px;width:30px;height:16px;text-align:left;z-index:8;">
  90. <font style="font-size:13px" color="#000000" face="Arial"><?= $forecast_list[2]->day_of_week['data'] ?></font></div>
  91. <div id="wb_Text9" style="margin:0;padding:0;position:absolute;left:139px;top:132px;width:30px;height:16px;text-align:left;z-index:9;">
  92. <font style="font-size:13px" color="#000000" face="Arial"><?= $forecast_list[3]->day_of_week['data'] ?></font></div>
  93. <div id="wb_Image2" style="margin:0;padding:0;position:absolute;left:10px;top:152px;width:30px;height:29px;text-align:left;z-index:10;">
  94. <img src="<?= 'http://www.google.com' . $forecast_list[0]->icon['data']?>" id="Image2" alt="" border="0" style="width:30px;height:29px;"></div>
  95. <div id="wb_Image3" style="margin:0;padding:0;position:absolute;left:51px;top:152px;width:30px;height:29px;text-align:left;z-index:11;">
  96. <img src="<?= 'http://www.google.com' . $forecast_list[1]->icon['data']?>" id="Image3" alt="" border="0" style="width:30px;height:29px;"></div>
  97. <div id="wb_Image4" style="margin:0;padding:0;position:absolute;left:92px;top:152px;width:30px;height:29px;text-align:left;z-index:12;">
  98. <img src="<?= 'http://www.google.com' . $forecast_list[2]->icon['data']?>" id="Image4" alt="" border="0" style="width:30px;height:29px;"></div>
  99. <div id="wb_Image5" style="margin:0;padding:0;position:absolute;left:134px;top:152px;width:30px;height:29px;text-align:left;z-index:13;">
  100. <img src="<?= 'http://www.google.com' . $forecast_list[3]->icon['data']?>" id="Image5" alt="" border="0" style="width:30px;height:29px;"></div>
  101. <div id="wb_Text10" style="margin:0;padding:0;position:absolute;left:8px;top:182px;width:34px;height:14px;text-align:left;z-index:14;">
  102. <font style="font-size:11px" color="#000000" face="Arial"><?= $forecast_list[0]->high['data']?>&deg;/<?= $forecast_list[0]->low['data'] ?>&deg;</font></div>
  103. <div id="wb_Text11" style="margin:0;padding:0;position:absolute;left:49px;top:182px;width:34px;height:14px;text-align:left;z-index:15;">
  104. <font style="font-size:11px" color="#000000" face="Arial"><?= $forecast_list[1]->high['data']?>&deg;/<?= $forecast_list[1]->low['data'] ?>&deg;</font></div>
  105. <div id="wb_Text12" style="margin:0;padding:0;position:absolute;left:90px;top:182px;width:34px;height:14px;text-align:left;z-index:16;">
  106. <font style="font-size:11px" color="#000000" face="Arial"><?= $forecast_list[2]->high['data']?>&deg;/<?= $forecast_list[2]->low['data'] ?>&deg;</font></div>
  107. <div id="wb_Text13" style="margin:0;padding:0;position:absolute;left:132px;top:182px;width:34px;height:14px;text-align:left;z-index:17;">
  108. <font style="font-size:11px" color="#000000" face="Arial"><?= $forecast_list[3]->high['data']?>&deg;/<?= $forecast_list[3]->low['data'] ?>&deg;</font></div>
  109. <hr id="Line1" style="color:#00008B;background-color:#00008B;border:0px;margin:0;padding:0;position:absolute;left:0px;top:128px;width:180px;height:5px;z-index:18">
  110. </body>
  111. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.