Completing Your Design with WordPress
Upcoming SlideShare
Loading in...5
×
 

Completing Your Design with WordPress

on

  • 1,007 views

 

Statistics

Views

Total Views
1,007
Views on SlideShare
1,000
Embed Views
7

Actions

Likes
0
Downloads
8
Comments
0

3 Embeds 7

http://www.linkedin.com 5
http://www.slideshare.net 1
https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Completing Your Design with WordPress Completing Your Design with WordPress Presentation Transcript

  • Completing Your Design with WordPress or why coding your own designs shouldn’t be scary
  • Can’t I Hire Someone To Do This? if you trust them enough.
  • But I’m a Right-Brain person. XHTML and CSS were built for designers It’s all about the look XHTML and CSS are tools, not programming languages No algorithms and calculations
  • XHTML BASICS XHTML tags give content structure opens the div <div> This is content inside the div tag. The next line closes the head tag with a / </div> closes the div
  • ITS A BOX. opens the div <div> This is content inside the div tag. </div> closes the div
  • Tags with Properties We can add properties to tags. We can use properties to name each box. <div id=”sidebar”> <div id=”main”> This is content inside a div This is content inside a div with an id of with an id of main. sidebar. </div> </div>
  • THE CODE
  • CSS BASICS HTML indicates structure. CSS indicates look & feel. Typography Color Size Placement Spacing
  • CSS BASICS object { property: value; property: value; } #sidebar { color: red } finds an object with an ID of sidebar and makes the text color red
  • CSS BASICS #sidebar { color: red } <div id=”sidebar”> <div id=”main”> This is content inside a div This is content inside a div with an id of with an id of main. sidebar. </div> </div>
  • THE CODE
  • TEMPLATES Each template controls a di erent part of the site page.php controls the look of regular pages index.php controls the look of of the homepage/unspecified templates single.php controls the look of of single posts
  • TEMPLATE HIERARCHY http://codex.wordpress.org/Template_Hierarchy
  • TEMPLATE TAGS Placeholders for dynamic pieces of content. http://codex.wordpress.org/Template_Tags <div id=”sidebar”> <div id=”main”> <?php get_sidebar(); ?> <?php the_content(); ?> </div> </div>
  • CHELSEA OTAKAN @chexee anythingwonderful.net