Never had any problems, perhaps following an update, now all the elements contained in an iframe are displayed with a black outline and scroll bars.
You can see it for example in this article
Didn’t happen before how can I solve?
Thank you
Hello,
Please let me know how you set the code, if you used the embed element from WordPress please try the solution from these topics
-> https://stackoverflow.com/questions/58040893/disabling-hiding-iframe-scroll-bar
-> http://onlinekitab.com/disable-horizontal-scrollbar-from-iframe/
Hope this help you!
Thank you!
Hi, I try to explain myself better.
I’ve always used amazon affiliate links on my site and the code is autogenerated by amazon.
The iframe has always shown up fine in the pages without doing anything.
Now since a few days, (I don’t know if after the last update), I got out the borders on all the hundreds of iframes contained in the hundreds of articles of the site.
So I couldn’t edit any single iframe, and anyway it seems that already the iframes contain frameBorder=”0″ and even adding scrolling=”no” the iframe keeps both borders and scrolling.
Strange thing is that the iframe in editor mode displays fine:
https://tinyurl.com/y3puf8ub
This is iframe in image:
<iframe style="width: 120px; height: 240px;" src="https://rcm-eu.amazon-adsystem.com/e/cm?ref=qf_sp_asin_til&t=karmaweb-21&m=amazon&o=29&p=8&l=as1&IS1=1&asins=B01NAASUGT&linkId=00e79f71f5cc507353aef3ded3894b50&bc1=ffffff<1=_blank&fc1=333333&lc1=d143be&bg1=ffffff&f=ifr" frameborder="0" marginwidth="0" marginheight="0" scrolling="no">
</iframe>
Hi,
The problem is from the extra border set on 2px on each iframe, unfortunately right now I do not know if this is a default css or is coming form some plugin, but to fix it just use this code
iframe {
border: 0;
}
Set the code in the theme panel > custom code> custom css.
I hope it will help you!
Let us know the results!
for amazon iframes seems solved by adding this code:
iframe {
border: 0 !important;
margin: 0 !important
overflow: hidden !important;
}
but the iframes that the template automatically creates when I add an internal link still have the scroller… see the image:
https://tinyurl.com/y564euhe
I also never understood why the template when I add an internal link to another article sometimes shows me the article in the iframe as in the image above and some other times in this other way:
https://tinyurl.com/y4hz48zl
any other idea?
-
This reply was modified 4 years by
ermannaro.
Hi,
For me all ifreme seems to look good now -> https://i.imgur.com/bid5UYQ.jpg
When you are use a plink from a post in another post this is display in an iframe because it is taking the post like an object and not pa post element, in this way was WordPress made.
Thank you!
Hi,
The dimension depends the width that it is set on iframe, for example here is coming 100% for -> https://prnt.sc/217pm95
Thank you!
That’s exactly what I’m saying… why some posts are displayed with that wrong layout and others are no?
As you can see from your image attached to the previous post, the image that is used by the template for that type of display is 150px and is enlarged in fullscreen, damaging itself.
While in the first iframe, WHICH I have inserted in the same way, that is copying/pasting the link of the article, the image remains 150px in the correct layout without stretch.
I would like to understand why some included articles have the correct layout and others don’t.
So that I can make sure that they are all shown in the correct way, … correct layout …
The example article to see is: https://www.viviliberamente.com/5-tipi-di-meditazione-consapevole-per-ridurre-lo-stress/
and I’ve disabled the content copy protection so you can see the code better to help me.
Thanks a lot
Hi,
From what I saw the iframe is set by default on “width: 600px; and height: 640px;” and sometimes the css code is overwrite with “width: 100%;”.
So the solution that I can suggest is to use this custom css :
body .wp-embed-featured-image img {
width: auto;
}
Set the code in the theme panel > custom code> custom css.
Hope this will help you!
Your code does not solve the problem even if it is correctly applied.
The problem is not in the format of the iframe but in the class that is associated… see image:
https://tinyurl.com/y4edtu3t
Question is… why this link have this class (see image):
https://tinyurl.com/yyclq9j2
and this link have this other class? (see image):
https://tinyurl.com/yyc9scn5
I would always this class wp-embed-featured-image square
but in article I haven’t any control.. I copy/past only the link…
is there a code to force this class always?
Hi,
I made some investigations on my install and I set the link of post in embed element and I also past the link directly in the post and the only class that is apply for me is
wp-embed-featured-image square this class “square” is make the featured image small, the class rectangular has no css to apply.
Those classes are coming from the posts and are used inside the iframe to display the featured image.
T looks that it can not set a css for the classes inside the iframe, this is not apply, that it is way the above code is not working.
Also I try some links from your website and this are look the same in post editor https://i.imgur.com/KVx2RGo.png does not matter if I use Newspaper or a default theme, therefore, I do not this this is related to the theme.
But if you want we can check this on your backend to be sure, for this we’ll need wp-admin access. You can provide it via email at contact@tagdiv.com and also include the link of this topic to can identify you.
Thank you!