Have you ever felt bemused / puzzled / left out / like you weren’t one of the cool kids / all of the above when you see other people blithely embed videos and photos in the comments sections of various posts on the blog?

Do you also get the same expression on your face that Gong Yoo’s wearing in the pic above, furrowing your brow & squinting your eyes, when you try your darndest to embed stuff in the comments, but somehow, it just doesn’t work?

Worry no longer, my friends! Help is at hand.

The doctor, as they say, is in.

So this is definitely a post that’s off the beaten track for me. You’ll probably have noticed by now, that my posts are usually either reviews-driven, fangirling-driven, or musings-driven. And that’s pretty much it, really.

Today’s post, though, is comments-driven. Yay for braving new boundaries? 😉

A Bit of Background

Some (most?) of you would’ve noticed that over time, the comments sections on various posts on this blog have evolved to become more like threads &/or forums where fangirls with a common passion share goodies & tidbits with one another. (Gosh, I so love that evolution, seriously!)

In particular, this happens a lot on the k-love related posts, although the reviews and musings do get some love as well.

Recently, we saw a distinct surge in goodies shared in the k-love related posts, partly coz the number of active commenters has increased, and also partly coz the number of available goodies out there has also increased, thanks to promotion rounds for premiering movies & such. (Yay for promotion rounds!)

Along with the surge in sharing also came a bit of a surge in frustration, as various commenters tried to embed stuff in the comments but weren’t successful.

Today, in particular, I was inspired to write this post, triggered by a comment left by regular commenter & resident unnie of the blog, kaiaraia:

So I looked online, and I’m fairly certain that the particular plugin mentioned by kaiaraia is only applicable to wordpress.org sites, and I’m still on wordpress.com.

At the same time, there is a way to embed images on wordpress.com, and rather than let the explanation be brief and then buried among a whole thread of comments in my Gong Yoo post, I thought I’d make this more detailed post instead, which would then be easily accessible to everyone.

In fact, as I got to thinking about constructing this post, I figured it’d be a good place to also unveil the mysteries around embedding YouTube videos and even using a bit of HTML, specifically, the <a> href attribute, or what I like to think of in my head as titled URLs. (It’ll make sense later, I promise)

A Quick Caveat

First of all, I apologize. My blog theme just doesn’t accept the usual HTML codes for stuff like italicizing or bolding text in comments, as some of you have probably already realized.

You can type in the code, sure, but nothing will happen. Your text will appear in the comments as if you’d never included any of the code to begin with.

So if you tried it, and it didn’t work, it’s not you. It’s the blog. Really. Blame it on the blog 😉

But! We can still have fun embedding stuff in the comments, which we’re gonna (finally) dive into now.

Are you ready?

1. Embedding YouTube Videos

So I figured starting with the easiest one would be best. And embedding YouTube videos really is the easiest-peasiest thing.

First of all, let me show you an example of a non-embedded YouTube link, shared by my friend DDee:

As you can see, the link simply appears as a url, which you can then open in a new tab or new window, to watch it directly on YouTube. And that works great too, I might add.

For those who wish to embed their YouTube videos in the comments, though, all you need to do is to hit enter, such that your YouTube url stands on a fresh new line all by its lonesome self.

Here’s a real-life example where I used that neat little trick in a reply to blog reader Asotss today. When constructing the comment, it looked like this:

And once I clicked on Post Comment, it looked like this:

Whee!! Easy-peasy, right?? 😀

Edit: Important Note!

When embedding more than one YouTube video, do hit Enter twice after each url, so that there’s an empty line between your links, which will then enable your multiple vids to embed properly.

Here’s an example, which was a comment left by blog regular evez today 🙂

2. Embedding Photos

MAJOR EDIT!

Boo. Terrible news, everyone. It turns out that the instructions I’d painstakingly put out here for the embedding of photos only works for your own blog.

Upside: If you’re a blogger, you can now use these instructions for the comments sections of your own blog.

Downside: These instructions won’t work on someone else’s blog, even if you’re currently logged in to WP. The reasons for that are what I found below:

In the meantime, I haven’t found an alternative solution, and as I understand it, plugins don’t apply to wordpress.com blogs.

My sincere apologies, especially to sweet kaiaraia, who determinedly tried and failed multiple times on the comments section of this post. T.T

I’m really sorry.

