Category Archives: Wordpress

How to make WordPress Show in an iFrame (X-Frame: SAMEORIGIN)

So I use a nice Chrome plugin for testing responsive layouts called “Dimensions Legacy”, and it puts your content in an iFrame and lets you resize the frame without having to resize your browser (good for inspecting!), HOWEVER, wordpress has added a Frame showing restriction into their default security that won’t allow wordpress to render in an iFrame anymore!

I tried a few things that were meant to make it work, like commenting out the header hooks and even the function that inserts the X-Frame directive, but nothing seemed to work. Even after a reboot!

Finally I found a nice solution (in StackOverflow), that lets you invalidate the X-Frame SAMEORIGIN directive, by adding your own nonsense one that makes the browser ignore them both!

In my page template I added:

<?php header('X-Frame-Options: GOFORIT'); ?>

Problem Solved! 3 years and noone has hacked me yet!

Waiting for your web services? Hello JSON Mocking!

When we start a development sprint, as a UI / UX team, we will make sure that as a priority, that we identify all of the web services that we will need to consume. We then, define the parameters needed to call the service and generally, we will create a JSON object that we will expect the service to return us.

This helps us shorten the critical path by making sure that the service developers can prioritize their work efficiently, and also move development of web service stubs to the front of their work queue.  This process doesn’t always work perfectly and we are sometimes (often) in a position where the web service developers are days away from even making us a stub, so rather than postponing our own critical path work until later in our sprint, we can pretend we have a working web service using JSON mocking! Hooray!

The Tool : Mockjax

The library I use to fake a working web service is MockJax.  It is wonderfully simple.

  1. The library seamlessly wraps jQuery’s $.ajax command.
  2. You write your ajax call as you would if your service already existed
  3. In your page setup init function, you just once, setup an override based on the URL (and optionally POST type, etc), which can redirect to a function, or a static JSON text file, or another url
  4. When you call your $.ajax, the wrapper checks it’s override dictionary for a match, and if it finds one, it intercepts the call and serves your alternate mock data.
Admin skull folder

Change your WordPress SuperAdmin User Name for WordPress Multisite

If you are using a Bitnami WordPress (multisite) stack like I am, then your /wp-admin/ login is going to be pre-set to “user”, which:

  • sucks as a name
  • make your login 50% easier to hack
  • can’t be changed in the web UI

If you wanted to login as a custom-named SuperAdmin, you could either

  1. make a new user and make them also a SuperAdmin when setting their role, OR
  2. rename “user” to your desired login

I chose going with route #2 because leaving a SuperAdmin with the login of “user” still leaves a security weakness.

Changing “user” login to “anotheruser” (for example)

admin-user

  1. Connect to your MySQL WordPress Database
  2. In phpMyAdmin, select your wordpress database (mine is named “bitnami_wordpress”)
  3. Navigate to your wp_users table.
    • There will be one row per user.
    • Edit the user_login column for “user” and change it to “anotheruser”
    • Save

Now, this would be ordinarily be enough to just rename your login, but you will lose your SuperAdmin access to your Network Admin if you don’t make one more change.

Making “anotheruser” SuperAdmin to be able to access Network Admin

admin-meta

    1. Count the number of characters in your new login name (eg “anotheruser” has 11 characters)
    2. Navigate to your wp_sitemeta table
    3. Edit the row with a meta-key of “site_admins” and change the meta_value from
      • “a:1:{i:0;s:4:”user“;}” to
      • “a:1:{i:0;s:11:”anotheruser“;}”
      • (the name part is quite obvious, but you also have to manually specify how many characters long the name is)
    4. For me, this change was applied automatically and instantly, but it couldn’t hurt to reboot your server and logout and log in again.
phpMyAdmin screenshot

Connecting to your WordPress Database with phpMyAdmin from an OSX Remote Machine

If you are using a Bitnami WordPress (multisite) stack like I am, your web-based database phpMyAdmin is setup by default to only be accessible if you are on the same machine (IP address of 127.0.0.1:80).

So in order to get access remotely, you have to trick your machine into thinking you are local.  Thankfully there is some documentation on how to do all of this… but the following is a succinct summary.

  1. Beforehand, setup your .pem keyfile in your keychain, or add -i path/to/your.pem in the following ssh command.
  2. In Terminal, type ssh -N -L 8888:127.0.0.1:80 bitnami@yourdomain.com
    • Unfortunately, when this command runs successfully, there is no text shown.. 
  3. In a web browser, go to http://127.0.0.1:8888/phpmyadmin/
  4. The default credentials for a Bitnami stack are “root” and a password of “bitnami”

When you are done, you can just kill your SSH connection with a Control-C.

Make it yourself!

HOW TO : Setup your own freaking personal WordPress server!

