Work

Get Category Slug of The Post in WordPress

wordpress code 

I wanted to get the category slug for the current post but calls like single_cat_title() were not usable:

  • Return null unless you are on a category page
  • Can’t get to the slug string

If each of your post has only 1 category, this is the solution:

global $post;
$categories = get_the_category($post->ID);
$post_cat_slug = $categories[0]->slug;

Explanation by line:
/* get current post info */
/* get the category list for this post */
/* get slug for the 1st category */

To get a cleaner code, I put it in my functions.php and called from my template file.

Customized Global Variables for WordPress

customized global variable, wordpress 

Wanted to have one place for certain set of value in my WP site, after many failures, found this to be the easiest way.

In functions.php, define and initialize a variable:

$GLOBALS['your_var'] = 42;

To access the variable in a template file (between php tags):

echo $GLOBALS['your_var']

Best CSS3 Drop Down Menu Tutorial

css3, drop down menu, modernizer, html5 shiv 

Avoided drop down menu for a long time since many didn’t work right. Now I found many good sites to get a ready-to-go CSS style for it. However, I needed to know what’s going on under the hood, easier on me during debugging.

I learn coding by trying things out in stages and found the tutorial on CSS Menu Maker to be most clear.

As it stated at the end, IE8 doesn’t get it. Since my page is in HTML5, I added a javascript from Modernizer first.

Now I have a nice navigation bar but two more things still didn’t work in IE8 :

  • The rounded corner
  • The shadow for the hover state

I didn’t waste time to fix the rounded corner but the hover state in the submenu has to be fixed. Visitors need to see a reaction to their action.

So, I added a darker background for the submenu items for the hover state at the end of the stylesheet. The /9 is a hack for IE8 and below. Be sure to replace “color” with your own hex code.

.menu li ul a:hover {
background: #color\9;
}

Safari Above IE?!

Safari, IE 

Safari tops IE in site visitsI couldn’t believe my eye when I saw this today.

Doing a web site redesign for a client, checking to see how HTML5 and CSS3 I can get with her customers. It was shocking what I pulled up in the Analytics.

And no, they are not all from iPhone/iPad.

Wow, just can’t get over it…

Pi-Ling Chang Redesign

logo, business card, tote bag, stamp 

Pi-Ling Chang has been a piano and flute instructor for many years, before I learned to design. The first time I made her business cards is only because I was better at using computer than she was. The second version came when I was still a student.

Pi-Ling Chang private piano and flute instructor, business cardNow Pi-Ling and I both have many more years of experiences under our belts, our ideas also have grown. With the vision of expansion, Pi-Ling asked for a new design that can be used on different medium, for branding and for practical uses.

When she asked me to use bright colors in the design, I was excited. It’s like we both are ready to take a big chance. We settled on a golden yellow and navy blue. A combination that is eye-catching yet classy enough to go with classical music.

Pi-Ling Chang private piano and flute instructor, custom stampOne of her request was a custom stamp so she could put her information on the assignment notebooks for her students. After much researching, I selected Master Mark instead of the chain office supply stores. This was my first design for self-inking stamp, I need a vendor who can answer my questions and they were very helpful in explaining on how to get a good imprint. You can’t get this from the clarks at the chain office supplies stores.

Pi-Ling Chang private piano and flute instructor, student tote bagThe biggest project is the tote bags for her students. With lead scare in the reusable bags out there, we went with Enviro Tote, their bags are made in the US and so are the materials. They were clear on how the design will look after the silkscreening and taught me how to redo the design to get the best result. As you can see from the photo, the logo came out clean with even coverage.

Collaborating with Pi-Ling was fun and inspiring. That must be how her students feel about her lessons. I wish her the best in this new stage of her career!

OkiData / InDesign Mystery Solved

indesign cs3, okidata, booklet printing 

After much experimenting on my Mysterious InDesign Okidata Issue for printing in booklet format. I finally solved the missing letters/numbers (printed out as crossed rectangles).

The problem only happens when I print only odd or even pages. So, if your printer can do duplex printing, you should be able to print straight from InDesign.

The solution:

  1. print booklet format to a PDF
  2. make a file with even pages only
  3. make another file with odd pages only
  4. print the Even file, flip the stack, print the Odd file

Mysterious InDesign Okidata Issue

indesign cs3, okidata, booklet printing 

This is my first time making planner for my families and friends, just when I am comfortable enough to make one for sale, the 2nd half of my print out (using booklet printing) from Okidata color printer came out with crossed out rectangles instead of actual letters.

I tried making it into PDF, make a new InDesign (CS3) file, those didn’t work. Printing a few pages at the time is not really an option, since I need to print it out in booklet formate. It works when I print through a different but b/w printer.

I called Okidata, the patient and funny engineer (thank you, Dennis) determined that my file is somehow corrupted. So, I am back to square one. Glad I don’t have to buy a new printer though, this one has been working very well for me.

If that still doesn’t work, I might have to rearrange the pages myself for booklet format. Ah, being old school builds character.

Increase WP Upload Limit

wordpress, lunarpages 

A new client requested for a site where he will be uploading large number of photos and video but still want to use WordPress as the base of his site. But I’ve always seen the 2MB limit in the WP’s Media upload page and that will not work even with a short video.

I’m not sure how other hosts deal with this, but Lunarpages made it relatively easy.

It turned out to be a pretty easy fix:

1. In the root of your WP directory, find or create a php.ini file, then add this two lines: (? is the new limits you want to set)

upload_max_filesize = ?M
post_max_size = ?M

2. In your home directory (above your public web directories), find the .htaccess file, point the directory to where your php.ini file is in step 1:

suPHP_ConfigPath /home/yourUserName/public_html/yourWP_root

(remember to replace yourUserName and yourWP_root [might be blank if you installed it as the root])

Notes:

  • If you’re not hosted by Lunarpages, you should check with your own host for a solution.
  • Make sure you only use text editor to change the 2 files I mentioned here. For Mac: BBEdit/TextEdit. For PC: Notepad
  • Always save a copy before you change these files
  • If you don’t know how to see hidden file on your computer (like .htaccess), go here for Mac: via Terminal; via Finder Window, here for PC