Going forward, my dear readers, you can just paste the url of the photo that you want to share, & I will embed them as we go, since I have editing rights to your comments. Is that ok?

Now, for those of you reading who have your own blogs, here are the instructions for how to embed photos in the comments section of your blog.

Instructions

Before we begin, here’s an example of sharing a photo without embedding:

Again, that works great on its own as well, so no judgment, ya’ll, if you prefer not to embed the pix going forward.

If you do prefer to embed a photo though, here’s what you do.

First of all, ensure that the photo that you want to embed is hosted somewhere on the internet, and has its own url.

I’ve had success embedding photos hosted by wordpress, photobucket and even Facebook. No go with flickr though, I’m afraid.

Basically, you want the url that links directly to the photo and not the site on which it sits, so if you were to click the url, you’d see something like this:

See that blue arrow? That’s the url you want.

When viewing the photo in Photobucket, you want to use the Direct Link over the other options, like so:

Once you’ve got the url, this is the code that you want to use, on a brand new line in your comment:

<img src=”insert photo url here” title=”text” width=380 />

So before I show you how that works, let’s break it down a little.

We already know the bit about the photo url, so next up is the title. If you give your photo a title, it won’t show up immediately when you post your comment, but when you or others mouse over the embedded photo, the title that you’ve given the photo will show up, like so:

So of course, you don’t have to include a title, in which case, you would type the code as:

<img src=”insert photo url here” title=”” width=380 />

Now, what’s this about the width? It’s an optional component of your code, which is mainly used to limit the width of your photo, in case you’re using a really big photo. You can adjust the number according to the number of pixels that you desire, and it should work, barring the limits of the width of your comment.

If you don’t think you need that bit, then omit the width part of the code completely, like what I did here:

See what I did? I included the photo’s url, decided not to add in a title, and decided I didn’t need to do anything about the width of the photo.

And this is what showed, once I clicked on Post Comment:

There. That wasn’t so hard now, was it? 😀

Important Note!

One thing I’ve found in experimenting with embedding photos, is that it’s best to just type the code directly into your comments box, instead of copying and pasting the code off the post. The reason for this is, the inverted commas / quotation marks go wonky when being copied and pasted. I’ve tried copying and pasting off this post, as well as off posts by other people, and it always seems to happen.

Bottom line? Typing it in means your inverted commas / quotation marks don’t get messed up and prevent your code from working.

Weird, but true *shrugs*

3. Using the <a> href attribute to make “Titled URLs”

So you must be wondering by now, what on earth I mean by a titled url?

I mean something like this, posted by my dear friend and fellow Gong Yoo lover, Jules:

See how she’s given a “title” to the url that she posted?

Basically, the code to do this is:

<a href=”insert url here”>text</a>

Using this code, you should be able to create customized links to any page with its own url: a photo, another website etc.

In this case, Jules was linking back to a photo that I’d posted in my Photobucket.

I recreated what her comment might’ve looked like while she was constructing it, and it looks like this:

It is a little advanced, but it’s pretty neat, isn’t it?

Now I’m no expert, so I couldn’t teach you the nuances of this href thing if I wanted to. If you know more about it and want to share, feel free to have at it in the comments 🙂

See, that didn’t hurt at all now, did it? 😉

Time to Practice, Practice, Practice!

Since the best way to learn anything is to try it out for yourself, let’s celebrate our successful lesson by practicing in the comments section, shall we? 😀

Ground Rule #1

To keep things somewhat organized around here, I’d like to request that all shares to do with Gong Yoo, Kim Woo Bin or Jang Hyuk be done on the respective threads, which you can find here:

Loving: Gong Yoo

I Was There: Gong Yoo Premium Night 2013

Giveaway Winner! + Gong Yoo Goodies for Everyone!

Head Over Heels for: Kim Woo Bin

Admiring (& Ogling): Jang Hyuk

Ground Rule #2

Please share goodies that are at least somewhat related to kdrama, since that’s what this blog is all about, ok? 🙂

Like, got a lovely photo to share, of Yoo Seung Ho / Lee Min Ho / [insert any other actor or actress]? Embed it! *

Got a fun interview of a k-celeb to share? Or a kdrama parody that’ll make us giggle? Embed it!

Ahhhh!! This is gonna be so much fun!!

Are you ready??

Let the party begin!! 😀

* Bummer that we can’t embed photos here now, but we can still share cool vids for giggles, if you’re up for it?