Creating a WordPress Theme

  • I am trying to edit a WordPress theme to look like my site but I am finding it very difficult so I want to create a theme from scratch.

    Am I correct that themes contain .php files for the WprdPress functionality and CSS for the style and layout? If I want to create a WP theme do I first create the page in HTML with CSS for the structure and the styling, then add the WordPress .php files to it after it is created.

    If I know HTML and CSS will that allow me to create a theme or do I need to know .php too? Please help me understand the basic theory behind what it takes to create a theme?

    Sorry for the stupid questions.

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

  • Am I correct that themes contain .php files for the WprdPress functionality and CSS for the style and layout?

    Yes, the php files are called the templates. It’s actually the combination of the php and style.css that defines your layout.

    If I know HTML and CSS will that allow me to create a theme or do I need to know .php too? Please help me understand the basic theory behind what it takes to create a theme?

    Knowledge of xhtml and css is mandatory for creating a theme, the php code can be copied from the codex (for basic functionality – if you need some custom code, php knowledge might come in handy).

    Peter

    The way I went about it is to mess with someone else’s theme enough that I understood what everything was doing…. once I figured out what WP php code did what, where it went, and how to totally customize a theme (understanding what does what), then I went on to make my own themes….

    Thread Starter Paint Guy

    (@paint-guy)

    Thanks to both of you for your reply’s. I think I understand more of what is involved now.

    So to help me visualize this, the CSS file drives the basic look of the background colors and the layout and the .php file drive the look of the elements that sit on top of the CSS (the elements that can be edited in WordPress such as the title, the blog entries etc?)

    So if I understand this correctly, I could create a new .CSS file to match my website. with a:

    ? black header
    ? white body
    ? white sidebar
    ? black footer

    Then save the .CSS file over the themes .CSS file. I would then have a basis from which I could work from, then I could go about editing the .php files (index.php, header.php, sidebar.php, body.php and footer.php) to match the style of my new CSS background. Would this work and is this a good way to go about it?

    the CSS file drives the basic look of the background colors and the layout and the .php file drive the look of the elements that sit on top of the CSS

    The other way around: you define blocks (elements), and position and style them with css. So you define your header in the template, and how it looks is styled in the stylesheet.

    You could use the same template (xhtml) with different stylesheets and the look would be totally different.

    Peter

    .

    Thread Starter Paint Guy

    (@paint-guy)

    OK, I still don’t understand this but i am reading up on it so I don’t make too much of a fool of myself.

    1) I am going to just change an existing WPP them for now, so do you think it is a good idea to learn CSS first before .php if you want to change the look of a template?

    2) pboosten, you said you define the block (elements), and position and style them with css. I read some more on this. If I want a 2 column WP theme then most of them should have the same block elements (header.php, index.php, sidebar.php and footer.php) shouldn’t they? So it would just be a matter of changing the CSS to style the page because the block elements would be in the same position.

    1: yes, better to learn some css

    2: php files != elements

    Your page could be structured like this:

    <body>
<div id="page">
  <div id="header">
    header stuff goes here
  </div>
  <div id="content">
    <div id="items">
      <div class="post">
        post stuff
      </div>
      <div class="post">
        post stuff
      </div>
    </div> <!-- items -->
    <div id="sidebar">
      sidebar stuff
    </div> <!-- sidebar -->
  </div> <!-- content -->
  <div id="footer">
    footer stuff
  </div>
</div> <!-- page -->
</body>

    How the above maps to the different php files, is kinda defined in the programming standard, however you’re free to do it differently (in fact, you just need an index.php and style.css for a valid theme).

    The above shows raw, unstyled content, and the layout, colors, font sizes, font type, and more will be defined in the stylesheet.

    Hope this helps a bit. I think you’ll have some reading to do.

    Peter

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Creating a WordPress Theme’ is closed to new replies.