Muhahaha!The fact that you are reading this means I did it. I finally got off my bum.. stopped using my crappy Tumblr blog and worked out how to use Linux, SSH, Amazon EC2 and how to change my own DNS. It took all of my free time when I wasn’t looking after my baby to get it going, but it was worth it because now I have complete control!!!

Muhahaha!!

Simple Steps:

  1. Setup the server.
  2. Write this post for the next person.

More Detailed Steps:

Now, you can make your own Linux image, and then install your WordPress on it, but why bother?

Install a Bitnami-made WordPress image on Amazon’s Elastic Compute Cloud

  1. Go to http://bitnami.org/stack/wordpress#cloudImage and scroll down to the “Amazon machine images”
  2. Click on an Ubuntu 64-bit EBS link.. you can use either single site which is a touch easier, or multisite (like I did) which I felt was built ready for what I wanted.
  3. Select a T1 Micro-sized machine, and Launch Instance (you could request a launch instance, but it’s more complicated)
  4. Keep clicking Continue until you get to the screen that talks about Key Pairs. If you already have a key pair generated, select the one you want. If not, generate a new one.
  5. When setting up security groups, make one that can accept incoming connections on ports: 22 (SSH), 3389 (RDP), 5900 (VNC), 80 (HTTP), 8080 (HTTP alt)
  6. Click Launch!
  7. Wait for it to boot and the State to change to “Running”.. then click on it and scroll down and copy the Public DNS address
  8. Paste the public DNS value into your web browser and navigate to it. If everything went right, a web page should show!

Connect to it!

  1. Download your Key Pair file from Amazon. Mine is called Linux.pem. This file is your password file. You won’t be typing in a password, you will be supplying this file.
  2. In a terminal window (OSX), change to the directory you downloaded your Linux.pem file and type chmod 600 Linux.pem (This will allow this file to be used)
  3. Now connect to your remote machine with ssh -i Linux.pem bitnami@xxxxxx (where xxxxxx is the Public DNS). If you want to stop having to specify your Linux.pem file.. consider having a look at this article.


RSA pem key - blurred

Storing my pem key file in my keychain to mount a filesystem with SSH

My problem is that I’m not very go at vi Editor 🙁

I used to be ok at it, but really, for now, I’m rubbish at it.

I figured there had to be some lovely program that would mount my remote machine’s drive via SSH… AND THERE IS!

So i’m trying ExpanDrive‘s 30 day trial for their program that will reliably mount and re-mount remote file systems.

Their #1 issue so far is that their documentation is pretty sucky.
Their #2 issue is that it’s not obvious how to connect to a filesystem via SSH when you have to use a .pem file.

Thanks to this StackOverflow article, I found out I can add my Linux.pem key to my keychain.

  1. type ssh-add -K /path/to/private/key/file.pem
  2. In ExpanDrive, create a connection to your server with your login and leave the password field blank. Your pem passphrase will be read from the keychain.
  3. In terminal, you can now connect via SSH with ssh bitnami@yourdomain.com without having to specify the location of your pem file (previously ssh -i path/to/Linux.pem bitnami@yourdomain.com)
Configuration dialog for ExpanDrive

Configuration dialog for ExpanDrive

When my 30 day trial ends, I may play around with using Cyberduck or OXFUSE or sshfs-gui.

OSX Transmit

I had a license to the program Transmit and I tried it out and it is AMAZING at connecting to SFTP resources, and mounting them as local drives and synchronization.  Get it!  I can’t recommend it enough!

UPDATE

I almost lost my Linux.pem key! This would have been an epic screw up, but fortunately I remembered that I have a backup of the file on Dropbox. Unfortunately dropbox also strips off unix permissions, and ssh requires the pem key to have a permission of 400 (not public).

When I tried connecting with a file that was “too open” i got the following

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@         WARNING: UNPROTECTED PRIVATE KEY FILE!          @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
Permissions 0644 for 'Linux.pem' are too open.
It is recommended that your private key files are NOT accessible by others.
This private key will be ignored.
bad permissions: ignore key: Linux.pem
Permission denied (publickey).

The solution?

Make the file less “open”… to do this one need only type:
chmod 400 Linux.pem

Changing Multisite WordPress to a New Domain

After initially setting up a Bitnami WordPress server on Amazons EC2 .. I used Amazons Route 53 DNS to point to my new web server.

However once I set up my domain, WordPress was complaining about

Registration has been disabled.

with a URL of:

wp-signup.php

I realized that my site was configured to its original name, and needed to be re-configured to the new domain.

According to BitNami WordPress Multisite – BitNami documentation….

$ sudo /opt/bitnami/apps/wordpress/updateip --machine_hostname mydomain.com

This tool automatically updates the WordPress domain with the machine IP address at boot time. If you have customized your domain name, you should rename it, for example using the following command:

$ sudo mv /opt/bitnami/apps/wordpress/updateip /opt/bitnami/apps/wordpress/updateip.backup