Hi everyone,

One thing I’ve noticed when inserting an Amazon iframe into my page or post is that it always defaults to the left hand side and the text is displayed either above or below the iframe. But what if you want the iframe box to be displayed on the right hand side within the text? This tutorial is going to demonstrate how you can make minor changes to a couple of the attributes within the iframe tag to do just that!

Let’s get started…



Join the Discussion
Write something…
Recent messages
Dado67 Premium
Hi Compsol99
Thank you for this training. I did everything I could to follow it but still no success. Can you please tell me where to insert align="left" or align="right" in this example?
<iframe style="width:120px;height:240px;" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" src="//rcm-na.amazon-adsystem.com/e/cm?lt1=_blank&bc1=FFFFFF&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=myfloorsclean-20&language=en_CA&o=15&p=8&l=as4&m=amazon&f=ifr&ref=as_ss_li_til&asins=B009ZJ2M7G&linkId=e46b4b8cca57074d65fa6058781edbf4"></iframe>
Reply
DaveBuckley Premium
Hi Ermin. Is this a coding issue?
Reply
Dado67 Premium
Hi DaveBuckley
I am not sure, I can not wrap text around Amazon image+text link
Reply
Compsol99 Premium
Hi Ermin,

You need to include the attribute align="left" or align="right" within the iframe tag. If you look at page 4 of this training you will notice this attribute highlighted within a red box. This should help with your question. Make sure you save the page you're working on and then view the page. You may have to refresh the page for the changes to take effect.

Hope this helps!

Shawn
Reply
Dado67 Premium
Thank you Shawn
When you say to include atribut align="left" or align="right" within the frame, does it matter where?
I have tried several spots and it still doesn't work for me.
Reply
Compsol99 Premium
Hi Ermin,

Have you tried adding the align="left" attribute after the width and height attribute like in the attached image? Forget about all the different code that you see within the <iframe> tag (highlighted in blue). Just use the code that is highlighted in red and notice that it is placed beside the width and height attributes.

Hope this helps to clarify things.

Regards,

Shawn
Reply
Dado67 Premium
Hi Shawn,
I did everything you suggested but it didn't work. I don't know why because it works for other people. After that I did my own research and found this
https://generatepress.com/forums/topic/wrapping-text-around-html-on-page/
Miraculously, this worked.

Thank you so much for your help.
Ermin
Reply
Tomoko1 Premium
Hi Ermin,
I am working the same issue, but does not work. Did you type float: left; after width and height? I did it but still does not work. Could you tell me how it worked.
Thank you,
Tomoko
Reply
dianegailit Premium
Thank you so much for this, Shawn! I have added to my favorites :-)
Reply
Compsol99 Premium
My pleasure Diane!
Reply
Ivine Premium Plus
Hi, thanks for the tip. Irv.
Reply
Compsol99 Premium
My pleasure Irv, I hope you find it useful!
Reply
Westwaters Premium
Thanks for this valuable information. Figured there had to be a way to realign, but just worked with what was presented. Very helpful:-}
Reply
Compsol99 Premium
My pleasure Kathy, I hope you find it useful.
Reply
Brandy-W Premium
Thank you so much! I've been wondering about this for awhile.
Reply
Compsol99 Premium
My pleasure Brandy, I hope it works for you.
Reply
jvranjes Premium
It works but align="right" is automatically moved on the back, which is not important obviously.

Problem is the text remains too close to the box.
Reply
Compsol99 Premium
That's why if you change the size of the width and height attributes, you'll be able to space the text a little further away. If you change the width to 135 instead of 120 and the height to 255 instead of 240, that should help space things out a bit more for you.
Reply
jvranjes Premium
Yes it helps, thank you.
Reply
Top