Databases
StackOverflow2013
Postsdbo
POHow to modify yahoo weather appearance on my page?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to modify yahoo weather appearance on my page?
    text
    copied!<p>I've just got the basic yahoo weather feed on my page...</p> <p>The following code renders the image below:</p> <pre><code>$ipaddress = $_SERVER['REMOTE_ADDR']; // API username and key masked as sensitive and irrelevant to this question $locationstr = "http://api.locatorhq.com/?user=MYAPIUSER&amp;key=MYAPIKEY&amp;ip=".$ipaddress."&amp;format=xml"; $xml = simplexml_load_file($locationstr); $city = $xml-&gt;city; // We'll only be accounting for certain cities to start off with... switch ($city) { case "Pretoria": $loccode = "SFXX0044"; $weatherfeed = file_get_contents("http://weather.yahooapis.com/forecastrss?p=".$loccode."&amp;u=c"); if (!$weatherfeed) die("weather check failed, check feed URL"); $weather = simplexml_load_string($weatherfeed); readWeather($loccode); break; } function readWeather($loccode) { $doc = new DOMDocument(); $doc-&gt;load("http://weather.yahooapis.com/forecastrss?p=".$loccode."&amp;u=c"); $channel = $doc-&gt;getElementsByTagName("channel"); foreach($channel as $ch) { $item = $ch-&gt;getElementsByTagName("item"); foreach($item as $rcvd) { $desc = $rcvd-&gt;getElementsByTagName("description"); // Save the weather data to a session variable for placement on the page $_SESSION["weather"] = $desc-&gt;item(0)-&gt;nodeValue; } } } </code></pre> <p><img src="https://i.stack.imgur.com/zBasC.png" alt="My Yahoo Weather data"></p> <p>It looks pretty terrible in my opinion, so I want to change the overall design here to fit it in with the rest of my site.</p> <p>I had an idea about rewriting the rendered html with jquery, but I'm not getting anywhere there.</p> <p>Here's the code I'm getting rendered currently:</p> <pre><code>&lt;div id="weather-feed"&gt; &lt;img src="http://l.yimg.com/a/i/us/we/52/34.gif"/&gt; &lt;b&gt;Current Conditions:&lt;/b&gt; Partly Cloudy, 17 C &lt;b&gt;Forecast:&lt;/b&gt; Tue - PM Thunderstorms. High: 26 Low: 16 Wed - Mostly Sunny. High: 27 Low: 16 &lt;a href="http://us.rd.yahoo.com/dailynews/rss/weather/Pretoria__SF/*http://weather.yahoo.com/forecast/SFXX0044_c.html"&gt;Full Forecast at Yahoo! Weather&lt;/a&gt; (provided by &lt;a href="http://www.weather.com" &gt;The Weather Channel&lt;/a&gt;) &lt;/div&gt; </code></pre> <p>Basically, all I want to do with this is to modify this rendered code as follows:</p> <pre><code>&lt;div id="weather-feed"&gt; &lt;div class="weather-icon"&gt; &lt;img src="http://l.yimg.com/a/i/us/we/52/34.gif"/&gt; &lt;/div&gt; &lt;div class="conditions"&gt; Partly Cloudy, 17 C &lt;/div&gt; &lt;div class="forecast"&gt; &lt;b&gt;Forecast:&lt;/b&gt; Tue - PM Thunderstorms. High: 26 Low: 16 Wed - Mostly Sunny. High: 27 Low: 16 &lt;a href="http://us.rd.yahoo.com/dailynews/rss/weather/Pretoria__SF/*http://weather.yahoo.com/forecast/SFXX0044_c.html"&gt;Full Forecast at Yahoo! Weather&lt;/a&gt;&lt;/div&gt; &lt;div class="credit"&gt; provided by &lt;a href="http://www.weather.com" &gt;The Weather Channel&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>I'm not having any luck finding anything that'll guide me on how to do this.</p> <p>Are there any api calls I can leverage to get a different presentation of my requested data?</p> <p>If not, can anyone suggest how I could successfully rewrite this code? Maybe with a small example...</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload