WordPress 3.0 and basic styling

Posted on June 20, 2010 by telm

I’ve just upgraded to WordPress 3.0 from WordPress 2.6 and it was a very painless experience. That being said my blog definitely doesn’t have many posts and I didn’t make many changes to my default theme. I must admit that I manage a few websites with WordPress, they are very easy to manage considering that they are self sufficient and don’t require a lot of maintenance. I’ve had very few problems with my WordPress websites and I am considering switching some of my older websites over to WordPress. Disabling the blog feature in wordpress is very easy, all you have to do is go to Settings and select the static page option and select the created page you would like the home page to be. You do need to create a page before you can use this feature.

One of my pet peeves has always been the use of a visual HTML editor since I’ve always felt that HTML should only be created by hand. WordPress has a built in editor called TinyMCE. After I made the conversion to WordPress 3.0 I noticed that since the columns have been widened when I switched over to the new default theme some of my pages were not styled correctly. I had created them using the visual html editor since it didn’t take a lot of time to do. However the visual editor, when you save your work with it, will erase several tags such as br and p tags. It also removes some HTML formatting, this only happens when you switch from the visual editor to the HTML editor. After struggling with switching between editors and losing my formatting I decided to switch the Visual Editor off in WordPress. After I switched it off it made creating pages and properly styling them much easier.

Once you realize how WordPress does its styling around elements in the HTML editor, styling then becomes much much easier. Some of my tips for creating properly styled pages using the HTML editor are as follows:

1. Use the br element for separating elements on pages. Make sure there is an empty line above and below the br element.

2. WordPress will place HTML that is separated by empty lines between p elements. Global styles can be applied to this element.

3. Text that is separated by a new line will appear in a new line. WordPress inserts a br element if it sees a new line character.

These 3 easy tips should help anyone to do simple formatting on pages. More complex formatting will of course require more complex HTML and CSS. W3C Schools is a great place full of easy tutorials on creating web pages using HTML. Please think twice before using a visual editor, yes it may be faster but your pages will be harder to maintain in the long run and you won’t always get the styling that you need.

Posted in Software Development, Wordpress | Leave a comment

Bulk Image Uploading

Posted on July 21, 2008 by telm

I’ve decided that I want to be able to allow my users to upload more then 1 image at a time. I wanted to find a solution that wasn’t overly complicated and that I could easily interface into my already existing Java framework. I’ve come up with 4 options.

Option #1:
Use an applet. Now this may seem like a good idea at first but applets can be complicated and I needed additional information to be submitted with my images. I didn’t want to spend hours customizing a solution in Java using Swing.

Option #2:
Use some cryptic (Action something) Microsoft technology that only works in ASP and internet explorer. I don’t even want to begin on discussing the perils of that decision.

Option #3:
Use a flash component. Again while this might seem like a good solution, modifying a flash component to meet my needs is as difficult as option #1.

Option #4:
Use a Javascript plugin. This is the quickest implementation, however you will only be able to select one image at a time every time a user clicks on the browse button.

Problem:
There are 3 very good options here, the Microsoft one is an extremely terrible idea and should not be attempted. Option #1 and #3 are the most user friendly options but they would require a lot of customization, and a user would be forced to accept a security certificate every time they wanted to upload a file since the software would have to access the users hard disk. Not all web users may be trusting enough to do this. Option #4 is not as aesthetic as the other options and a user would be forced to choose one file at a time, instead of being able select multiple files. A preview would also not be available for every upload, unless the file was pre uploaded to the server but that isn’t a very useful feature. It is possible to do a preview in Internet Explorer by uploading the image to IE’s temporary memory but that doesn’t help me with other browsers.

Solution:
After looking around to see what the big players in the industry are doing, I’ve decided that the best solution is the go with option #4 and eventually offer options #1 or #3 in the future and give users the option to use either. I use JQuery as my JavaScript framework so naturally it would be in my best interest to attempt to find a JQuery plugin. After looking around I have found the JQuery Multiple File Upload Plugin. It’s a very easy plugin to use and it supports a maximum or infinite amount of files. A demo can be seen at the above link.

Posted in Software Development | Tagged , | Leave a comment