My Monkey Do

A Log of Coding Solutions

Coding

WordPress is Not Remembering Me

by

Problem

All these years I’ve been checking the “Remember Me” checkbox when logging in every once in a while in hopes that WordPress will one day actually remember me.  I don’t think it ever did, but I didn’t really mind or notice much because I just thought it had something to do with my browser settings or I just didn’t come back soon enough.  Well enough is enough.  I finally had a project where I needed the Remember me functionality to work.

I made WordPress act as a web app on Apple devices by adding meta tags.  But the problem was that every time the user went to the Home screen (exited the app) they would have to log back in when re-opening the app.

Solution

Silly WordPress.  From as far back as about 5 years ago, (version 2.6.1), people have been having problems with WordPress not remembering them.  The solution is simple but is a big quirk if you ask me.  Simply drop the last slash (“/”) from the url you visit before logging in.  People have reported Remember Me working on urls like “mydomain.com/wp-admin” but not “mydomain.com/wp-admin/”.  Turns out it also works on other URLs like “mydomain.com/mypasswordprotectedpage” but  does not work on “mydomain.com/mypasswordprotectedpage/”.  Give it a try.

http://wordpress.org/support/topic/remember-me-does-not-remember-me

 

Migrating Multisite to Single Site

by

I needed to migrate a site on a multisite installation to a single installation.  This article did the trick for the most part.

 

http://beacon.wharton.upenn.edu/404/2011/02/the-return-from-multisite/

Bootstrap Tab linking

by

If you use Bootstrap (v3.x) you would see that clicking on a tab does add anything to the url so if you were to refresh, you wouldn’t go back to the tab you are on.  The post below says to get rid of the e.preventDefault() in the tab api and add some code to detect the window href so you can go directly to your tab.

http://www.gsdesign.ro/blog/jquery-ui-bootstrap-tabs-remember-last-selected-tab/

Javascript defaultValue

by

For some reason I have never needed to use the defautlValue property up until today.  I was pleased to find javascript can access the original input value so tracking changes in a form is a bit easier.  However, the defaultValue only works as expected for “text”, “file”, and “password” fields.

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-6043025

A workaround is to use type=”text” and just have a style=”display:none;” to act like a hidden field.

Careful with supporting all versions of IE 8

by

Problem

Internet Explorer 8 is still mildly popular and so probably needs to be accommodated for on websites.  However, like different versions of Chrome and Firefox, IE8 also has different versions.  There are about 6 different versions of IE8 in the wild.  2 of which I have run into personally.  1 version, on Windows 7 uses the IE8 standards document to show websites while another version runs on Windows XP to show IE7 standards document.  Until 2008, IE8 used to default to render using IE7!  What the hell?  Anyway, the real problem is IE7 does not support a lot of CSS that we use today since, you know, it’s over 10 years old.

Solutions

A good starting point is to use the IE-edge meta tag within the head:

<meta http-equiv="x-ua-compatible" content="IE=Edge"/>

Another good starting point is to use the modernizr.js script.

IE8 using IE7 does not support box-sizing.  Using modernizr and some handy dandy javascript, we can adjust the dimensions of elements.

Modernizr.addTest("boxsizing", function() {
return Modernizr.testAllProps("boxSizing") && (document.documentMode === undefined || document.documentMode > 7);
});
jQuery(document).ready(function($) {
if( $('html').hasClass('no-boxsizing') ) {
$('.no-boxsizing, .no-boxsizing *').each(function(){
var fullW = $(this).outerWidth(),
actualW = $(this).width(),
wDiff = fullW - actualW,
newW = actualW - wDiff;

$(this).css('width',newW);

var fullH = $(this).outerHeight(),
actualH = $(this).height(),
hDiff = fullH - actualH,
newH = actualH - hDiff;

$(this).css('height',newH);

});
}
});

IE8 using IE7 has no table-cell

One solution is to use

*float:left;

Or, as one stackoverflow person found, use !ie7.. sorry, forgot to save the link.  but anything with !ie7 will only apply to ie7 and below.  (the ie7 part can actually be any non-valid text like !ieisold)

float:left !ie7;

To vertically align images, try this:  http://stackoverflow.com/questions/10998614/ie7-vertically-align-middle-not-working

To test your work out on multiple versions of IE without you having to actually have Windows installed:

http://www.browserstack.com/

How does WordPress redirect mistyped URLs to the correct one?

by

Well, I’m not sure exactly because it is A LOT of code, but to make it stop, you can use the filter ‘redirect_canonical’ and return false.  like so:


add_filter( 'redirect_canonical', '__return_false');

So say you have a post named “mission” at http://mydomain.com/mission, but for some reason you really want to go to http://mydomain.com/mission-control/ instead of being redirected to the post, returning false with redirect_canonical will allow you to visit the url you want.

‘redirect_canonical’ is actually an SEO feature built into WordPress.  This function redirects duplicate content like www.mydomain.com to mydomain.com among other things.  Disable it with caution.