Title: Layout question-Reverse engineering WordPress to learn php/css
Last modified: August 18, 2016

---

# Layout question-Reverse engineering WordPress to learn php/css

 *  [Biks](https://wordpress.org/support/users/biks/)
 * (@biks)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/)
 * I’ve already figured out how to edit a theme and get it to match my site:
 * [http://www.wickeddelicious.com/blog/](http://www.wickeddelicious.com/blog/) 
   Hurray! 🙂
 *  I have no idea how mysql works, but I thought I’d build my site from scratch
   using the layout and php used in WordPress. (I’ll be able to better integrate
   WordPress into my site once I fully understand how it works. I don’t want to 
   make my whole site a blog.)
 *  I’ve created a test layout using the section templates that WordPress uses: 
   Here’s the site: [http://wickeddelicious.com/testphp/](http://wickeddelicious.com/testphp/)
   The index.php code looks like this:
 * <?php include (‘header.php’); ?>
    <?php include (‘content.php’); ?> <?php include(‘
   sidebar.php’); ?> <?php include (‘footer.php’); ?>
 * CSS file: [http://wickeddelicious.com/testphp/testphp.css](http://wickeddelicious.com/testphp/testphp.css)
 *  First problem: the sidebar isn’t aligning to the right of my content page. Does
   it have something to do with the <?php include’s or is it something in my CSS
   code? I noticed that WordPress uses “<?php get_header(); to insert the sections
   on the index page.
 *  I still haven’t figured out how to center the whole thing in a browser window.
   😛

Viewing 8 replies - 1 through 8 (of 8 total)

 *  [jamespoling](https://wordpress.org/support/users/jamespoling/)
 * (@jamespoling)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576613)
 * your alignment has to do with your CSS. You’ll probably want to “float” your 
   sidebar to the right or left.
 * If you want to align your entire site to the center, in your CSS either in the
   main “body” tag or “html” tag put the attribute “margin: 0px auto;”
 *  Thread Starter [Biks](https://wordpress.org/support/users/biks/)
 * (@biks)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576653)
 * I guess I wanted to know how does the default WordPress theme align the two columns?
   Where in the style.css does it mange to do this? Same thing for centering the
   whole mess. This is what I’m seeing:
 * /* Begin Structure */
    body { margin: 0; padding: 0; }
 * #page {
    background-color: white; margin: 20px auto; padding: 0; width: 760px;
   border: 1px solid #959596; }
 *  I keep thinking I’m going to find page: center. Ah ha…found this though:
 * .narrowcolumn {
    float: left; padding: 0 0 20px 45px; margin: 0px 0 0; width:
   450px; }
 *  OK, .narrowcolumn is doing the floating.
 *  Moderator [Samuel Wood (Otto)](https://wordpress.org/support/users/otto42/)
 * (@otto42)
 * WordPress.org Admin
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576662)
 * On another note, you will want to use the WordPress functions for various things.
   
   get_header(); get_sidebar(); get_footer();
 * In the case of displaying comments, you’ll want to use:
    comments_template();
 * These mostly do the same thing as the include’s you’re using, but they are more
   standard to the WordPress way of doing things.
 *  [jamespoling](https://wordpress.org/support/users/jamespoling/)
 * (@jamespoling)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576670)
 * if there is no attribute in the body tag of a CSS a page automatically aligns
   to the left.
 * body {
    margin: 0px auto; padding: 0; }
 * just adding that to the body attribute should align everything on your page to
   the center.
 *  Thread Starter [Biks](https://wordpress.org/support/users/biks/)
 * (@biks)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576673)
 * I’m attempting to redo everything in simplier php with no mysql. I’m assuming
   the get_header(); are related to mysql. (getting header data from the mysql database?)
   When I run anything with get_ in the code, nothing works. (php is working on 
   my server/machine)
 *  I finally got my columns to align with float. I noticed to get my footer to 
   align correctly below everything, I had to include “clear: both; in the #footer
   tag in my css file. No idea why this worked.
 *  Like I said, I’m attempting to strip away everything that’s not needed from 
   the default theme to make a simple layout, yet using the methods used in WordPress.(
   I’m old school who grew up with html tags. This is forcing me to get my head 
   on straight with css.)
 *  Moderator [Samuel Wood (Otto)](https://wordpress.org/support/users/otto42/)
 * (@otto42)
 * WordPress.org Admin
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576678)
 * > _I’m attempting to redo everything in simplier php with no mysql. I’m assuming
   > the get\_header(); are related to mysql. (getting header data from the mysql
   > database?)
 * No. These are parts of WordPress. They cause the theme to display the header.
   php, sidebar.php, footer.php, or comments.php of the theme. They have special
   handling as part of WordPress.
 * If you’re developing a WordPress theme, then you really should use these functions.
   If you’re developing something else entirely, then just ignore me.
 * > _When I run anything with get\_ in the code, nothing works. (php is working
   > on my server/machine)_
 * Are you developing a theme? Are you running the theme in a copy of WordPress?
   You cannot run a WordPress theme separately, it’s got to be run under a copy 
   of WordPress itself.
 *  Thread Starter [Biks](https://wordpress.org/support/users/biks/)
 * (@biks)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576729)
 * What I’m doing is building a totally new site with WordPress as my starting point.(
   Only using PHP, no mysql at this point) I’m using the same structure (header.
   php, sidebar.php, etc.) but having the parts come together using my own php code.(
   very simplified versions)
 *  The reason why I’m doing this is because I’m a beginner when it comes to CSS
   and php. When I first took a peek at WordPress, it was overwhelming. (at least
   for a beginner like me) Now that I’ve done this, I know exactly how WordPress
   puts it’s parts together.
 *  I’ve finally got something that looks and sorta behaves like WordPress. The 
   next step is to actually insert WordPress and alter a theme to match my site.(
   easy peasy – see?)
 *  The next step is to figure out how the mysql aspect works within WordPress. (
   I’m sure I’ll have questions on that too.) 🙂
 *  [moshu](https://wordpress.org/support/users/moshu/)
 * (@moshu)
 * [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576730)
 * Actually, even if you are not aware of it – WP went initially, the other way 
   around: prior to 1.5 there was ONE single file called index.php, and everything
   was in it from the starting html to the final /html.
 * PHP is needed only to be able to “talk” to the MySQL database, since html doesn’t
   communicate with databases.
 * Then, with the release of WP 1.5 the theme system has been introduced and the
   original index file was “sliced” in several pieces, making the customization 
   more flexible.
    About 2 years ago I wrote about the [“anatomy”](http://www.transycan.net/blogtest/2005/03/31/visual-anatomy-of-a-wp-15-theme/)
   of a theme. You may want to take a look at it.
 * Edit. One last note: The use of CSS is absolutely not related to PHP – you can
   have pure html sites + css.

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Layout question-Reverse engineering WordPress to learn php/css’ is closed
to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [php](https://wordpress.org/support/topic-tag/php/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 8 replies
 * 4 participants
 * Last reply from: [moshu](https://wordpress.org/support/users/moshu/)
 * Last activity: [18 years, 11 months ago](https://wordpress.org/support/topic/layout-question-reverse-engineering-wordpress-to-learn-phpcss/#post-576730)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics