I’m near completion of my latest plugin that requires a little CSS magic.
Being a huge Fan of CSS, I thought it best to check out how it could be done.

I’ll give credit where credit is due.

Thanks goes to  Artem Russakovskii and his post on wordpress-plugin-development-how-to-include-css-and-javascript-conditionally-and-only-when-needed-by-the-posts

And as a follow up from the good folk from the WP Codex – http://codex.wordpress.org/Function_Reference/wp_enqueue_style and also regarding a new look on CSS and styling Anchor Tags – the Proper Way…. as shown by Anatoly Lubarsky at http://blogs.x2line.com/al/articles/159.aspx

To all of the above, a big thanks. I went from “hey how do you go adding in CSS with a plugin” to having it working in about 20 minutes, including research and dreaming up new stuff.

That’s another step forward in the Plugin “How To’s”.

With all the recent attacks recently, security is on the top of most people’s mind.  There are some very simple things that you can do to make your blog  less of a target.

First, how do blogs get hacked in the first place? Because of it’s design, there are many vulnerable areas in a WP site.In brief:

• Outdated plugins and themes
• Using plugins from unknown sources
• using an older version of WordPress
• Weak passwords
• using admin as your username
• insecure or incomplete installations
• leaving certain files on your server, such as the readme.html
• not removing your WP version from various areas on your site.
• keeping the default database prefix.
• and several other ways that we’ll cover another time.

Fortunately, WP has several plugins that make doing many of these security measures a breeze.

Here’s a list of my favorite ones

Login Lockdown ~ records the IP address of every failed login attempt. If more than a set number of attempts are detected within a short period of time from the same IP range, then the login function is disabled for all requests from that range. Currently the plugin defaults to a 1 hour lock out of an IP block after 3 failed login attempts within 5 minutes. This can be modified via the Options panel and admisitrators can release locked out IP ranges manually from the panel.

WP Secure ~ does a multitude of functions that used to have be done manually, such as:

upgrade to the last version of wordpress
check plugins that are out of date
Remove error information on login-page
Hide your wordpress version(frontend & dashboard)
Remove really simple discovery
Remove Windows Live Writer
Remove core update information
Remove plugin & theme update information
Add index.php for plugin directory which hides your plugins folder
Change the default admin username & tests the strength of your password
Restrict access to wp-config.php file, wp-includes & wp-content folders
Restrict wp-admin for only your Ip
–> Restrict access to wp-admin Manual
–> Check files and folder permissions

Secure WordPress ~ does pretty much the same thing as WP secure, plus it also provides a  free malware and vulnerabilities scan with SiteSecurityMonitor.com

WP-MalWatch ~ is a scanner designed to help alert you when hackers have been at work inside your blog. WP Malwatch does not protect your blog, it only logs suspicious events and alerts you possible security breaches.

AntiVirus ~ scans your blog for exploits and spam injections and provides anti-virus protection for your blog. Although it’s a very useful plugin, many themes will show a false positive, because it doesn’t recognize some of the code that is used.

WordPress File Monitor ~ monitors your WP site for added/deleted/changed files. When a change is detected an email alert can be sent to a specified address. Be aware that whenever a plugin updates, or creates any change, you will be notified.

There are many others out there. As I test them out, I will tell you what I think.

Look them over and choose the ones that you like best. I have them all installed and have not had any compatibility problems so far.

Plugins make life  more enjoyable. Takes a lot of the headaches out of building a interactive website.

There is a plugin for just about anything you want you website to do.

If you can’t find what you are looking for then you need to find Tim Brownlaw. The code guru of the internet. By the way did I mention that he is the owner of www.advancedwordpresstutorials.com

Creating Multi Widgets just got easier.

There are some good sites which explain this with some example code.

Some good examples are available at: http://wpengineer.com/wordpress-built-a-widget/

If you do want to try out the example on that page you’ll need to do a couple of things.

1. Create a new folder under your ../wp-content/plugins .
2. Create a new file to save it in.
3. Add the Plugin Header – The example on the page doesn’t show one – it’s an example!
4. Add a registration function to keep things happy. What is there won’t work – or it didn’t work for me so needed this addition.

Now this example code worked after I performed the changes above ( Yes I am going to describe them in a moment!) . As it is an example – you are going to have to make some decisions on what you are going to call it etc.

Step 1.

Now as this is an example of a Multi Widget – I created a folder called multi-1 ( when I’m experimenting/Developing – I always put my plug-in code in Folders ).

Step 2.

Next is to copy and paste the sample code into a file – again I called this multi-1.php and this lives in the previously created folder with the same name.

Step 3.

Add in the following Plugin Header – Remember this is an example bit of code we are just seeing what it does…So some of the info doesn’t matter. The one that does is the Plugin Name.

Plugin Name: Multi -1
Plugin URI: http://www.somewhere.com
Description: Example of a Multi Widget
Version: 0.1
Author: Multi-1
Author URI: http://www.somewhere.com

The important line here is Plugin Name: Multi -1 as this is what you are going to see in your Plugin page – the plugin name called Mutli-1 – so you can find it to activate it. That always helps.

Step 4.

Add the additional registration code.

This is a snippet of the original code from the example.

?>
<p><label for="<?php echo $this->get_field_id('title'); ?>">Title: <input id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo attribute_escape($title); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('entry_title'); ?>">Title for entry feed: <input id="<?php echo $this->get_field_id('entry_title'); ?>" name="<?php echo $this->get_field_name('entry_title'); ?>" type="text" value="<?php echo attribute_escape($entry_title); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('comments_title'); ?>">Title for comments feed: <input id="<?php echo $this->get_field_id('comments_title'); ?>" name="<?php echo $this->get_field_name('comments_title'); ?>" type="text" value="<?php echo attribute_escape($comments_title); ?>" /></label></p>
<?php
}
}
register_widget('My_RSS_Widget');

And this is the code with the added function. Again this is just one way to achieve this…

?>
<label for="<?php echo $this->get_field_id('title'); ?>">Title:</label>
<input id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo attribute_escape($title); ?>" />
<label for="<?php echo $this->get_field_id('entry_title'); ?>">Title for entry feed:</label>
<input id="<?php echo $this->get_field_id('entry_title'); ?>" name="<?php echo $this->get_field_name('entry_title'); ?>" type="text" value="<?php echo attribute_escape($entry_title); ?>" />
<label for="<?php echo $this->get_field_id('comments_title'); ?>">Title for comments feed:</label>
<input id="<?php echo $this->get_field_id('comments_title'); ?>" name="<?php echo $this->get_field_name('comments_title'); ?>" type="text" value="<?php echo attribute_escape($comments_title); ?>" />
}
}
add_action('widgets_init', 'My_RSS_Widget_init');
function My_RSS_Widget_init () {
register_widget('My_RSS_Widget');
}

The bit we changed is…

add_action('widgets_init', 'My_RSS_Widget_init');
function My_RSS_Widget_init () {
register_widget('My_RSS_Widget');
}

So after you’ve done all that, you can go into your Plugins panel and activate the plugin called Multi-1 . Then go into Appearance -> Widgets and install a few instances of Multi-1.

One thing I did check was the table – wp-options – to see what the new entries were. This new wp_widget class takes care of  the creating and destroying of each widgets values. Which if I were to do this the old way.. I’d have to write the code to achieve the same thing. This is where this Class really shines. So now I ( and you ) can get busy creating multi widgets and not worry about all the “housekeeping” code.

Just remember…

This new class only works with WordPress 2.8 and above. Can’t say it works in the upcoming WordPress 3 as it’s not around yet… Everyone should be running the latest versions of WordPress anyway so if they want to use your new Multi Widget – they’ll have no excuses not too!

Ok, I think that covers most of it.. If not, please leave a comment and I’ll get back to you on it.

What I have described here is exactly what I have done and it works a treat. So it’s a very good “framework” to build upon. Have fun!

I’m reading here and there on a few WordPress Codex pages that this function along with it’s mates is going to go the way of the Dodo bird. That’s my interpretation and not a quote.

While that’s fine, the replacement functions – in this case -  register_widget_control,  do not seem to  have the same functionality!

Which makes me wonder… Is there some undocumented way to achieve the same things using these “recommended” functions? Are they frowned upon?

This was noted in a blog I was reading regarding creating Multiple Widgets which also noted that the WordPress Widgets API has a heading for this with a few words but nothing more…

And here I am quoting from http://codex.wordpress.org/Plugins/WordPress_Widgets_Api#Widgets_-_One_or_many

Widgets – One or many

Widgets can be coded so that they can exist one time or they can exist multiple times. WordPress is doing the work for you to instantiate your Widget multiple times if you follow some rules.

And those rules are…… lots of white space on a webpage. Hmm, I must need new glasses or get some fancy filter for my LCD to show “Secret WP Stuff”!

So do I use the ‘wp’ versions and be able to achieve what I want, or do I follow the recommendations and just say “Sorry, I can’t do anything useful like I want to”?

Well, I’m up for the challenge and as long as these “not recommended” functions are there,  I’ll use them. It’s certainly vague, at best, as to what the WordPress Coders have in mind!

The worst thing that can happen is everything breaks! Hmm , I’ve never experienced that before!

Let’s see if  I can get my head around this Multi Widget stuff!

Of course there are other ways to “Skin an animal” – preferrably not a cat!

Addition: I’ve just found that in the resources on the wordpress codex page is the link to the site I’ve been referring to.

You can also Check out the party they had Dec 2009.

Update

Well I have found the reason! The reason is that from WordPress 2.8 and beyond,  multi widget functionality has been implemented using a new class called WP_Widget.

This is explained in the post – Mulit-Widgets

Cheers

Tim

I like the simplicity and functionality of the Calendar plugin from Kieran O’Shea. Out of the box it was a bit hard to read for my aging eyes though. I wanted the calendar on its own “Page” but with my fixed-width 2 column theme it appeared “squashed”.

I decided to make a template for the calendar page removing the side bar. As I have navigation in the header this still left my visitors a way back to any of my main pages. The result was much easier to read. A few tweaks to font sizing and colors to match it to my theme and it worked out fine.

I was able to set up recurring events and single events quite quickly. One feature I will look for in the future is the ability to temporarily “exclude” a date from the recurring schedule on a one-time basis to meet “real life” situations when things may be cancelled that day.

As all the events I set up begin with the new year it can be viewed here American Legion Post 79 after Jan 1, 2010 as it is currently saved as a draft page.

Overall I’m very pleased with this plugin.

Give it a go if you need a calendar.

Lou

The Plugin.

This is Codebanters Aweber/Getresponse Subscription form Plugin available from http://www.codebanter.com/projects/. It might be something you find useful, but of course there are other ways to implement a subscription form. It seems though that it doesn’t quite like my site.

Now I’m not out to rubbish this plug-in.  The fact that it’s broken on my site is probably due to my “not having” or” having” done something.  So we are just looking at it from an instructional point of view. I’m fixing it so I might as well write about it too!

Don’t go busting out of my page.

As you may have noticed, the little newsletter subscription box up at the top right is “breaking out” off the page. For a Website on Advanced Worpress Tutorials, this doesn’t look good.
So let’s take a look and see what the problem is.

What’s the problem?

In a nutshell…. this is…. (I’m just firing up “The GIMP” to take a screen shot.)

CodeBanter Breaking out of the page

Now that text, should  be contained within the light gray area, but as you can see, the description text is stepping out of bounds. Anyway, let’s see what we can do to fix this.

The best place to start when “investigating” these situations is to work backwards. So let’s see what the generated code is. You can do that by right clicking on the page and selecting the “View Source” option then pick on some keyword to help locate it.

This is what we get…

<div id="sidebarRight" class="sidebar"><!-- OPTIN Plugin By CodeBanter.com -->
<!--sidebox start -->
<div id="getresponse_form" class="dbx-box widget_recent_entries">
<h3 class="dbx-handle">Keep in Touch!</h3>
<div class="dbx-content">
<div>
<table>
<tbody>
<tr>
<td><form id="GRSubscribeForm" action="http://www.getresponse.com/cgi-bin/add.cgi" accept-charset="UTF-8" method="post"> <input name="category1" type="hidden" value="advancedwordpresstutorials" /> <input name="confirmation" type="hidden" /> <input name="error_page" type="hidden" /> <input name="ref" type="hidden" /> <input name="getpostdata" type="hidden" value="post" />
<table>
<tbody>
<tr>
<td colspan="2">
<p style="text-align: center;"><strong><span style="color: #993300;">Receive The Free</span></strong>
<strong><span style="color: #3366ff;">AdvancedWordPressTutorials Newsletter</span>
<span style="color: #993300;">and keep up to date on any new Tips and Tricks to enhance your WordPress websites.</span></strong></p>
</td>
</tr>
<tr>
<td align="left"><input id="nameField" name="category2" type="text" value="Name" /></td>
</tr>
<tr>
<td align="left"><input id="emailField" name="category3" type="text" value="Email" /></td>
</tr>
<tr>
<td colspan="2" align="left"><input name="submit" type="submit" value="Add me!" /></td>
</tr>
</tbody>
</table>
</form></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!--sidebox end -->

It is quite busy for a simple form with lots of tables etc. While I could whinge about it not being a CSS layout, the short story is “Well it works…”

Ok, what can we see?

No dead people around, so it’s not any of those… but there are three css class instances being used.

<div id="getresponse_form" class="dbx-box widget_recent_entries">
<h3 class="dbx-handle">Keep in Touch!</h3>
<div class="dbx-content">

So we have, dbx-box widget_recent_entries, dbx-handle and dbx-content.

Now, I wonder if they are defined anywhere? One rule of thumb is to wrap any thing that’s going to appear as a widget in the themes default settings.  I know this firsthand from just having written my first plug-in ( to be documented later..). But this is also intended to be placed on a page/post so these styles have been included to allow you to change it’s appearance. Which is great if you know CSS!

So hunting through the files it appears that we have to define these styles ourselves. Which means adding some CSS to our themes CSS file.
That isn’t a bad thing, it’s just a bit of extra work we have to do and in fairness, most AR forms require some tweaking.

So let’s tweak!

After having a deep look at this I found two things..

1. The long word of “AdvancedWordPressTutorials” exceeded the allowed width causing the breakout. So that just required the breaking up of the word by putting in spaces.
2. The default style of the heading is dull and boring, so I defined an entry for .dbx-handle by adding it to the bottom of my theme’s style.css file. (described below)

.dbx-handle {
color:red;
text-align:center;
font-weight:bold;
}

Summary

Hopefully this has shed a little light on how to find out why things break and how to fix them. This is not very detailed, mainly due to my solving and writing at the same time ( well now it’s documented ).

This a useful link to have handy when delving inside plugins etc.

http://codex.wordpress.org/Main_Page