Ramin Hossaini

jQuery.collapsible plugin

Apr
27

Note: This plug-in is no longer being maintained and is provided as is.

Introduction

I wrote my first jQuery plugin today and figured other people might find it useful too.

The plugin adds expand/collapse functionality to divs and also saves the state using the jQuery cookie plugin

Changelog

  • 15 Jun 2010
    • You can now specify that a module’s default state is collapsed by adding ‘collapsed’ to the class. For more information, look at the example given below.
  • 04 May 2010
    • Changed expand/collapse icons to sprite
    • Can now have multiple groups of collapsible boxes by giving each
      a descriptive identifier
  • 27 Apr 2010
    • First release

Demo

Click here for a demo

Download

Download Latest Version (jquery.collapsible.latest.zip)

Setup

Add includes to the head-section:

1
2
3
4
<script type='text/javascript' src="./js/jquery-1.4.2.min.js"></script>
<script type='text/javascript' src="./js/jquery.cookie.js"></script>
<script type='text/javascript' src="./js/jquery.collapsible.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="./css/demo.css" />

Add the HTML:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div class="module"> <!-- only important for styling -->
	<div class="header"> <!-- must have a class name -->
		<h1>Header #1</h1>
	</div>
	<div class="content"> <!-- the 'content' class is only for styling -->
		<p>Content comes here</p>
	</div>
</div>
 
<div class="module">
	<div class="header collapsed"> <!-- this will be collapsed by default (unless the cookie says otherwise) -->
		<h1>Header #2</h1>
	</div>
	<div class="content">
		<p>Content comes here</p>
	</div>
</div>
 
<div class="module">
	<div class="header">
		<h1>Header #3</h1>
	</div>
	<div class="content">
		<p>Content comes here</p>
	</div>
</div>

Initialize the Javascript:

1
2
3
4
5
<script type='text/javascript'>
$(document).ready(function() {
	$.collapsible(".module .header");
});
</script>

[MySQL] Batch update of all entries in table that match condition

Apr
25

Lest ye forget.

1
UPDATE <table> SET <column>=<value> WHERE <condition>;

Migrating WordPress

Apr
18

Here are a couple steps I follow each time I move a WordPress instance from one environment to another. I’ll assume you’re moving from Development to Production.

Database configuration

A migration usually involves changing the database configuration in wp-config.php.

Instead of having to modify the file every time, you could just modify wp-config.php to include something like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
if ($_SERVER['HTTP_HOST'] == 'dev') //could be 'localhost' or anything else
{
	define('DB_NAME', 'dev_db_name');
	define('DB_USER', 'dev_user');
	define('DB_PASSWORD', 'dev_password');
	define('DB_HOST', 'localhost');
	define('DB_CHARSET', 'utf8');
	define('DB_COLLATE', '');
}
else
{
	//production config:
	define('DB_NAME', 'prod_db_name');
	define('DB_USER', 'prod_user');
	define('DB_PASSWORD', 'prod_password');
	define('DB_HOST', 'prod_server');
	define('DB_CHARSET', 'utf8');
	define('DB_COLLATE', '');
}

That’s one less thing to worry about.

Database Export and Clean-up

I like using PHPMyAdmin for quickly exporting and importing between databases. But regardless of what tool you use, WordPress stores the full URL in the database (something I find very annoying) so you’ll also have to clean-up your database – these SQL commands have served me well:

1
2
3
4
5
6
7
8
9
10
11
--
-- run after doing an import
--
UPDATE wp_options SET option_value = REPLACE(option_value, 'http://dev_host', 'http://www.prod_domain') 
WHERE option_name = 'home' OR option_name = 'siteurl';
 
UPDATE wp_posts SET guid = REPLACE(guid, 'http://dev_host','http://www.prod_domain');
 
UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://dev_host', 'http://www.prod_domain');
 
UPDATE wp_options SET option_value = REPLACE(option_value, 'http://dev_host', 'http://www.prod_domain');

.htaccess

Depending on how your development environment differs from production, you might also have to change your .htaccess file. You could of course just edit the file, but I find the easiest for me is to:

  • Log into the WordPress admin (/wp-admin)
  • Expand the Settings tab, then click on Permalinks
  • Clicking on “Save changes” re-writes the .htaccess file

This is a tried and tested method I’ve been using a lot – but I’m curious to know how you do it. There might be some great plugins or tools that do all (or most) of this for you.

Design Inspiration: Maryland Security Professionals

Mar
11

Stop WordPress from adding p and br tags

Jan
09

Even without the visual-editor, WordPress has a habit of adding <p> and <br/> tags

Add this to your templates/pages/whatever and it should take care of the problem.

<?php remove_filter('the_content', 'wpautop'); ?>