Embedding Podcast episode/mp3 audio file into sidebar widget
-
If you go to my blog as it is currently setup, you will see the way I am doing things right now is that I have the podcast’s logo/image in the upper left corner, using an IMAGE widget box. Clicking the image takes people to the page where they can listen to or download the podcast.
I have seen though on various blogs that some people embed the actual episode file right into the widget itself, so someone could go right there and click play on the episode without ever leaving the page.
How would I do this on wordpress? Would I just use a TEXT BOX widget? I tried to do that and pasted in the html embed code, but all it would do is post a link and not embed the actual player itself.
If it matters, I use libsyn.com to host my podcast/mp3 files. I’ve embed the podcast episode on other pages before without a problem, so I don’t think this is an issue with libsyn or the html embed code I am using.
Possibly I am using the wrong widget type.
Any suggestions?
The blog I need help with is: (visible only to logged in users)
-
In wp.com blogs we’re not allowed to use embed codes directly, for security reasons. If your code is javascript or iframe, it can’t be used. If it’s flash, it can be converted to a working shortcode. Please paste an example here between backticks.
-
Ok here is an example of the full HTML version of the code:
<object height=”360″ width=”640″><param name=”allowScriptAccess” value=”always”/><param name=”allowFullScreen” value=”true”/><param name=”movie” value=”http://player.wizzard.tv/player/o/i/x/131163535155/config/k-db1a0918a707aa69/uuid/root/episode/k-74fbad32ffeec837.m4v”/><embed src=”http://player.wizzard.tv/player/o/i/x/131163535155/config/k-db1a0918a707aa69/uuid/root/episode/k-74fbad32ffeec837.m4v” name=”movie” menu=”false” type=”application/x-shockwave-flash” AllowScriptAccess=”always” AllowFullScreen=”true” width=”640″ height=”360″/></object>
Now, you said I could get a working short code. How would I about doing that? What is the process?
Thanks!
-
As you might be able to see, I found a temporary work around for my issue. I basically just inserted a text box under the image, and used the wordpress audio embed code. Luckily because of the way it appears, it seems like it is all one widget box. So that will do for now I suppose. It allows access to the podcast episode statically, without having to leave main page.
What I was trying to do, was embed libsyn’s wizzard player into the widget itself…..is that a possibility?
-
Whole story here:
http://wpbtips.wordpress.com/2010/07/22/gigya-shortcode-3-widgets/To make it easier for you, just copy this part of the code:
<embed src="etc etc etc etc"/></object>
and turn it to this:
[gigya src="etc etc etc etc" ]
Paste in a text widget. Of course you’ll need to change the dimensions too. -
Ok I did eventually get it to work, but for some reason there is like a rectangle of black above & below the image itself. Not sure where in the embed code I could erase to get that out of there, or if it is even possible. Weird.
-
That’s because the widget is not very well designed (unless there are customization options you skipped before getting to the embed code). Copy-paste its URL into the address bar of your browser, hit return, then drag the bottom right corner of the browser window to resize it and see what happens.To eliminate the extra black of the player you need to use the right combination of width and height. Try these:
width=”196″ height=”147″ -
It looks like the “extra black bars” are tied to the image size itself. So when I go to adjust the w/h it makes the entire image tiny or small, rather than just eliminating all the extra black bars. I am sort of puzzled because I have embed the podcast directly onto other blogs, (using the very same embed code), such as this one here: http://darkmediacity.com/group/evilepisodes and as you can see the black bars are very minimal. If it looked like THAT when I pasted it into wordpress I’d be fine with it.
With wordpress, instead of the tiny sliver of black on the sides of the image, there is about a 2-3 inch black area on the top and bottom of the image I can’t seem to shake.
Like I said, I sort of found a work around that I am happy enough with until I can figure out what exactly I am either doing wrong or just missing when I try to embed.
Thanks for all the help.
-
I can’t see anything in the site you linked to because it requires signing up.
Check this demo post:
http://panosdemos.wordpress.com/2011/07/26/libsyn-com-widget/
Are you seeing “a 2-3 inch black area on the top and bottom of the” widget? -
No I’m not. Would you mind pasting the code for me. I just want to examine it, see if anything is different about it besides the w/h. Thanks a bunch!
-
[gigya src="http://player.wizzard.tv/player/o/i/x/131163535155/config/k-db1a0918a707aa69/uuid/root/episode/k-74fbad32ffeec837.m4v" name="movie" menu="false" type="application/x-shockwave-flash" AllowScriptAccess="always" AllowFullScreen="true" width="196" height="148" ] -
Looks like I got it to work with the code you provided. Thanks a bunch. So for future reference, this code should work from now on, and for new episodes I would just paste in the new episode code for
“http://player.wizzard.tv/player/o/i/x/131163535155/config/k-db1a0918a707aa69/uuid/root/episode/k-74fbad32ffeec837.m4v”
And keep the rest of the code the same, correct?
(Not sure if it is already auto-set to always play latest episode, it is on the other website that you aren’t able to view)
-
- The topic ‘Embedding Podcast episode/mp3 audio file into sidebar widget’ is closed to new replies.
WordPress.com Forums 