WordPress – Page 3 – Sara Cannon

April 20, 2011

Bham WordPress Meetup Group: Custom Post Types & Taxonomies

We had a great turn out for the Birmingham WordPress Meetup Group evening on Custom Post Types & Taxonomies.
Chris Reding (@creding) not only took us through registering your post type, but why you should use it, and the power and control that you can give the user beyond a post or a page. See his slides below:

Custom post-types & taxonomies

View more presentations from Christopher Reding

Next, Bill Robbins (@billrobbins) shared with us the practical application of CPT's on the front end. He took us through how we can display our CPT's and dynamically query from our data using conditional goodness. Check out his slides below:

Custom Post Types--Front End

View more presentations from Bill Robbins

Overall, it was a great turn out with enthusiastic WordPresser's. We hope to have more meetings coming up. Sign Up Here if you want to be in the loop and know about upcoming WordPress events in Birmingham!

April 18, 2011

CSS3 Columns in WordPress after a Certain Word Count

I've been using CSS3 Columns for various purposes lately. I've been really loving it. Especially how easy it is to manipulate from 3 to 2 or 1 count with media queries. More on that stuff later. The purpose of this post is mainly to share with you (and document) how to use this in WordPress and only when your content is over a certain length. (what is the point of having three columns if there only one to three lines each?!)

first of all: make sure you have your CSS3 columns setup for the first div class:

[code]
.article-col{
-moz-column-count: 3;
-moz-column-gap: 40px;
-moz-column-rule: none;
-webkit-column-count: 3;
-webkit-column-gap: 30px;
-webkit-column-rule: none;
column-count: 3;
column-gap: 40px;
column-rule: none;
}
[/code]

and then here is how you explode your the_content(); - get your word count - and then change the div class depending on the limit.

[code]
ob_start();
the_content();
$content = ob_get_clean();
$numWords = sizeof(explode(" ", $content));
$limit = 100;

if( $numWords > $limit ){

echo '<div class="article-col">';
}
else {
echo '<div>';
}

the_content(); ?>
[/code]

your $limit can be set to whatever your design is comfortable with. also, you can class that second div with something else (you can do something creative like change the div from two col to three col depending on the word count.)

More on css3 columns:
http://www.alistapart.com/articles/css3multicolumn/

Love and use this to make it work in IE:
http://www.csscripting.com/css-multi-column/

Thanks @joncave and @petemall for brainstorming this a bit with me.
sara

February 24, 2011

WordPress 3.1 is Out! Upgrade!!!

WordPress 3.1 is out! Upgrade! I'm so proud of being involved in this cycle. I was able to get involved in the UI Group and contribute this time around. If you've upgraded, go to your user and hit the blue admin theme! you'll see my contribution: a fresh new light blue upgrade. :) I feel so privileged that I was able to work with the UI group to make this change. It feels so good to be able to contribute back to the incredible platform that I love so much.

blue admin

While there are many awesome new features in WordPress 3.1 (you can read the post from Matt here) one of my favorites is internal linking.

Here is an awesome video made by Jon Cave that illustrates the process.

Road to WordPress 3.1 from Jon on Vimeo.

Thank You to everyone who helps make WordPress better!!!
sara

January 12, 2011

2010 – the year of WordPress

2010 has been an incredible year. It had its ups and downs. some parts were really hard and others just joyous! I've met some incredible people this year and got plugged into a great community that surrounds the very platform that this blog (and my livelihood) is based on: WordPress. Its been quite the journey. I've stumbled into great opportunities that led me to go many places and meet many new friends.

1/8-9 - WordCamp Atlanta

(Post on my talk: WordPress and Your Brand)

5/1-2 - WordCamp San Francisco

(I just went to this one: Recap Post1, Post2)

8/20-22 - WordCamp Savannah

(Post on my talk: Customizing WordPress themes / Child Themes)

9/18-19 - WordCamp Birmingham

(Post on my talk: Beyond the System Font: Advanced Web Typography) Other Post

10/16-17 - WordCamp NYC

(Post on my talk: Typography and Your Theme)

In conclusion: 2010 rocked my WordPress world. Thank you to everyone who has mentored me and guided me in the word of WordPress. And, absolute special thanks to those who contribute in any way to the release and improvement of this incredible software. - sara

December 15, 2010

For The Love of WordCamp / Speaking at WordCamp Phoenix

Over the past year and a half, I've dived into the WordPress community and have attended/spoke at various WordCamps. I am just so thrilled to be a part of this incredible community and even more thrilled that I get to share what I have learned and learn from others who are sharing. Growing with WordPress can't get better than this. The people that attend and speak at WordCamps are incredibly talented and I feel so blessed to meet, learn from, and help them in whatever way I can.

Some of these people I have gotten to know at various WordCamps over the past year and can truly call them my friends. Thank You! You know who you are! I'm looking forward to making more friends in the years to come in this incredible community.

If you haven't been to a WordCamp, you should go. Talk to the people around you - see what they are working on. You might could help them with a problem and they might could help you. I guarantee you wont regret it. Also, If I happen to be there, say hi to me! ;)

WordCamp Phoenix

This January I get the awesome privilege of not only attending but speaking at WordCamp Phoenix. There is an absolutely incredible lineup of speakers and an awesome all-day design track. (I almost cried when I heard about this!) I can not wait. I will be speaking on CSS Tips. Come out to my talk if you are going! Here's the general lowdown:

CSS Tips

You've installed WordPress, everything is working how you want it to, you might have installed a custom theme or even your own theme, and now you're looking for something to either really make it stand out, or professionally refined. I have some CSS tips for you. From the real simple to the intense - designers and developers of all levels will walk away with something they can use. Here are some general topics we will be covering:

