Simulcasting: Technical Considerations

The other day I promised I would share some technical considerations with simulcasting your WordPress blog on Blogger (the original article was here).

As I demonstrated in that article, the idea was to have IFTTT pick up the WordPress post and create a new post on Blogger, and I said that it usually works. The fact is, sometimes you’ll create a post using WordPress, and when it gets over to Blogger, the post is empty. You get the header and the tags/labels, but you don’t get the actual post.

I’ve already gone into some detail about why this is happening, so read that post if you’re interested in why. The upshot is, if you want to embed pictures with captions, you can’t use the “Add Media” button in the post editor to add them. IFTTT is aware of the problem; they wrote me back on Friday, and told me this:

Unfortunately we won’t have a short-term solution for this, but we’ll continue to investigate what might be going on.

I thought I had a workaround today that involved posting to Tumblr and creating the post in Blogger from there, and while it did work, I found that WordPress summarizes the post when it goes to Tumblr, and that wasn’t what I wanted. Besides, Tumblr is a pain in the backside to work with.

What I do instead is write standard HTML code to display the image and the caption without HTML5 commands:
<div style="width:474px;display:block;margin:5px auto;text-align:center;font-size:75%;">
<img ...>
Your caption goes here
</div>

The width: on the <div> tag should be adjusted to match the width of the picture you’re embedding, and the <img> tag should include the width= parameter.

You might want to handle all of the embeds this way, even videos and pictures without captions, because WordPress uses CSS (Cascading Style Sheets) to make the pictures and videos come out centered in the post. Look at this image tag that gets generated when I embed a picture:
<img src="https://thesoundofonehandtyping.files.wordpress.com/2015/01/marshall_field_clock.jpg?w=474" alt="OLYMPUS DIGITAL CAMERA" width="474" height="470" class="alignnone size-large wp-image-2968" />

When this tag makes its way over to Blogger, the classes will be ignored because they aren’t in Blogger’s style sheets. So the picture will end up in the default location (i.e. along the left margin). If you’re not fussy about where the pictures and videos end up over in Blogger, it’s no big deal. Needless to say, I am fussy about it, so I use the standard HTML code. At some point, I plan on going through WordPress’ style sheets, copying the appropriate classes into my own style sheet and add it to Blogger (which, evidently, I can do without giving them money).

One final technical consideration: When I published the article on the A to Z blog, V. L. Jennings commented, “The only issue I see with this is that Google may ping you for having duplicate content out there.” She mentioned a couple of pages that discuss this issue, including this one. That article lists several alternatives for ensuring that search engines recognize that what’s on the Blogger page is a copy of what was on the original page. The easiest of these alternatives is to create a link back from the post on Blogger to the post on WordPress. The way I do that is to build the Blogger post in IFTTT like this:

The action in IFTTT

PostURL is the original post; clicking on the link brings you there.

I hope this has been helpful. Feel free to leave me a message here, on Twitter, or on Facebook if you have any questions.