How to Blog From Your iPad

Anybody can open the WordPress app and start writing a blog post on an iPad. That’s all fine and good – if you’re only responsible for TEXT. What about editing & cropping images? Or adding links to other websites? And what if another writer emails a Word document to you?

Before getting started, you should know that a few apps are required to follow this tutorial. You’ll spend about $15 to have the ability to write awesome blog posts and create kick-ass images from your iPad?

Let’s go already!

Most blogs use WordPress, so this tutorial will focus on using the WordPress blogging app for iPad. We need to set it up on your iPad first.

Setup WordPress App for iPad

Obviously, you’ll need to download and launch the WordPress App for iPad. At the main screen, choose your type of blog:

• Start a new blog at WordPress.com
• Add blog hosted at WordPress.com
• Add self-hosted WordPress blog

If you don’t have a blog, you can create a new one by tapping on the first button.

If your blog is hosted at wordpress.com (like johndoe.wordpress.com), tap the second option.

If you have a blog on your own domain name (like appleslut.com), then you tap the last option.

Got your own blog?

From this point, I’m going to assume you’ve got a WordPress blog on your own domain name. So you’re probably paying a monthly fee for website hosting. (AppleSlut.com recently moved to HostGator – if you’re looking for a website hosting recommendation)

When you enter your username & password into the WordPress iPad app, you might get a warning like this:

Don’t worry, this is just a setting you need to enable in your WordPress admin.

Setup XML-RPC in WordPress

1. Login to your WordPress admin area in Safari (you can use Safari on the iPad or your Mac)
2. Click “Settings”
3. Click “Writing”
4. Under Remote Publishing, check the box next to “XML-RPC”

That’s it! Now you’re ready to write blog posts and pages in the WordPress iPad app.

Opening Word Documents on iPad

Lito is an awesome writer (Hi Lito!). He cranks out blog posts every week and emails the Word documents to me. So, how can I open the Word doc on the iPad, copy the text & links, and then get that into the WordPress app?

The first challenge is opening the Word document. But, that’s not a problem if you have Pages for iPad. Pages opens Word docs without any problems. So, I’ll open this file in Pages.

First, tap on the Word doc in your email.

Tap the “Share” button in the top, right corner. Then tap “Open in Pages” if you have purchased the Pages app (highly recommended).

You may have noticed the “Open In…” button. If you tap it, you’ll see other apps that can open the Word doc. In my case, I could choose Dropbox or Evernote. Both of these apps simply save the Word doc – they don’t allow editing. So, we’ll open in Pages for this example.

You’ll see the loading screen for pages (above).

You might see the “Document Import Warning” screen in Pages. For this example, we don’t have to worry because it’s only a font problem (my iPad doesn’t have the font used in the Word doc). Remember, when you’re blogging, you don’t have to set the fonts – all of that is part of your blog design and done automatically. Click “Done” to continue.

We need to copy all of the text from Pages and paste into WordPress. Tap and hold on a word in the Pages document – hold until the magnifying glass appears, then release. Tap “Select All” from the menu. Then tap “Copy”.

Open the WordPress app and create a new post. Now tap in the body text area, then tap “paste” from the menu that appears.

We need to clean up the text a bit – remove indents, add links, line breaks, bullet lists, etc. Tap anywhere in the body copy and the edit screen will appear. You may have to flip between WordPress and Pages to make sure your post is formatted correctly, links are in the right place, etc.

To add a link in the text, we’ll go back to Pages. Tap on the text to bring up the keyboard. Now tap on one of the links. You’ll see a new menu appear. Tap “Copy”.

Flip back to WordPress. Select the text you want to become the link and tap the blue “Link” button in the top row of the keyboard.

Tap in the “Link URL” field and tap “Paste”, then tap “Insert”. You’ll see the link has been added. Follow this process for all of the links in your blog post.

If you’re making lots of changes or spending lots of time editing the blog post, it’s a good idea to close the keyboard and save every now and then. You don’t want to lose all the work you’ve done.

Tap the eye icon at the bottom of the WordPress app to preview your new blog post. This is a great way to double check your links, formatting, images, etc.

Adding Images to Your Blog Post

Adding images is where it gets tricky. If your blog will shrink or expand images to fit the width of your blog, then you can skip this section.

If your blog theme does not automatically resize images in posts, then you’ve got some work to do.

WordPress only has 2 options for adding images into blog posts:

• Add photo from library
• Take photo

Taking a new photo is pretty easy, so we’ll skip over that. Instead, we want to use the image Lito included in the original Word document. In order to insert the image (or use an image found online), we need to save the image into our iPad’s photo library.

Back to Pages…

Tap the image in pages then tap “copy”. Now we have to get creative because Pages won’t let you save the image to your photo library. Instead, you’re going to email the photo to yourself.

Open Mail and paste the image into a new message. Send the email to yourself – make sure its sent to an email address you can read on your iPad!

 

When you receive the email, tap and hold on the image. The menu will appear with options to save or copy. Tap “Save image”. This will save the image to your photo library.

Editing Images

Cropping Images
Now that the image is saved to the photo library, you can open it in any image editing app – add text, change the colors, etc. For this example I’m going to open the image in an app called Crop Photo+.

