Matthew Vaccaro matthewvaccaro.com This presentation will be on slideShare* slideshare.net/mattyvac *soon-ish

Me

My website I sometimes update.

Credentials: Once held a microphone.

Where I

Basic Stuff we all know about WordPress

•  Was a blog

•  Still a blog platform, but now also a CMS! •  CMS = authoring, collaboration, administration without extensive

programming knowledge

Past Presentation Plug: “WordPress as a CMS” on slideShare.net

WordPress Part of a CMS is the ability to theme or ‘skin’ the system.

What is a child theme?

•  A theme is a collection of files and template that changes the look, feel,

and interaction of a website •  In WP: wp-content/themes

•  Child themes are an extension of a theme •  Child themes were introduced officially in WP 3.0 (technically available

before that in previous versions) •  Child themes allow you to extend or make changes to a theme without

modifying the core code and functions

Child Why use child themes? •  No direct edits to core code of parent theme •  Ease of replication •  No extensive knowledge of code necessary

Working With Themes

Creating •  Cheat with plugin (h#p://wordpress.org/extend/plugins/one-­‐click-­‐child-­‐theme/  )

OOORRRRR… •  Make your new theme folder in wp-content/themes

–  *-Child-Theme –  My-Parent-Theme gets My-Parent-Theme-Child-Theme

•  Add style.css file inside of new folder and link it to your main theme

•  Add new files if necessary

/*  Theme  Name:  College  of  Medicine  Main  Theme  Child  -­‐  Mini  Sites  Theme  URI:    DescripFon:  A  child  theme  for  the  UCF  College  of  Medicine  Mini  Sites.  Author:  JusFn  Sisley  &  Ma#hew  Vaccaro  Author  URL:  h#p://www.med.ucf.edu  Template:  UCF-­‐College-­‐of-­‐Medicine  Version:  0.0.1  */  

Switch to quick CT example…

Editing

•  Use the advanced editor in the WordPress control panel or use your own desktop program (SublimeText, DreamWeaver, Aptana Studio, Eclipse…or Notepad)

–  When using the WP CP editor, make sure permissions are correct –  Local development is best! GitHub! MAMP/WAMP! Yay!

–  FTP into your server to make edits in real-time (Not recommended) L

•  Edit your CSS file to make overriding changes to the main CSS file •  Edit your functions.php file which is loaded in addition to the main functions.php

file. Does not override. •  Add additional files or make edits to previously added files to increase functionality

Working With Themes

Working With Themes

99 Problems, but…just kidding. Only one issue to look out for:

•  ”I want to pull information from other blogs in my network!”

–  To do this, you would use switch_to_blog(); –  Watch performance. Look at the information you are pulling and decide if your server can handle it.

•  Switch_to_blog(); switches to another specified blog for the duration of the function call until restore_current_blog(); is called

•  More Info: http://codex.wordpress.org/WPMU_Functions/switch_to_blog

Basic CSS is…

A cascading style sheet. A sheet of styles, of you will.

•  Allows design elements to be changed

•  Styles within CSS areas define how to display HTML elements •  Images, fonts, structural elements

•  Colors, font faces, spacing, heights, floats •  Added to spec with HTML 4.0 long ago

Types of CSS

External – Internal – Inline

External: File called something.css on the server linked to the theme Internal: <style> tag places somewhere in the code

Inline: style=“” code placed somewhere inside other code

Switch to CSS example…

(Just kidding though, we’re only going to do a little CSS)

Basic Be nice to your CSS.

•  Follow WP styles

–  Makes it easier for future edits or others who may see the code later –  Review the main WP stylesheet to see common conventions and style groupings if you don’t already

have set standards for your site

Example:

.element-­‐class  {    margin:  20px  0px  10px  0px;  

}  

.element-­‐class  {    margin:  20px  0  10px  0;  

}  

NO!   YES!  

In  the  correct  example,  the  ‘0’  values  aren’t  followed  by  ‘px’.  This  follows  the  same  convenFons  as  the  master  

file.  

 (The End)