Name Mon Lu

Love jQuery/CSS

Blog about Webdev

Twitter supawaza

RSS Twitter Flickr

What I am up to:

    • According to @john_malone "Whiskey tastes like a fight about to break out" end quote. 2 days ago
    • totally overslept thanks to the excess coffee I drank and slept "pritty" late last night... running late! 2 days ago
    • More updates...

WordPress Admin Blank Page of Death

  • Posted by
  • October 27th, 2011
  • Comments Off

I had the plea­sure to expe­ri­ence that last night… again!  Last time it was a plu­gin…  this time is not.  After doing hours of search­ing… peo­ple said that some files maybe infected or the blog could be hacked. Well… that might not be the case. For mine, I recently did an upgrade to the lat­est ver­sion of wod­press, then come back days later the admin sec­tion is all blank – no mat­ter which url I typed.  Here are the symptoms:

  • The blog’s front-end is still work­ing fine, noth­ing seems out of place or broken
  • I got to the login screen, but as soon as I logged in, it was com­pletely blank
  • I could not access any of page in the admin such as by typ­ing: /wp-admin/plugins.php – all blank
Before going into crazy mode on try­ing to fig­ure out what’s going on with what I went through below… If you have sim­i­lar symp­toms like mine, just go to wor­press, down­load a new copy, down­load the bad /wp-admin/ copy, and upload the entire /wp-admin/.  Fixed it for me instantly.  But if you want to know what I had to went through before fig­ur­ing that easy solution…
Oh and before doing this, like I men­tioned above… instead of keep­ing your admin down and mess­ing with it live, I sug­gest down­load the bad copy of the /wp-admin/ locally, upload the brand new copy down­loaded from word­press and con­tinue the diag­no­sis locally.  If the new upload didn’t fix your word­press admin, then it prob­a­bly isn’t the same prob­lem. The rest of this won’t help you.
  1. I checked blog’s front-end and was still run­ning fine – checked if any page is bro­ken or funky stuff show­ing up on the pages.  A bro­ken plu­gin might have be the cul­prit or you sim­ply got hacked
  2. So far so good, noth­ing seems bro­ken or out of place. Login, page goes blank. I run the plu­gin Login Lock­down, so I FTP in and deleted the folder to see if that’s the cul­prit – nope. Put it back in.
  3. Checked the error log and see what threw error(s) recently – did the same thing above. No go.
  4. Found some peo­ple said that empty returns on functions.php or wp-config.php  in your theme can cause that – make sure no blank space on top or bottom…
  5. Some said check files for weird stuff got append on top of some php files – checked all files inside wp-admin folder – nope
  6. Fast for­ward 3 hours later – finally re-uploaded a new copy of the /wp-admin/ – fixed!  Son of a…
Final note:  if it got fixed, but you should at least try to find out which files and what caused it by going through Step 4 or 5 – you never know, you might have been infected.  I wasn’t, just a bad upgrade.
Hope that helps.

vim blank screen or ^M errors before starting

  • Posted by
  • April 16th, 2011
  • Comments Off

As I spent more time play­ing with VIM, I ran into this very sim­ple issue but took a while to find a solution.

Description

If you want to cus­tomize your VIM a bit more, you just have to cre­ate a .vimrc in the root. Even if you create/edit the .vimrc in VIM, bet­ter than Notepad right? NOT! Appar­ently, by default, VIM doesn’t set the file for­mat for you. So it leaves a “trail­ing ^M” and VIM doesn’t like that…

Symptoms

  • Win­dows: it shows a blank screen and has “Hit enter to type com­mand” or some­thing like that before VIM starts. It doesn’t show any errors.
  • Ubuntu (see screen­shot): it actu­ally dis­plays the fol­low­ing errors: “Invalid argu­ment on^M” OR “Trail­ing char­ac­ters ^M” OR “Not an edi­tor com­mand: ^M”

To fix this, it’s actu­ally pretty easy.

While in VIM and in com­mand mode type:

:set fileformat=unix

Of course the set­ting depends on your sys­tem, if you’re on Mac, set it to fileformat=mac. I set mine to unix because I use Git Bash and set it to use unix style, so if you are on Win­dows and set it to dos com­mands… set it to dos. Now you’re safe to edit .vimrc, when you :wq and vim again, the blank black screen (on Win­dows), and “Invalid edi­tor com­mands” should go away.

Coding on Steroids

  • Posted by
  • April 14th, 2011
  • Comments Off

2011 Overnight Web Challenge

  • Posted by
  • March 28th, 2011
  • Comments Off

