WordPress experience and IE pains

It has been an interesting couple of weeks. Nelson has set me up with subversion and given me a quick run down of what it can do for me. It is used at Dashboard, but all I have ever done with it is commit and update work. By using version control, I will not have to make various copies of my files to refer back to as I test and make changes to my code. The key is to commit often and if one of my pages suddenly breaks, I can immediately go back to the last working version to compare the changes. This would have come in handy last night when I was making changes to my portfolio site. I must not have uploaded a file or something got changed right before I uploaded the file, but suddenly my site was broken when it was perfectly fine 10 minutes earlier. Version control in this case would have been handy because I knew that I had not made many changes to my code. Running it through the trusty W3C Validator helped me fix the problem in this case, and it was a strange problem – I was suddenly missing closing tags in areas that I had not even touched. I’m looking forward to working with SVN as I think it will make my life a whole lot easier.

Ever since Dashboard, I have also been using IE Tester (and Adobe Browser Labs). As I am looking for more work, I noticed a freelance position with a requirement for making sites work in IE6. I have tested my portfolio site in a number of major browsers, and ever since I employed sIFR, my site worked fine in each of those browsers. I had not tested it in IE6 however, so this weekend I decided to check it out. It was not as horrific as I had feared. I did have to apply the unitPNG and the only other problems I experienced were:

  • Position:Fixed, which I found a work-around for using conditional comments and Microsoft proprietary CSS Expressions. The snippet of code I found was:
    #divFixed {
    position: absolute;
    top: expression(0+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');
    left: expression(0+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');}
    }

    The problem is that the fixed element is jittery when you scroll, though I have read that if you have a fixed background image on the body element the jittering is removed.
  • JavaScript on my home page, which I still need to work on. I have 3 boxes (divs) which when clicked, flips over and opens to a box that is the width of my container. In IE6 it looks like the JavaScript calculation of the width is not being understood properly and when the div flips over, it only expands to the width of the original div. I’m not certain if this behaviour could also be caused by employing the untilPNG fix. Like I said, I need to play around with the code to figure it out.
  • Less complicated was the need for heights as IE6 (and 7) does not understand line-height

A few other things I had come across when fixing up my site included:

  • Improper use of the PHP readfile function. On my portfolio page, I was echoing @readfile, which not only outputs the file being read, but also included numbers. The readfile function reads the file but the return value is the number of bytes of the file which means by echoing readfile, it will return the bytes (the numbers that were showing up each file being read). The at sign (@) I used is an error control operator. I’ve prepended it to readfile so that any error messages that might be generated by that expression will be ignored.
  • Choppy scrolling on my portfolio page, which I’ve decided to ignore for now. I’ve done some research and this behaviour is partially a FireFox bug (this does not happen in the other major browsers) and according to my husband, this is also a computer hardware issue. Some of the non guaranteed fixes include not having a large background image (this does help a little as I tested by removing my tiled background, but it does not fully eliminate the choppiness), having the background image in a fixed position, not resizing images (I tried this as well, but this did not make any difference), and the method that seemed to work for best for people involved locating the userContent-example.css within the chrome folder (mine is located at F:\Internet\Firefox\defaults\profile\chrome), saving the file as userContent.css and changing the code to
    /* Smooth Scrolling: Disable Fixed Background Images */
    body {
    background-attachment: scroll !important;
    }

    I didn’t like this solution because this method would fix the scrolling issue for me, but not for anyone else viewing my site using FireFox for Windows. The other suggestion, which I am not keen on for the same reason is reinstalling Flash.

The other thing I have been working on is building a site using WordPress. I was given an uncomplicated layout. I basically searched for a template as close to the design as possible and modified the various PHP templates and the CSS. That part is fairly easy. I also implemented a jQuery gallery, which was also uncomplicated. The more challenging stuff for me was deciphering and learning the WordPress functions. I’ve managed ok, especially once I learned that pages are also considered posts; however, I need to sort out the function. It only works on the home page right now. Also, is there a function or do I need to use JavaScript?

So this is what has been keeping me from writing over the last couple of weeks. I will try to play catch up today.

3 Comments
  • vivien
    July 23, 2010

    Thanks Jaime. Now I can show your Travel webpage to my girl friend. She is from Berlin. She will stay with us for our school’s global reunion.

  • vivien
    July 21, 2010

    Sorry, no comment on this journal because it is beyond my understanding. But I want to tell you the Travel webpage in your portfolio doesn’t open. It said Forbideen. You don’t have permission to access/on this server.

    • admin
      July 22, 2010

      Thanks for letting me know. I have now fixed the problem.