Theming Theming and Lifestreaming: WordCampNYC2009

My badge is tired, and so am I.

My badge is tired, and so am I.

WordPress, the blogging/content management software with which you’re viewing this blog unless I change my mind, had a big convention on November 14th and 15th at Baruch College’s Vertical Building. The people who designed the Vertical Building were very thoughtful. They knew that bloggers sit at a desk so much of the time and rarely get enough exercise, so they built elevators that only go to the third, fifth and eleventh floors and the escalators weren’t working that weekend at all. And since events were taking place on several different floors, often within minutes of each other, we had plenty of opportunity to move.

But even though the building had a learning curve, attendees were enthusiastic about pursuing more info on our favorite tracks. Mine were “Blogger” and “Beginning Developer” and I zoned in on everything about Themes, including:

  • Daisy Olsen and Adria Richards, who were informative and proved that I’m not the only woman who likes to make a cartoon of herself.
  • Allan Cole, who had a funny presentation on Parent/Child Themes, something I didn’t even know about and one that may ultimately solve my “customization” issues: The parent theme gives you the framework and the PHP code, and then you adapt the CSS to your own nefarious ends. (This is, of course, dependent on my having the patience to figure out CSS to begin with.)
  • Jim Doran, who does the websites for Johns Hopkins, and showed us how to make Javascript easy with jQuery, and answered the question “Oh, so that’s what happened with Javascript since the last time I learned it and never used it.”

Towards the end of Day Two I was saying to myself, “Okay, enough with the theming; six months from now you’ll be kicking yourself for not having sat in on some of these other great topics.” So I went to a presentation on podcasting and when I got there, the guy was talking about theming.

The conference finished in the auditorium, so we didn’t have to run from place to place but I think that’s where I picked up a bad cold despite copious applications of free hand sanitizer, courtesy of Microsoft.

Some random stuff:

  • The winner of a plug-in contest was “Conversation Prompter,” which “allows you to prompt your readers to comment by asking them to answer a question specific to that post;”
  • There’s a WYSIWYG application called “Elastic” being developed that will make designing WordPress themes even more like using Dreamweaver;
  • The guys at the Genius Bar showed me that I was smarter than I’d thought, or at least they ran through the same steps that I had when troubleshooting my problem;
  • There was free cheese.

And I enjoyed Erin Blaskie‘s “Lifestreaming” presentation. The name makes it sound like the latest in New Age self-help, but it’s really just having this “You Central” that unites your blog, Facebook, LinkedIn, Twitter and videos in one place. It’s a narcissist’s dream, and my New Year’s Resolution for 2010.

Mrs. Blandings Builds Her Dreamblog

Mr. Blandings Builds His Dream House

Now that the blog is up and running, I have a few ideas for making it look better.

First off, I’d like the banner to go straight across the top of the page, with a 3-pixel rule across the top and the bottom. Then, I’d like to pick a different blue, somewhere between a sky-blue and a robins-egg blue. And then I’d like to employ the “Bevel and Emboss” feature in Photoshop so that the banner stands out in a sort of mock 3D. And then I think I’d like to drop-shadow the sidebar, and put a margin on either side of the content so that it’s centered between the left of the screen and the sidebar.

Oh yeah, and fix the code so that the comments show up. But that part is no fun.

Yay!!!

Thanks to all of you who pointed out that I had forgotten to specify the size of my banner in the CSS. I added the width and height…and then had no head at all. And then I rechecked and saw that I’d forgotten to put a semi-colon at the end of each line.

Sometimes it’s as simple as that.

Debugging the Code

My code has gone Perquackey

My code has gone Perquackey

When you download a WordPress theme and open it up, there’s this stuff that explodes in your face and kills you. No, wait…that’s the inside of a golf ball.

What’s inside a WordPress theme is a bunch of little files with the extension .php, except for a file that says “styles.css” and which, if you have any version of Dreamweaver installed on your computer whatsoever, will automatically launch it whether you want it to or not.

The “.php” is what makes a blog a blog and not a static Web site. It’s an interactive scripting language. I have a nodding familiarity with HTML and CSS, having designed sites before, but as far as my knowledge of PHP, I feel like I’m reading Martian folk songs.

In order to get the site up and running with at least a scintilla of that “Personal Branding” that’s so important today, I figured there are two things I basically know how to do:

  1. Change the header picture in the default theme to my banner, and
  2. Tweak the colors through the CSS file to match the blue of my logo.

These things being done, I now have lovely blue headings and half-a-head, which is better than none. Firefox, my fave-rave browser, has a plug-in called Firebug that opens a little window at the bottom of your screen and lets you take a look at the code for that site. This is great if you want to see how somebody built something and you want to…uh…borrow their code, which will inevitably be a Flash file and won’t show anything.

What Firebug is showing me on my site is some code I didn’t write and didn’t remember seeing in any of the little files. For example, the #header has a bunch of lines that start with “Moz,” which I see stands for Mozilla, and it also says:

background: transparent url(Images/banner2.gif) no-repeat scroll center bottom

And what I’d written was:

background: url(‘Images/banner2.gif’) no-repeat bottom center

So, does WordPress rewrite your code? Why would it do that? Or is this a thing that this particular browser does, the way older versions of IE have those weird exceptions?

Another thing is that I have a ghosted “Desktop Icon” at the upper-left-hand corner next to my banner. I selected it and chose “Inspect Element” and saw this in the Firebug screen, under the HTML tab:

<a href=”http://melindabrunonyc.com/>Desktop Icon</a>

I’m going to go out on a limb here and say that this is something that WordPress sticks in there to automatically pull in the name of whatever you’re calling your blog, plus give you a link back to the main page of the blog.

I’ve been asking around if anyone can figure anything out, but most people I know who build Web sites aren’t familiar with PHP and then they look at me like I’m singing Martian folk songs. Besides, I don’t think it’s in the PHP. I think I’m missing something in the CSS that’s overriding what I’ve put there, or missing a piece of CSS code somewhere. Hey, I’m perfect, but it happens.

So I’m putting out there for your feedback: Put on your magic Firebug glasses and take a look. It’s probably something forehead-smackingly simple, except if it’s not.