Haven’t blogged for a long time, finally some­thing I feel proud of and feel like I’m at least +5 on un-deprived.

If you are in Min­nesota, or prob­a­bly heard about the annual Overnight Web Chal­lenge hosted by a group of  local gen­er­ous web agency: The Nerdery. Which was an event to redesign web­sites for local non-profits. I have to say at first I was very ner­vous about it, but I had a blast and learned a lot of things. So here are the details.

The goal

The goal of the chal­lenge is each team can have up to 10 peo­ple (strangers or friends), and each team will pair up with a non-profit cho­sen by The Nerdery. In 24 hours time we are to redesign and build a new web­site for our des­ig­nated local non-profit client.

Out­come

In my case, my team was Team Ven­ture – we were a mixed of for­mer and cur­rent co-workers. Not every­one knows every­one, but we bonded quickly. Our client was Some­place Safe. Even though we couldn’t fin­ish 100%, so we are still con­tin­u­ously work­ing on it and pro­vide sup­port in the next 6 months.

Before

After

Rules

Any­thing goes… PHP, Word­Press, Ruby, what­ever. We could even pre­pare codes ahead (in which I hope we can pre­pare bet­ter next year).

What we did and lessons learned

We chose Word­Press as our plat­form, the lessons I learned from it were:

  1. Don’t build any­thing from scratch if not nec­es­sary, frame­works, frame­works, and frameworks.
  2. Pre-installed plu­g­ins  – take them out if not needed. It’s eas­ier to remove than add
  3. List of jQuery com­po­nents, snip­pets to gen­er­ate Word­Press page con­tents (side­bars etc…)

I am totally going to do the chal­lenge again next year and because the win­ning team: TST Media pulled off some very amaz­ing stuff in one night, they’ve inspired me to push a lot harder than just using a Word­Press plat­form. So hope­fully I’ll start post­ing more updates on what this “push­ing harder” in the next few months.

Other than that, I encour­age all web nerds in MN to try this chal­lenge at least once. It’s thrilling, learn to work faster, and put our web nerdi­ness skills to use in a very mean­ing­ful way. Besides that, you get to meet maybe a Sen­a­tor such as Al Franken, and the Tronguy. Foods in every 3 hours, mas­sage, Yoga, live action Angry Birds and a whole lot more nerdy fun stuff.

Ubuntu/Kubuntu Broadcom 43xx Wireless Problem

  • Posted by
  • December 26th, 2010
  • Comments Off

I’m one of those peo­ple as long as I get my works done, I don’t care if I’m even run­ning on Win ME, and occa­sion­ally some peo­ple made fun of me as a “designer” I don’t use a Mac.  Well, actu­ally, I’m now offi­cially a front-end devel­oper and ex-designer, I can now say I can use what­ever to get my stuff done. Front-end devel­op­ers are “effi­cient” that way if you know what I mean :)  I was pok­ing around Xubuntu to revive my 6–7 years old VAIO, it’s still slow as hell after installed Kubuntu and I really want to learn to use a “nerdy” branded OS, so I now offi­cially announced my Vista HP Acer lap­top is now oper­at­ing under Ubuntu 10.10.

With all the hypes that how easy and fast Ubuntu is, I wasn’t really impress to be hon­est espe­cially the first thing didn’t work was the wire­less. Took me hours to fig­ure it out. Turned out that most peo­ple who have newer lap­tops and with a Broad­com brand wire­less card will have sim­i­lar issue due to the dri­ver wasn’t “install” or what­ever you call it prop­erly.  I finally fig­ured it out and these are the steps I took and worked both times after I installed a “test drive”, wiped, then full install:

Fire up the Ter­mi­nal (Ctrl + Alt + T), let’s do a lit­tle diag­no­sis first to see if you’re hav­ing the same issues and wire­less prob­lem I did.

sudo lshw -C Network

I’m a newb in as men­tioned, but I guess the above com­mand split out your net­work cards brands, set­tings and what not. Your wire­less should be the last group says some­thing like:

*-network DISABLED<br /> description: Wireless interface<br /> product: BMC4312 802.11b/g LP-PHY<br /> vendor: Broadcom Corporation<br /> ... then blah blah blah ...

So now you found out what’s your wire­less model is, write that down some­where. Then do a:

dmesg

Look for some­thing like:

