How to move a WordPress Website to a different domain

After various domain movements I figured I would like to reduce my efforts to just one way of moving a WordPress installation from one domain to another – not the quick and dirty, but the right way. IMHO the question remains anyways, if there is any right or wrong way to move a WrdPress Website at all – or if all ways are right, as long as you get the thing done.

Prepare and pack your WordPress Website / Stuff carefully

I’d like to compare moving a WordPress Website to moving a household: of course you can do it this or that way – but in the end it is clearly the easiest if you wrap everything up, put it into boxes, put labels on the boxes – and move it from A to B. Then unpack everything, unwrap everything – and enjoy your new home.

At first glace this might look a bit unpractical – sometimes you just want to skip the wrapping, throw everything in the van as it is and that’s that. But in the end planning, wrapping and packing will reduce the risk of having your precious record collection and/or database broken. And in the long run this might save you a lot of stress, time and money.

So a couple of years ago to move a WordPress Website I actually used to first download all the files and then uploaded it to the new domain. Then I would do a database dump of the related mySQL database – and uploaded the dump, rebuild the database and  to the new webspace and restore all data records. Although this might look handy at first, it turns out to be very unpractical.

If not only the wbspace changed, but also the URL, you will soon notice that any URL you try under the new domain will forward you to the old domain. So entering new-domain/contact will forward you to old-domain/contact and so on. While this is quite easy to fix (just change the entry for siteurl and home in the db table “wp_options” to your new-domain) it might happen that all internal urls are still pointing to old-domain/url-path… That means every WordPress Page and every Blog Post that contains links is likely to be corrupt. So that’s not very handy.

Export – Import – and Bob’s your uncle

Instead of the above mentioned method I prefer to do a clean WordPress install. Upload and install all the plugins and the actual WordPress theme – put all the ‘infrastructure’ in place. To relate to the apartment moving: move and install the shelves first.

Then do an export of all posts and pages from the old domain. You can do that by using the built in WorPress function under tools > export or by using an appropriate plugin. Then download the dump and upload it to your new webspace / new domain. Then import all the posts and pages under the new domain through tools > import.

In general WordPress can import data records from various different sources: Blogger, LiveJournal, RSS, Tumblr etc.  So after clicking ‘import’ you’ll first see various options for different source to import from. One of the options is for WordPress: “Import posts, pages, comments, custom fields, categories, and tags from a WordPress export file.” Following that link will either bring you directly to the upload/import page – or show you an option to install the import plug-in “WordPress-Importer” first.

Most things should be Äin place’ by now. But since WordPress has the (bad) habit to store internal links and links to images with the domain name, all those links are now still pointing to the old domain. But – there is of course a plugin for that: Better Search Replace lets you virtually find everything in your WrdPress-Database that you would want to find and replace. But since it is quite powerful, one should be rather careful using it. Another promising, probably a bit more streamlined plugin is  Velvet Blues Update URLs (which I haven’t tested myself yet).

This all might actually sound a bit complicated – but once you’ve done it once, it’s as easy as 1-2-3 – and Bob’s your uncle 🙂

301: Tell the world (or at least some bots) you’re moving

That’s about it? Not quite yet. Technically the website has moved – but how will the internet, the search engines, the outside world perceive this process? Worst case scenario: you dumped the old domain right after moving everything to the new domain – and never told anybody about it. So next time a search engine spider visits your old domain, all it will ever find is either an abandoned website or total emptiness. If you don’t let people (and bots) know you’ve moved, then nobody will know you have moved. The search engine spider then has no other option than reporting  “website abandoned” or “website deleted” – your website will drop from the search index – and you don’t want that.

If you’re like me, moving your website and keep your search engine ranking is what you probably actually want to achieve. So you should leave a note, where you and your content have moved – just as you would probably do in real life 🙂 The easiest way of telling “everybody” is putting up a 301 notification. The 301 was just made for this and basically exactly this purpose – to get this one message across: “content has moved”.

To forward every visit to your new domain (under the same directory path) this would be the code snipped you need to place in a htaccess file on the root level of your old domain:

#Options +FollowSymLinks
RewriteEngine on
RewriteRule ^(.*)$ http://www.newdomain.com/$1 [R=301,L]

You’ll have to replace “newdomain.com” according to your new domain 🙂

tell google (and other link partners) where to find you

Last but not least you should probably contact google directly. If you happen to have a google webmasters account this is a rather easy process. You might want to delete your previous domain from the google index and register your new domain – along with xml sitemaps etc…

Ah – very last but not very least you should of course inform your link partners. The 301 redirect will do for some time, but after a while it might look a bit odd if people are simply redirected. And once you close down the old domain and the old webspace, also the 301 redirect will stop working. So you better be sure you get your link partners informed in time.

tell your readers you have moved (and why!)

And then you should probably also inform your users and/ or readers directly: write a blog post about your reasons to move, tweet about it, write a newsletter – whatever you preferred form of user interaction might be, now is the time to use it. It is probably the most crucial aspect of moving a domain, that your users understand your motives – so you should address them directly and explain your reasons – and they’ll understand.

how to align floating divs vertically ‘middle’

The following may sound familiar: you have a row of floating divs with varying heights and want to align them neither top nor bottom – but vertically centered? In the good old days of table-layouts that was easy. You would just throw the divs in one table cell each and tell that cell to display its content valign=”middle”.