This app lets you crop images – and shows the exact pixel height and width of the cropped image. My blog posts are 550 pixels wide, so I need to make sure the images are that wide so they can fill the entire top of the post.

Lucky for me, the image Lito used is 500 pixels wide – so I know it will fit (the width of my blog is 550). But if the image you want to use is wider that your blog, just drag the red corners to correct size and tap “Save”. That will crop the image to a smaller size.

Remember, cropping a photo will delete the areas outside of the selected area.

If you want to keep the whole image, but just make it smaller, then you need to SCALE the image…

Scale Images
To shrink an entire image, you need to use a function typically called “scale” in the photo editing apps. Scaling images on the iPad takes a few steps to get it exactly right. Here we go…

If you need an image for your blog post, check out the Creative Commons section of Flickr. This area of Flickr allows you to use the images, but you must link from your website to the image on Flickr.

For this example, we’ll use this baby photo.

The easiest way to grab the image from Flickr is to tap on the image. Then click “View all sizes” in the top, right corner. You should see a huge version of the photo – this is perfect.

Tap and hold on the photo. You’ll see the options to save and copy the image. Tap “Save Image.” The image is saved in your Photos app on your iPad and we can edit in other apps.

Now we have to scale it because it’s way too big for our blog.

First, you’ll have to find the width of your blog’s content area. The column you’re reading is 550 pixels wide – so that’s how wide I’ll make the baby photo. (To find the width of your blog, talk to your designer/developer or the person who created the theme. When you have the width, write it down.)

You’ll need 2 apps to correctly scale the image:

1. PixelCalc HD – This app will give us the height and width (in pixels) the scaled image should be. Basically, it makes sure we shrink the image proportionately – we don’t want to end up with an image that looks like it was stretched vertically or horizontally.
2. The Image Resizer – This app actually shrinks the image, but you need to know the pixel dimensions of your blog to make it work.

Find the Pixel Height & Width of the Baby Image

1. Open The Image Resizer app
2. Click the “+” in the top, left corner
3. Open your baby photo
4. At the bottom of the screen, write down the numbers next to “Resolution:” In this case, it’s 1280 x 960 – Those are the width and height in pixels

Did you write down the width of your blog? You’ll need that now!

Get the new image dimensions  

1. Open PixelCalc HD
2. Tap “Proportional Scale” in the left menu
3. Enter the width and height of the current baby photo (1280 x 960) in the Original Width and Original Height fields
4. Enter the width of your blog post column in the New Width field
5. Leave “New Height” blank!
6. Tap “Resize!”

Now you should see the New Height appear. For this example, our scaled baby image should be 550 pixels wide and 413 pixels high. This size will give us a perfect, smaller version for the blog.

Scale the baby image to the smaller size

1. Open The Image Resizer app again
2. Open your baby photo (if it’s not already open)
3. Tap the scale button in the bottom, left corner
4. Enter the width and height we calculated in the PixelCalc app (550 x 413)
5. Tap “Resize”

- Boom! Your image has been scaled proportionately and will fit your blog

Save the scaled image to your iPad photo library

1. Tap the Share button at the bottom
2. Tap “More”
3. Tap “Save to Photo Album”

- I bet you can guess what that does.

Finally! You’ve got a perfectly scaled image, ready to use in WordPress – or whatever blogging software you use.

Insert the image into your blog post

Open the WordPress app and open the blog post you’re writing. Just tap anywhere in the text to bring up the editing window. Tap the photo button in the bottom, right corner and tap on “Add Photo from Library”. Tap on the SCALED photo of the baby – usually, it’s the last photo. Tap “Original”. Your photo will be upload to your blog.

Now you have to tap on the photo to see a preview of the image before it’s inserted into the blog post. Next, tap the Share button in the bottom, right corner. Tap “Above Content” to add the image before the text in your blog post. Tap “Update” in the top, right corner.

Now, the post has the HTML code needed to show the baby photo.

Tap the Eye button to preview your post – with the baby image!

Give Credit to the Photographer

Remember, we used an image from the Creative Commons section of Flickr. We need to give credit to the photographer. Let’s open Safari again. Click and hold on the URL in Safari. Tap “Select All”. Tap “Copy”.

Now, go back to the WordPress app.

Edit the post again and scroll to the very bottom. Hit “Return” twice to give some space at the end of the text. Let’s time something nice, like “Photo by Paparutzi”, and we’ll make that a link to the photo. After you type the credit, highlight it and tap the “Link” button. Paste the URL into the “Link URL” field and tap “Insert”.

Publish Your Post

Tap the Settings button at the bottom of the WordPress app (it looks like a gear). Tap on “Status” and change it to “Published”. Tap on “Published On” and change the date to today. Tap “Update” in the top, right corner.

You are done!

That’s how to blog from your iPad!

Congratulations, you just read over 2,000 words – On of my longest posts ever!

See the Final Post

This tutorial follows the exact steps used to create  and edit a real post for this blog. You can see the final blog post here, and YES, it was edited and published via the WordPress app for iPad.

Cat blogging image (at the very top) by Veronica Belmont

Please share this post

If you like this post, please share it on your favorite social network. Thank you!