[ 13.938268] brcm80211 0000:06:00.0: PCI INT A -> GSI 17 (level, low) -> IRQ 17<br /> [ 13.938276] brcm80211 0000:06:00.0: setting latency timer to 64<br /> [ 13.963989] brcm80211: fail to load firmware brcm/bcm43xx-0.fw<br /> [ 13.963993] brcm80211: Failed to find firmware usually in /lib/firmware/brcm<br /> [ 13.964046] brcm80211 0000:06:00.0: PCI INT A disabled<br /> [ 13.964060] brcm80211: wl_pci_probe: wl_attach failed!

Well there you go, that’s the prob­lem. The silly firmware/driver could not load. This is where I will send you to a page with all the good­ies that pretty much got me through. But before that, a few notes:

You will need a tool called b43-fwcutter. Jump to a com­puter with inter­net access and USB thumb drive and down­load the lat­est ver­sion (judg­ing by date on the right hand side), oh, since I’m just as newb, don’t ask me which blah_i36.deb or blah_amd64.deb to down­load. Just grab both. Both installs I did it pre­ferred one over and other, then vice versa *shrug*

Don’t unplug the USB thumb drive yet, now go to my ulti­mate wire­less prob­lem solv­ing page. Since we got the b43-fwcutter taken care of, you can go straight to step 2 and there should be a few files that you need to download.

I fol­lowed the instruc­tions up to step 3, step 4 didn’t work for me. So at that point I did just a good old sudo reboot, wait a few sec­onds, then lap­top now found my wire­less networks.

We’re not alone, there were TONS of peo­ple have wire­less prob­lems with Ubuntu – even one of my co-workers did not aware of this until his cousin told him and me, too. So if the above solu­tion didn’t work for you, here’s the rest of the wire­less doc­u­men­ta­tions for Ubuntu:

Ubuntu Wifi­Docs

I can only assume as long as you found out which dri­ver is miss­ing, and using dmesg to find out whether it’s loaded or not, the above should work the same. Good luck!

Git — get it running on a remote server in 5 steps… really the easy way — not kidding

  • Posted by
  • July 17th, 2010
  • Comments Off

Tread lightly when using Zimplit

  • Posted by
  • March 2nd, 2010
  • Comments Off

I love Zim­plit‘s sim­ple idea, and rel­a­tively easy to setup (depend­ing on server’s con­fig­u­ra­tions). But of course it comes with a head-scratcher. Here are what I learned:

1. Local­host Time­out Error

As many sane devel­oper would do, you want to test almost every­thing on a Local server if you’re using Xampp Lite. I have been expe­ri­enc­ing time­out error. Maybe it’s due to the fire­wall at work, but I am going to inves­ti­gate more using a full veri­son of the Xampp server

2. “public_html” vs “www” Folders

This may sounds crazy, but I think it might have some­thing to do with the con­fig­u­ra­tions of the server. I tried upload­ing to my own server, every­thing works fine. But I couldn’t get it work­ing on my client’s server, it couldn’t CHMOD prop­erly. Crazy enough, I deleted every­thing and re-uploaded every­thing to the public_html folder, CHMOD the proper files, then it worked… I know both fold­ers are basi­cally the same thing, but why it hap­pened the way it did, CRAZY! I tell you. So I’m going to try to repro­duce this “bug” if it is even a bug or just me…

3. jQuery + zim­plit = Site Explosion!

Unfor­tu­nately, today I found out zim­plit will blow up your some parts of your lay­out if you have some sorts of script­ing going on in the back­ground, such as slideshow, hid­den divs. As soon as you insert an editable area, it auto­mat­i­cally inserts its own div and classes inside ALL OF YOUR DIVs! Drove me insane for over an hour why my sim­ple page stopped work­ing with a sim­ple slideshow. I mean it’s not the end of the world, you just have to rework your CSS to fit it in. But it would be nice IF SOMEONE TOLD ME BEFOREHAND!!

Over­all, zim­plit is still an awe­some idea, but it’s quite intru­sive. It works well if you have a very sim­ple web­site or planned ahead to use it at the begin­ning. If you decide to imple­ment after­ward, it is much more dif­fi­cult because you’ll prob­a­bly have to rework lots of CSS. But I think I will try my hands on it again next time when I build a site from scratch.  Just my 2 cents.

Image maps within an image map

  • Posted by
  • February 19th, 2010
  • Comments Off

Multi-touch Web 3.0, anyone?

  • Posted by
  • January 8th, 2010
  • Comments Off

