dBeautifier 3.4 for WordPress 2.0.5 and 2.0.6

Lately I’ve been a little frustrated. I think it was since I upgraded WordPress to 2.0.5 that it broke my dBeautifier plugin v3.4 for PHP5. Awesome plugin, bummer that Joseph Newing decided to stop supporting it. Lots of people are using it, and will shortly run into this problem. C’mon Joseph, hows about another release update!

Here is a workaround I developed. I have modified the currently only available copy on the internet from Jeroen Onstenk (thanks buddy!) to include the changes required for the plugin to work with WordPress 2.0.5 and 2.0.6. If you have any problems at all with this plugin you are welcome to ask me by leaving a comment at the bottom of this post.

dBeautifier 3.4 for PHP5 and WordPress 2.0.5 and 2.0.6

Summary of Changes

1. Moved the icons directory from the /wp-content/plugins/dBeautifier/icons/ directory to the /wp-content/icons/ directory. This allows WordPress 2.0.5 and 2.0.6 to be able to actually display images from the plugins directory.
2. In order for the above to work, lines 57 to 59 of dBeautifier_Filter.php were modified to the below:

   $img = get_option('siteurl') . "/wp-content/icons/$icon";
           } else {
   $img = get_option('siteurl') . "/wp-content/icons/downloads.png";

   This allows the icons to actually display.

3. Now about the CSS. For some reason the plugin wasn’t loading the CSS from the dBeautifier.css file included with the plugin, so I added it to my /wp-content/themes/mytheme/style.css file. In fact, I also added a little extra CSS, because the theme I use adds a black border around images. This looks really nice with images in posts, but kind of stuffs up dBeautifier icons. So, the total CSS I added to my /wp-content/themes/mytheme/style.css file is:

   /* CSS I added to get rid of borders on the icons */
   img.icon {
       border: none;
       background: none;
   }
   
   /* CSS by Joseph Newing required for dBeautifier to work nicely */
    .download-link {
       height: 50px;
       background: #f6f6f6;
       border: 1px solid #cccccc;
       margin: 0 0 5px 0;
       padding-left: 15px;
       }
   
    .download-link h4 {
       margin: 0;
       padding: 10px 0 0 5px;
       }
   
    .download-link p {
       margin: 0;
       padding: 0 0 0 30px;
       }
   
    .download-link img {
       float: left;
       margin: 5px 5px 0 5px;
       border: none;
       padding-top: 4px;
       }

4. Then, in order for my extra little piece of CSS to be implemented by the plugin, I had to change the class on line 93 of dBeautifier_Filter.php to become the icon class: (edit: can’t get the code to display, website not rendering code correctly – refer to the downloadable file instead)

5. Finally, I accidentally overwrote the original icons that Joseph Newing included with the plugin. I obviously prefer myn so I’ll just leave them there for now. You can use whichever ones you want, please yourself.

Installation Instructions

1. Download the file from above, and unzip it to your wordpress root folder. This download already includes all the modifications except where I moved the plugins CSS into the themes CSS, you will have to do this manually.
2. Add the following to your /wp-content/themes/mytheme/style.css file:

   /* CSS I added to get rid of borders on the icons */
   img.icon {
       border: none;
       background: none;
   }
   
   /* CSS by Joseph Newing required for dBeautifier to work nicely */
    .download-link {
       height: 50px;
       background: #f6f6f6;
       border: 1px solid #cccccc;
       margin: 0 0 5px 0;
       padding-left: 15px;
       }
   
    .download-link h4 {
       margin: 0;
       padding: 10px 0 0 5px;
       }
   
    .download-link p {
       margin: 0;
       padding: 0 0 0 30px;
       }
   
    .download-link img {
       float: left;
       margin: 5px 5px 0 5px;
       border: none;
       padding-top: 4px;
       }

3. Activate the plugin, and go to the dBeautifier tab in Options Panel to set your WordPress directory.
4. You may like to add the XLS and PDF icons that I accidentally included with this package whilst you’re in the Options Panel. I will likely expand on the icons and file extensions that I use and create another download. If I get around to doing this in the next few weeks I’ll make sure I provide a link from this post.