Integrating WP in an existing site
Thanks for visiting! If you're new here, you may want to subscribe to my RSS feed. My blog posts useful tips, ideas, tutorials and guides for WordPress bloggers - and articles about the life on the Canadian Prairies. If you are familiar with RSS readers, just add my feeds to your reader! You can also receive updates by email if you submit your email address in the box on the right.
Scenario 1. (see Figure 1.)
The easiest situation: You already have a .php based site, and you use a CSS file. Let’s say you installed WP in a subdirectory of your site (example.com/blog) and you want to update the NEWS section of your site with the posts from WP (See Fig.1)
So, basically you have an index.php at your root (example.com/index.php) and you need the posts into it from the example.com/blog.
1. First, let’s make the index file “WP aware”. Open your index.php file and at the very top, before anything else paste these lines applying the proper changes:
< ?php
require('./path-to-your-blog/wp-blog-header.php');
?>
In our case it should look like:
< ?php
require('./blog/wp-blog-header.php');
?>
2. Having the root index.php open, clean it up: delete all the text from the NEWS section and keep the rest. The News section should be just a bare
<div id="your-div-name">< /div>
(or a div class, depending on your structure).
3. Now we need to get The Loop into it. Open the index.php from the wordpress/wp-content/themes/classic/ folder.
The Loop starts here:
< ?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
and ends here:
< ?php endwhile; else: ?>
<p>< ?php _e('Sorry, no posts matched your criteria.'); ?></p>
< ?php endif; ?>
Copy the whole Loop from the theme index and insert it into the div we just cleaned up. The Loop looks like this.
That’s all. You are done. Navigating your browser to the index.php of your root directory should show the X number of posts in the NEWS area - depending on the settings in your Options > Reading.
Further customization
a) In The Loop that you just copied over there are several CSS id’s and classes: post, storytitle, meta, storycontent, h2. You may want to add them to your own stylesheet with the appropriate properties and values.
b) You will notice that clicking on the posts’ titles and “Comments” links it will take you to your blog at example.com/blog - displaying it with the Default (Kubrick) theme. If you want to avoid it, and you don’t want visitors to comment and/or see directly your blog, you can remove all the HTML anchor tags from around the title in The Loop. If there will not be comment, you can also delete the call for the comments-link:
< ?php comments_popup_link(__('Comments (0)'), __('Comments (1)'), __('Comments (%)')); ?>
You may also want to remove the < ?php the_category(',') ?> template tag (together with the “filed under” text), since it generates a link to the category archives page.
Wow, thanks for the info. That was very detailed!
Website Templates
Thank you very much for this tutorial. It helped a bunch.
hey, if I have more than one blog, is that possible to show all the blog posts in another page?
Many questions:
-In step 1, you refer to an index.php file. Is this the html file that displays my site, or the blog’s index file?
-In step 2, you refer to a root index.php file… again, which one is this - the one located in my blog subfolder, my main site’s main page (like before) or in wp-contents/etc etc…?
-I have my main site’s main page called “welcome.php”, and in it I use a php switch function that goes to many cases with a “require” for each, and that is set into a div tag. The links point to “…/welcome.php?i=main”, for example. Question is, should I get my “blog” case require a “blog.php” page that only has a require to “wp-blog-header.php”, or should I have my case require “…/wp-content/themes/classic/index.php”? How do I go about this?
I chose to put the “require wp-blog-header.php” function in my “welcome.php” page, at the very top, before the DTD. I created a case choice for a page called “eiblog.php”. In that php page, I put in “The Loop”, which is edited as you stated.
When I go to that page, I get:
Fatal error: Call to undefined function: have_posts() in /home/web/com/eyeinside/www/main/eiblog.php on line 1displayed in my page, instead of the blog posts. Why does it not recognize the function “have_posts”?
Please advise on what’s going on here!
Great information! Very Detailed..thanks for the tut.
I want to employ a WP blog framed within our current ‘LOOK’-the white news section block for instance. I have the blog set up here: http://www.ksnt.com/bb-test/ but wish to take its contents and transfer them to our template. Can anyone pls give me a hand with this? Our site is primarily Mason coding within html and is not a PHP site. However, the blog page can be if necessary.
Gary,
Wow! I am on a fast (cable) connection, but it takes minutes for your main site to download. And whether I want or not it starts up all kind of audio and video stuff - very bad and unfriendly for a user.
Re: your question. The blog has to be PHP, otherwise it doesn’t work; it is written in PHP and requires MySQL. Displaying it in a html file you should search the WP forums for some kind of feed-reader and try to use the RSS feeds to display the content of the blog on your site.
Hey, I hear ya’, it wasn’t my call to make, but it’s my marketing mgr’s idea so I have to do what I’m told. As far as the blog, as I mentioned previously, that page can be a PHP page, I just want to get the posts and the ability for viewers to comment and place that into our basic template/LOOK.
Hey, I hear ya’ but it was my marketing mgr’s desire and I have to do what he asks (read-tells) me to do! So it wasn’t my call. As I mentioned previously, the blog page CAN be php. I just want to get the blog content/links within the template/LOOK of our site.
As I said - try the WP forum, e.g. this thread (and search for similar topics)
http://wordpress.org/support/topic/32071
Hi
With all the design concepts and other dross floating around in my head, I’ve become completely paralyzed on what to do next.
On one hand, I want to do something and I want to do it right. On the other hand, I don’t know what this “right” is.
I want to use controllers, but I don’t really know what they are. Right now, I have a bunch of cobbled together pages. I *could* move them into classes, which would probably help factoring them into more controller oriented things, but I want to get it right the first time. And I know I can’t.
In this mentality, I think I have bitten off more than I can chew. Every small step means more steps when the final design comes into place, but without small steps I cannot get anywhere.
I need help.
Imran Hashmi
http://www.visionstudio.co.uk
Imran,
If this isn’t a “spam” post to get links to your seo-site and you really need help - you can contact me through the Design link at the top of the page. Otherwise I am going to delete your comment :)
I have multiple blogs like blacksnow, all installed in directories under the main domain. Anyone know how I can I show the latest X entries from all 4 blogs on the front page (index.php) of my site?
Dan, the only method that I can think of would be to use a feed reader and pull the RSS feeds from those blogs into your main page. Search the WP forum for feed reader applications.
This is an excellent tutorial. I’m currently revising a website that I’d put on hold. I used your Tutorial to get me started and I created this WP theme (named “Regal”):
http://climates.allergynursing.com/
to go with this html theme:
http://allergynursing.com/
Thank you for explaining how to do it!
Lois
Is it okay or advisable to simply drop the loop into the table I now have my news file, “news.php”? I don’t want to use WP’s sidebar, headers or footer.
Thanks!
It’s okay, I figured it out. I found it was easier to just drop the whole install into my root directory and then just paste the bits of code into my page where I wanted them, and just use my existing stylesheets. Cheers.
Excellent tutorial!
Helped me out a lot!
http://www.aerophire.com - its looking great
Very nice work, Thank`s for you effort .
Hope some people will benefit from it and help those who are working on improving web community work
Thank`s Alot .
Chaaban .
Hello and thanks for tutorial. i have integrate in a mxBB portal (phpBB) the last blog.
I have two problems:
1.- ¿its possible present only 1 post in portal but present more post in WP? If I copy and edit post.php (and rename)¿where write that number? (i know by options in administration but not directly)
2.- You can see muy css problems [url=http://www.alicantinos.biz/mxBB-Portal/index.php?page=6]here[/url].
What can i do?
Thanks from Spain and excuse my english.
I cant find my comment. I was 2 hours for translate… :-((
What have I do?
Thanks and excuses.
In this scenario, can you still get your rss feeds to work? I have successfully done the integration but the feeds are returning multiple errors.
Thanks for the tutorial! I’m almost there, and using Scenario 2.
I see my new theme under Presentation, but it says the stylesheet is missing. I’m unclear as to where the stylesheet is inserted in the header.php? I’ve uploaded it and index.php to the same directory as the theme.
Did you put the proper lines at the top of the stylesheet? Otherwise WP doesn’t recognize it.
Do you have any plans to post Scenario #6?
Exactly what I wanted to know. Brilliant walkthrough!
I am really happy with this except I dont want to display the sidebar content when someone posts a comment….I am not sure what I need to modify..
First off, GREAT tutorial….exactly what I wanted!
But I did have one question:
How would I go about displaying another category from my blog instead of the default category?
Thanks in advance for any help!
Nice templates!
However, I already purchased several at http://www.web-site-templates.org quite cheap. Now I’m working to create the website
Alicia
Just wanted to say thanks for the tutorial. Feel I know my way around a lot better now. Cheers!
Good tutorial!
I am thinking about generating an ajax comment section, opening when the comment link is clicked. This way the user will not be redirected to wp single.php page. I’ll keep you updated,
Davide
Sounds good..
any idea why it won’t work here:
http://dangerhere.com/testbloghome.php
Wonderful tutorial. Could make one for RSS feeds too? Please! :)
Questions:
1. How can I modify this code so when you click on the topic (or comments) it will open the blog in a new window (so the user don’t leave the my site)
2. Can you also modify this code to display a list of all the posts (as links) on my blog?
THANK YOU!!!
I’m trying to use the the customized Wordpress theme from my blog, which is in a sub-folder as the theme/template for the non-WP pages that are in the root. I’ve tried all kinds of variations of your coding, but still get “Call to undefined function:” when I view the test page. The test page is a functioning php page, works with a simple echo ‘test’ command…
I noticed an earlier commenter posted on something, similar…what to do about this? Any additional tweak needed to make a page in the root run php from the WP folder?
My site’s here by the way
maybe I’m stupid, but I integrated my blog following your instructions, but all the links are opening the blog in the “old” layout outside the page. is it because I’m not using the index.php to include the blog, but a included page?
In my style sheet I have already defined “container”, “right_content”, “right”, and all that good stuff. See, that’s my CSS layout.
I used method 1 on my site and it works fine. However, there is some odd output at the end.
“var sc_project=1990671; var sc_invisible=0; var sc_partition=18; var sc_security=”748b9c65″; Code corrupted. Insert fresh copy.”
What does this mean, and what do I need to do to fix it?
I apologize, the error I posted had nothing to do with WP, it had to do with a javascript stat counter. Feel free to delete both of my posts.
I got it to work perfectly, but with the exception of comments. Is it possible to flag a standalone (non-WP) page from within its html so that the code for running the comments box works? I’ve got my header, footer, and sidebars working through your technique, but always get “Comments are closed”. Do I somehow need to pull the html standalone pages into the WP database? If so how can I do that automatically, I’ve got more than 600!
David,
the main issue with non-WP pages (files) is they don’t have a WP id# in the database. Comments are related/tied to post IDs, so WP knows which comments to show on a certain post. Not finding an ID - it shows the comments as “closed”.
There used to be several topics on this in the WP Forum, you can find them by searching for comments on non-WP pages or similar keywords. I have found one really relevant thread; it has more than one solutions in it.
As for importing html files into the WP database - that’s again an often seen request although there is no general solution. Maybe this forum topic?
EXACTLY what I was looking for. Thanks!
YES. I love you and/or this SO HARD.
hi,
when i use the include(); or require(); command it works fine an the way i want
BUT my site assume the CSS properties file of the “require (myphp.php);” file on the whole site and assign new body bg-color, etc. …how is this possible?!
i cant see any solution to solve this…
thanks for help:)
gorde,
I guess I’d need more info to be able to help. What are you including and where? Are you sure you are using any of the methods described above?
Fantastic. Thanks for the solution.
I have tried this tutorial, using scenario 1, and no matter what I do, I end up with the following:
Fatal error: Call to undefined function: have_posts() in /home/logkkanl/public_html/website/test/index2.php on line 358
What am I doing wrong? I’ve just about given up and am ready to go back to iframe.
Does the blog work on its own location? i.e. when not included?
If yes, my guess is your path to the wp-blog-header is not correct.
I fixed the path, but now I’m getting open_basedir restrictions. I think that’s a webhost issue. If anyone has thoughts on a work around, I’m all ears…
Thanks for responding promptly!
That’s definitely a host issue. Other than getting a decent host I don’t know what to suggest. If you ever think about changing hosts… see the ad in the left sidebar (TheBlogHotel).
This was extremely simple. I was using rss-javscript until I found this gem. I however have one question. How would you display on a certain category, rather than the entire news?
For that you’ll have to edit the Loop and query posts only for that one category. See the Codex: The Loop and/or query_posts.
This tutorial saved me tons of time. I was getting really frustrated trying to search out the correct include/require file myself. Thanks!
great templates and tutorial! thanks
you just saved me hours, thanks!
WOW! I have spent DAYS trying to figure this out. Thank you soooo much for this tutorial, you saved my sanity!
http://cskate.com/index1.php
whats wrong? i followed your directions exactly but, in firefox the blog just spews all over the page and doesn’t stay within my div tags, can someone please help me!!!???
You want to “force” a dynamic (=variable length) content into a fixed height. That will not work. Otherwise it stays inside your design: horizontally is inside the graphic.
Oh, and having a 500KB bg image is kind of insane… sorry.
Im still testing, the design isnt even complete so i havnt had time to properly compress it… So your telling me there is no way to “force” my blog into the parameters i want vertically, but, what if i placed an iframe into the div tags and put “the loop” into an external page (ex: http://cskate.com/blog.php) and make the parameters of the “iframe” match my desired height…could that be a solution to my problem ?
It’s not me, not even WP. There is no way to “force” a dynamic page into a fixed length. Period.
That iframe thing might work - I just never use frames, so I am not the best person to give you advice on that. Give it a try. Good luck!
Hi there,
thanks for a great site. I dont know much about this but it worked out perfectly. (look at the index page top right under “nyheter” and at the bottom.
HOWEVER, i also tried to intregrate the loop to get the posts to other pages as well which didnt work at. Why is that different? The page is directly under the root and i did exactly the same thing but it says: “page cant be found” instead of the post.
thank you very much.
john
Great tutorial. Thanks!
where did the images go?
Hi and thanks for tutorial, after reading this, the pain in my head is less!
thank you!! you rock.
Thanks for this!
solutions solution proactiv solution proactive proactiv
Thanks for easy to follow instructions.
Unfortunately I get “‘Sorry, no posts matched your criteria”.
There are posts.
Feel really stupid as everyone else has got it to work.
What am I doing wrong?
Sorry, Kevin,
I am away from home and computers.
That must be just a small mistake somewhere, although I can only guess…
This works great thanks - one question. Using the loop on my site within a table. However, when comments is clicked I need to goto a new page. Where exactly do I set the target=_blank attribute for the posting title, permalink, and comments.
Well, there is a warning in the article that it will happen: clicking on those links it will take you to the non-integrated WP install.
As for setting the target “blank” I don’t really know, I guess you should try doing it globally for the whole installation (search the WP forum for similar questions). I never bothered to learn because I assume others are just like me: I hate when the site owner wants to decide what my browser should do, so I overwrite every attempt to open new windows. My computer and its browser does what I want, not what you (or anybody else) want.
WOW! So glad I’ve come upon your site. THANK YOU! I’m new to WP and been doing LOTS of research and reading …will be spending the rest of the day roaming around at moshublog.com
I’m 58 and so also interested in your Pension Project. I’ve been self-employed at least half my worklife so, like you, am expecting minimal “pension” benefits in my “later years”.
Retirement???
Hi Jim,
Thank you for stopping by and commenting. Glad you found it useful.
I hope you downloaded the Pension Report and will be notified when the Pension Manual is ready to go.
Thank you for this information. :)