Haven’t wrote any­thing for a while, but here’s some food for ran­dom thoughts. With all the newest and great­est hit­ting web namely CSS3 and HTML5, how about giv­ing some love and thoughts to Multi-touch as the next big thing on the web, and prob­a­bly will be Web 3.0? Now you would say some­thing like, “Well, you know Mac­books have that awe­some fea­ture and peo­ple ARE using it on web­sites.” Well, can YOUR web­sites sup­port flip­ping objects around with 2 fin­gers? An inter­face to crop and edit pho­tos using your 2 fingers/hands on your web­site / web app? iPhone / Android phones can, but on web­sites? Nope.

First of all, I am one of those peo­ple who refused to support/buy any­thing with an “i” in front of it, it’s not that one day I wake up and decided to dis­like Macs. I owned an iPod before and I found myself almost throw­ing it against the wall. I have used Macs, and I can’t find myself lik­ing it as much as a PC. Don’t get me wrong, I don’t hate it, but I just pre­fer PC’s… that being said, the best thing Apple “invented” and poured so much thoughts into my brain is the lat­est and great­est the Multi-touch technology.

Where did I get the idea Multi-touch will be Web 3.0? Well, Javascript libraries such as jQuery, Mootools, Pro­to­type etc… changed the way peo­ple inter­act with web, and how it deliv­ered inter­ac­tiv­ity and infor­ma­tion to the users. Designers/developers don’t need to depend on Flash/Silverlight to have ani­ma­tions / effects, things load faster in the back­ground or don’t even have to reload a page thanks to AJAX. No longer the user has to open a new win­dow to see a pic­ture, instead, they can see them using a Light­box or sim­i­lar tool. I per­son­ally feel those are the most impor­tant ele­ments that dif­fer­en­ti­ate the good old web from Web 2.0. Some might argue Web 2.0 is all about the shiny graph­ics, but I beg to be dif­fered. Not only that, Multi-touch is already in smart phones and Apple already started it with their Mac­books / Magic Mouse, and Win­dows 7 with their own multi-touch inter­face. It’s only a mat­ter of time when all the web­sites don’t require a mouse to browse and adding more inter­ac­tiv­i­ties, because I don’t have to use a mouse to browse when I use my G1, why should a desk­top com­puter? The tools are already existed to get us there, the ques­tion is how soon. My guess? I’d say in a year.

To prove it, some cra­zies already made one of the world’s first Multi-touch web­site tak­ing advan­tage of Win­dows 7 multi-touch sup­port – of course it still works if you don’t have a fancy multi-touch screen or a Wac­com Bam­boo Touch (cost only $69 and works on both Macs and PCs – yes, even Win XP SP2).  Or a fancy Mac­book / Magic Mouse.

Silverpac Multi-Touch

Although, I don’t think I’ll trade my CSS/HTML skills for multi-touch mak­ing web­sites in Sil­verlight. That being said, I think I was look­ing at the future of the web and prob­a­bly some­thing that will “encour­age” CSS3.x / and HTML4.x to sup­port multi-touch sooner, max­i­mize and push the web even fur­ther? Can I already say Multi-Touch Web 3.0, anyone?

A slight prob­lem of course Multi-touch is quite new, not many peo­ple have the tools to inter­act, or the neces­sity for it for the web at least. Never mind that, not a lot of peo­ple get the use of it. Multi-touch took me a few sec­onds to fig­ure out how to use it, now that I know, “wowser” is the word I’m using to describe it. To me, the web is all about two words: infor­ma­tion and expe­ri­ence. As designers/developers are con­stantly find­ing bet­ter and cooler way to cre­ate web­sites and deliver infor­ma­tion, Mutli-touch is def­i­nitely the next big thing on the web.

I don’t know about you, but I’m jump­ing on the band­wagon to look for a way to “fake” a Web 2.5 for now and make Web 2.0 sounds so 2008 while peo­ple still dig­ging the glossy/shiny but­tons, and debate the best way to clear floats.

Photoshop Vector Shape -> Illustrator Compound Shape/Path…!!

  • Posted by
  • October 31st, 2009
  • Comments Off

You know… it’s prob­a­bly a silly real­iza­tion… but I’ve always copy & pasted vec­tor shape from Illus­tra­tor to Pho­to­shop, never the other way around. Today, I had to con­vert a shape that I wanted to use from Pho­to­shop to Illus­tra­tor (CS4 by the way), I was so sick of trac­ing it. I mean what’s the worst thing could hap­pened if I pasted some­thing a vec­tor shape from Pho­to­shop to Illus­tra­tor, right? Get an error some­thing, but to my sur­prise, it gives me a dia­logue ask­ing me whether I want to con­vert it to an Com­pound Shape or Path…

psd_paste_to_ai

…son of a… learn some­thing new every­day, don’t we now…? A lit­tle less deprived

« Older Entries