But in times with mostly CSS powered design that might sound a little bit difficult.  But ‘table’ is the right keyword here: you can use a containing outer div (container / parent object) with the behavior ‘table row’ and give the contained inner divs (child objects) the behavior ‘table-cell’ – then you can apply the css property vertical-align: middle – and Bob’s your uncle.

Here’s a jsfilddle with a working example:
jsfiddle.net/nH2sd/5/

And this question-answer-post at brought me to the above fiddle:
How to center vertically a floating div inside an inline-block?
stackoverflow.com/questions/…/how-to-center-vertically-a-floating-div-inside-an-inline-block

make container / parent div the height of contained / child divs

Having floating divs not stretching the parent container to their full height is re-occurring problem in daily webdesign business. And since I’m looking for a solution every now and then, I decided to finally write down the easiest solution that I could find looking for “make container div the height of contained divs”. Here we go:

The problem: you have a box (the parent / container div) filled with floating divs (the child / contained divs). The inner divs have ‘real’ content, stretching them to a certain height. The outer, container / parent div however won’t naturally get the height of the inner elements, since they are floating.

Solution: add the css behaviour “overflow:auto” to the container / parent element.

floating divs container height

see also:

Since the article on sitepoint is from 2005 I suppose the solution does work also on older browsers.

Drupal 7 node gallery with plupload but no upload [solution]

Another note-to-self – and maybe / hopefully somebody else might also find this note useful…

The problem: The Drupal 7 module “node gallery” installed just fine and is running well. Additionally I installed the Plupload module for drag’n’drop and multi-file upload functionality – but no upload form / no upload option at all is actually happening.

Solution: there is a misleading detail in the readme.txt that comes with the module – or actually in the file structure / naming that comes with the module Plupload:

The installation instructions in readme.txt suggest that you need to upload the file plupload.full.js – but at the suggested location there is instead the minimized version of that file plupload.full.min.js.

sites/all/libraries/plupload/js/plupload.full.js

 vs.

 sites/all/libraries/plupload/js/plupload.full.min.js

The module will perfectly work if you first rename the file. So all you would have to do is remove the “.min” from the file name and upload the file – and everything is fine. The module works as intended and there you’ll have your drag’n’drop- and mupload functionality.

Interspire Email Marketer: how to avoid accidental unsubscribe

I know, there are many Newsletter Tools out there: from WordPress plugins to free online services – basically you wouldn’t need to buy a Newsletter tool if you just want to send out some newsletter every now or then. But then there are also websites with other demands – and those demands may call for a professional tool.

My tool-of-choice is the so called Email Marketer be Interspire. It’s a rather complex system, but it’s flexible and reliable – yet affordable. I like it – and as far as I know many of my clients like it too.

The pre-defined variables are one great feature in Interspire’s Email Marketer. Adding the unsubscribe-variable / short code “%unsubscribelink%” enables users to unsubscribe from the newsletter mailing list with just one click. That is great – but sometimes one click is not enough – or actually just a little bit ‘too much’ convenience. So you might want to make that two clicks, to avoid unintended accidental unsubscriptions.

Adding an additional step to the one-click-undsubscribe-function to make it a two-click-unsubscribe is not as easy as 1-2-3 –– but it is very well possible. All you basically need to do is add a variable to the variable “unsubscribelink” and twist the “unsubscribe.php” a little bit – that means adding about 2-3-4 lines of code to to the “unsubscribe.php” like this:

<?PHP 
$this_url = explode("&ok",$_SERVER['REQUEST_URI']);

if ((sizeof($this_url)>1)&&($_GET['ok']=="ok")) {

// here goes the 'regular' unsubscribe code 

} else { 

$_SERVER['REQUEST_URI'];

$signoff = $_GET['ok'];

$this_url = explode("&ok",$_SERVER['REQUEST_URI']);

$this_url = $this_url[0];

?>

Are you sure you want to be unsubscribed from the list?
<a href="<?PHP echo($this_url); ?>&ok=ok">YES, take me off the list</a>

<?PHP } ?>

So in the “unsubscribe.php” I first check the URL for the variable “ok” – and if it’s set to “ok” then I continue with the unsubsribe-process. If the variable is however not set to “ok” yet, then I show a link so that the user can confirm his/her un-subscription by clicking that link. This has reduced the amount of unwanted unsubscriptions by nearly 100%. Yay!

Ha! Update: here is also an even easier fix for that problem:
https://www.interspire.com/forum/showthread.php?t=17207

Fancybox with fancy title but without tooltip

Yes: it’s possible to have a fancybox with a fancy title but without the tooltip. You can even style the title, that will be shown in the modal window / popup layer without making the roll-over tool tip look wired. How? Here is how:

Usually you would put the “image caption” (or the actual image title) in the title tag. the problem might be, that the title tag is shown on rollover – and if you would like to style your image caption, then things can look funny. In the following example the “made in 2008” is supposed to be displayed in italic – but the tooltip would reveal the html tags:

“The Title of the Image <i>made in 2008</i>”

Now instead of placing the image caption inside the title tag, you can actually use the alt tag, remove the title tag and give your fancybox code the following little detail:

‘titleFromAlt’    : true

Then the alt tag of the image will be used for generating the title inside the modal window. That’s all..

This is basically just another “note to self” — but I hope you find the information useful anyways. If you’d like to have a more detailed description on how to use fancybox titles without the tooltip, then just drop me a line in the comments…

best, +…