Integrated Blog with WordPress

A number of folks have posted messages in the past about running blogs on their weather websites. Those that do have tried many things like using iframes to pull data from their blog pages or just having a normal HTML page that they update regularly. Neither solution is particularly elegant and doesn’t give you very much flexibility. I used an HTML page with a running list of topics for a while but the management of it was a PITA.

I figured there had to be a way to integrate one of the many available blogging programs into the site so I gave it a shot and I think I found a good solution. I installed WordPress on the server (I run a small web host company on the side and can install it with a simple click) then created a custom WordPress template. The WP template system is kind of nice and modular so I started with the default template then stripped out the header and footer it was using. I then took the leftover PHP and pasted it into the {main-copy} portion of a page like the rest of my site uses (based on Carter Lake templates).

There were a few issues I had to work out… Like having to reconcile the template CSS and the WP template’s CSS and figuring out what parts of the WP CSS I needed to put in weather-screen.css. Also ran into some issues with floats and other formatting issues but I managed to work that out.

In the end I have a weather blog now with all of the features of a full-fledged blogging software and best of all, it is completely integrated with my site - the exact same look and feel. Visitors can view postings chronologically, by month, by category, and can be searched. I also removed the ability for visitors to leave comments thus solving the “comment spam” other folks have had with other blog solutions. On the management side, I can make postings from anywhere by simply going to the WordPress management page on my site, logging in and writing what I want. I think it came out pretty cool.

For those that are interested, you can view it here: http://www.thorntonweather.com/blog

Tony

Tony I agree with your conclusion - cool 8)

Stuart

I think it came out pretty cool.

Nope, pretty cool doesn’t do it justice. About one of best I’ve seen for blogs. Great job in integrating it into you pages!

–Dave

Oh yes, very well done :smiley:

Thank you for the kind words, gentlemen! It wasn’t overly difficult but did require a good bit of editing and customizing to get everything working right. Once Ken gets his updated PHP template package done, I am going to try to create a matching WordPress template to share with anyone that wants to give this a try.

Tony

I’d be very interested in that Tony! Your site looks great. :smiley: That’s something I’ve wanted to do for some time. I tried to start editing the wp templates but just didn’t have the time. I then opted to go the iframe method but didn’t like that. At the moment I just link to my blog but would much rather have it integrated into the look and feel of the main page.

Thanks for that Tony. Integraing wordpress into my new site is something I’ve just started so your account of how you did it is much appreciated!

I’ve come a bit stuck with this and, as far as I can see, it’s the CSS that’s messing things up. I’m confused as there are 2 style sheets being used by WP: reset-fonts-grids-tabs.css and style.css and I’m struggling to make it fit into my site layout and its CSS. Condensing 3 style sheets into 1 is more than my meagre brain can cope with.

The route I went down was adding my original header code to the WP header.php, rather than copying the root index.php code into an existing page as, I presume, you did. I tried this but couldn’t make it display anything from WP!

Tony, can you give a bit more detail on how you dealt with the CSS side of things? Whether I take elements of the WP CSS and point the WP pages to my site CSS or add bits of my site CSS to the WP CSS, I can’t get the page to look right.

Also, can you give a bit more detail on which files you actually changed?

This is how it looks at the moment and the attached screenshot shows that, before I started hacking at it with a sharpened Dreamweaver, it actually worked!

Thanks again.


wordpress.png

I’ve fixed it now - though not quite as I’d intended. I’ve put my original header/footer code into the WP header and footer files and added the relevant CSS. This still looked wrong so I had to use a lot of CSS positioning and sizing instructions to make the header and footer look like the rest of the site. I still don’t understand it all :slight_smile:

Ewan,

Very sorry for the slow reply - sometimes real life gets in the way of my weather fun! :slight_smile:

You are correct in that I did most of the modifications to the index.php WP template page. I stripped out the default includes for the WP header and footer and added in the actual coding for the same items from my site design. About the only thing left from the original index.php was the main part that generates and displays the postings.

In doing this, the template then calls only my main CSS file. Some definitions that WP needs though were not in my original CSS so I copied those out of the WP CSS file and into mine and modified them to match my site. The attached file contains those additions. I had to modify some of the CSS that was already present but not much.

Hope that helps and again, sorry for being slow to reply!

Tony


wpcss.txt (3.55 KB)

No problem Tony - thanks for replying.

Your way is certainly a neater solution than mine! Thanks for posting your CSS modifications; I may change mine when I get the chance as it’s much better than having seperate CSS for the blog page.

Count me in on a template if you ever have one available…

I love wordpress.

Unfortunately I do not have MySql available so just as an FYI to others in this boat, google (who else), now has a free blog application. It actually is very easy to setup and is easy to work with. I can take a weather related picture from my phone, e-mail it to a special address, type in comments and it appears in the log very nicely.

Didn’t mean to hijack the thread but though maybe others are in the same boat!

You can see my blog here…http://www.branfordfire.com/weather/blog.php

Regards,

Jack

Hi Folks!

After several tests with implent weatherdata (a’la clientraws etc) to a blogsystem or cms with no luck, I tryied with implenting WordPress to current site and with ideas from stuff eariler in this thread, thanks to them, it was not difficult at all.
The main-part is to have own wx-site build in blocks like header, sidebar and footer (Thanks to TNET’s template for them) and then it was easy to include those in the WP’s theme-editor without any iframes or similar, simply with php’s include-tag.
The best of it are I have now access to all my own scripts (like clientaws, languages etc.) also for the blog so it look and feels as same as wx-site.
Here is the result: http://www.nordicweather.net/blog/?lang=en

Henkka

Very good, Henkka! I am glad this was a help to you to getting Wordpress up and running.

As you say, the Wordpress template system does lend itself pretty well to the work others have done on the WD templates. When Ken releases his WD Carterlake / AJAX / PHP template, I hope to create a matching Wordpress template that folks can use with their own Wordpress installation and get their own weather blogs going without too much difficulty.

Tony

Thanks for the kind words. To add the blog was one point in my case (wich never will be finished, thanks to theese great peoples in this forum who produce new scripts to us to play with :D) to get the site W3C-validated and cleaned up in “behind the scenes”-section.
One idea what I thought to try some day is to take one of the many WP’s addons (ie. gallery) and get it to work.

Henkka

As you say, the Wordpress template system does lend itself pretty well to the work others have done on the WD templates. When Ken releases his WD Carterlake / AJAX / PHP template, I hope to create a matching Wordpress template that folks can use with their own Wordpress installation and get their own weather blogs going without too much difficulty.

Tony,

I’m very interested in this as I now have mysql available. I downloaded all the wordpress php’s and have everything working except for the integration. Can you help with this at this point?

Regards,

Jack

Hey there, Jack!

I do want to get this done as I know some folks want to give it a shot. I should have time this weekend.

Question… Which template set are you using? Looking at your site I presume the new one that Ken released in recent weeks? Let me know as I will use whichever one you are using as the starting point (vice the other variations of the Carter Lake templates).

Tony

Hi Tony,

Thank you!! And yes I am using Ken’s new template. I’ve tried to figure this out based on your first post and came close a couple of times but then my simple brain gets confused!! 8O

Looking forward to your code!

Regards,

Jack

Very sorry for being so slow getting to this - real life sometimes intrudes on my weather stuff and that is really annoying!

I kind of have this working but have two problems to figure out.

  1. The sidebar.php links - The links don’t work when the sidebar is included on the blog template because the path is wrong. The blog is in a subdirectory and the sidebar expects the linked pages to be in the same directory. May have to resort to a second copy of sidebar.php with the paths adjusted accordingly. Not ideal as that is another page to have to maintain but it may be the only way to go.

  2. Theme switcher - A number of additions are required to the CSS files for the various WordPress definitions. Adding those to one CSS file is okay but with the theme switcher those modifications would have to be made to each CSS file. Trying to find a better way to accomplish this.

Anyway, I am working on this slowly. Hopefully will have something soon.

Tony