Showing posts with label JavaScript. Show all posts
Showing posts with label JavaScript. Show all posts

Floating Widgets in a Blogger Post

(Note: Those of you using ad blockers will need to turn them off to see examples in this post.)

In my last post, I explained what to do if your JavaScript widgets, added to the body of a post in your Blogger blog, weren't displaying. But doing that didn't solve all my problems and may not solve all yours. If your widgets are aligned to the left (or right if you write in a right-to-left language) and put an ugly break in all but one line of text beside them, this tutorial is for you. While I've only tried this with Amazon widgets, it should work with any copy-and-paste widgets with a preview page.

This   is what an Amazon widget looks like when it's an inline element, which the MP3 Clips widget is by default. It's fine for small images that are used as icons or to display foreign scripts that the user may not have fonts for, but it's ugly for images of any significant size, as well as for video embeds and most Amazon widgets.
Share/Save/Bookmark

JavaScript Widgets Within a Blogger Post

When adding the Amazon song-preview widget to my last post, I ran into two problems specific to Blogger. Since I'm probably not the only Blogger blogger who uses Amazon Associates widgets or any other kind of JavaScript widgets within posts, I thought I'd share the problems and solutions here.

Amazon does offer an "Add to Blogger" option for widgets, but it adds them to your blog's sidebar. If you want to tie a widget to a specific post, you'll have to copy-and-paste the code manually. When I did this, the widget didn't display at all even after the post was published. (It's normal for them not to display in Preview or Compose mode, since <script> tags are suppressed in these modes.)
Share/Save/Bookmark