- CSS and WordPress
We all absolutely love WordPress - that's why we are here. (if you don't, come see me after) In this segment, we'll take a look at some CSS tips that directly apply to the use of our incredible platform. We'll be looking at different ways to refine the front end - take a peek at some great WordPress site examples and inspiration - and go over some practical demos.

- CSS3
CSS3 is here and it can not be ignored! Yes we want some consistency in our site across all browsers, but there's nothing wrong with taking a wonderful design that works everywhere and adding in some subtle CSS3 pizazz. What a treat for users with updated browsers! We'll also address some tips on "faking it" in older browsers and fallback.

- Simple Takeaways
Think you know everything? We'll blast through simple CSS takeaways. You'll probably end up using something in this list, or be reminded of things that you already know but are not currently utilizing.

If anyone has any particular tip that they would like me to include in my presentation, send them my way! Also, Thank you to the wonderful organizers at WCPHX as well as the sponsors! I can't wait.

October 16, 2010

Slides from WordCamp NYC “Typography and Your Theme”

Thanks to everyone who came out to my session at WordCamp NYC! I've uploaded my slides to slideshare for you to view. Please feel free to leave comments or even just let me know what your favorite webfont is!

Type in your WordPress Themes by Sara Cannon WordCamp NYC

View more presentations from Sara Cannon.

October 15, 2010

Speaking at WordCamp NYC!

I'm so excited for WordCamp NYC this weekend! There are going to be so many talented people there it is almost overwhelming! I feel so honored to be speaking amongst this incredible lineup. If you're going, come see me speak about Typography and Your Theme. If you live in NYC or just want to come to these other incredible sessions: All you need to do is Register for WCNYC today. Make sure to find me and tell me hello! :) Here is my session description:

Typography and Your Theme:

Believe it or not, generally WordPress sites are made up mostly of typography. This makes the relationship that these typographical elements have to each other very important. The New WordPress 3.0 default theme Twenty Ten has incredible typographical elements. In this talk I will be using a child of Twenty Ten as an example of customizing the theme’s typography. I will be going over how to plan these typographical elements out, their style and color, how to make a site/brand guideline for your Twenty Ten child theme to keep consistency, what different services to look at for your non-system fonts, typographical CSS tips and tricks, and how to account for every little detail and make sure no type element goes un-styled!

August 20, 2010

Speaking at WordCamp Savannah

I'm really excited to have the awesome privilege of speaking at WordCamp Savannah. The line up of speakers is incredible. Everyone should come out because it is going to be awesome! Here is a description of my session:

Designing Custom Themes / Child Themes

Interested in customizing themes to fit your needs and design? We'll be using the new default WordPress theme Twentyten as a base for looking at best practices and how to's for theme customization. We will demonstrate how to make a child theme and what are some good standard practices that you should know to keep your new theme healthy and update-able in order to save you time as well as keep it relevant in the future.

Make sure to say hi to me if you're there!

July 6, 2010

WordPress Tip: Centering the Main Menu in the Twentyten Theme

twentyten

Hello WordPress users! All of y'all know about the stunning new default theme "twentyten" that comes with the new WordPress 3.0 release. I've been working with that theme a lot through child themeing.

If you ever run into a problem/question with customizing your theme or CSS, you can always search the WordPress Codex or Forums - most likely there will have been someone else who has encountered the same or similar problem. Don't be afraid to chime in whenever you think you can help out. Most likely there are people on the forums that know less than you do that you can help out.

Centering the Main Menu in the Twentyten Theme:

By default, the twentyten menu normally floats left. if you want a centered menu, you can change your css style sheet.

[code]

/* =Menu
-------------------------------------------------------------- */

#access {
background: #000;
margin: 0 auto;
width: 940px;
display:block;
float:left;
}

[/code]

The above is a segment from the default css in twentyten. You need to take out the "float: left;" and add in "position:absolute; text-align:center;" then add a new line of "#access ul {display:inline-block;}" This will change it to the following:

[code]

/* =Menu
-------------------------------------------------------------- */

#access {
background: #000;
margin: 0 auto;
width: 940px;
display:block;
position:absolute;
text-align:center;
}

#access ul{display:inline-block;}

[/code]

Hope you enjoyed this tip. And remember always: WordPress is for lovers.
-sara

Edit: forgot to add: Make sure you include an IE fix!

put this in its own little ie.css file and conditional comment it into your header. :)

[code]
#access ul{
display:inline;
zoom:1;
}
[/code]

June 28, 2010

Adding Nav Menu Functions to Your Theme in WordPress 3.0

Nav Menu Function for WordPress 3.0 - add to theme

Here is the Admin of my implementation of the Nav Menu Function added to Servants For Haiti

As many of you already know, WordPress has just released their latest version WordPress 3.0. If your site runs on WordPress and you haven't already, Update Your Blog. If you aren't running on WordPress, this is the best time to give it a shot. You will not be disappointed. They have added so many new features and improved old ones, it is truly incredible.

One of the features they have added is the ability to have Navigation Menu function control in the admin panel. No more coding in what pages to exclude in the menu! No more downloading plug-ins to sort the menu for you!

One thing: you have to retro-fit your old themes to allow this function. (and don't forget to code it in to any new theme releases!) Here is how you do it:

1. open to your theme's functions.php
2. add this line of code in there:

add_theme_support( 'menus' );

3. open your theme's header.php (typically where your main menu will be) and replace your previous menu code

which is typically something like:

<?php wp_list_pages($args); ?>

with:

<?php wp_nav_menu($args); ?>

Check out the codex for the different parameters you can include in your wp_nav_menu( ) here: http://codex.wordpress.org/Function_Reference/wp_nav_menu

newbie note: $args should be empty or filled with parameters from the codex.