I have been using the Facebook Like Box in this template, it's showing good in opera, IE, and Firefox. But its not showing in chrome and safari, just showing a blank space. Bottom right section, under the meet us on title.
Please click this link
Try using https:// protocol to load the iframe
so you will have:
<iframe id="facebook" frameborder="0" scrolling="no" allowtransparency="true" style="border:none; overflow:hidden; width:314px; height:240px;" src="https://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FFacebookDevelopers&width=314&height=290&colorscheme=dark&show_faces=true&header=true&stream=false&show_border=true"></iframe>
Related
I have page where all I need is a simple, full-width embedded google map. When I set the custom size of the map to 1980px x 240px, and put the iframe on my page, the width of the map is 1200px by default.
When I open Chrome DevTools window and find the iframe there, there is a style forced to the iframe, that is not in the original iframe I pasted from google maps.
The website is build on Wordpress. Link: https://zubar-litomerice.cz/
The original iframe:
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d12061.22772549553!2d14.12158474671251!3d50.54234042444077!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47097f6dc0e9276d%3A0xa7e584e5a1a520cc!2sHavlov%C3%A1+Hana+MUDr.!5e0!3m2!1sen!2scz!4v1533828352977" width="1980" height="240" frameborder="0" style="border:0" allowfullscreen></iframe>
Forced style:
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d12061.22772549553!2d14.12158474671251!3d50.54234042444077!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47097f6dc0e9276d%3A0xa7e584e5a1a520cc!2sHavlov%C3%A1+Hana+MUDr.!5e0!3m2!1sen!2scz!4v1533828352977" width="1980" height="240" frameborder="0" style="border: 0px; width: 1200px; height: 145px;" allowfullscreen=""></iframe>
I have searched for answers before asking and could not find anything, but maybe you can help me find the answer I am looking for.
I have a div container and Iframe inside. I assigned width=200 and height=200.
when I click on full screen, the video becomes blurry with very bad quality. So, I wanted to see if it is possible to disable full screen on youtube iframe.
"I used ?controls=0 at the end of my url and it resolved the issue."
Your answer doesn't solve the problem, you can toggle full screen also double clicking the video. I tried allowfullscreen="0", doesn't work as well.
The same is for ?showinfo=0; also doesn't work.
?showinfo=0 works only if you change link:
https://www.youtube.com/embed/Di2KMatiGAM?controls=0&showinfo=0
to:
https://www.youtube-nocookie.com/embed/Di2KMatiGAM?controls=0&showinfo=0
Use the iframe tag without allowFullscreen to disable the button on the player, for example:
<iframe src="https://www.youtube.com/embed/12345"></iframe>
To allow fullscreen just add allowFullscreen:
<iframe allowfullscreen="0" src="https://www.youtube.com/embed/#(item.VideoUrl)"></iframe>
when you have a video on youtube you can share it. it also displays an option to embed it.
you probably have a <iframe></iframe> in your code
mine looks like this:
<div class="IFR" alt="-">
<iframe width="560" height="315" src="https://www.youtube.com/embed/AdfFnTt2UT0 rel=0&controls=1&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" donotallowfullscreen>
<p>
Your browser does not support Iframes <br>
I suggest that you use Google Chrome or FireFox
</p>
</iframe>
</div>
the thing that matters here is "donotallowfullscreen".
if you set this to "allowfullscreen" you will be able to use fullscreen.
TLDR: in the Iframe tag where your YT video is located, add "donotallowfullscreen" at the end. and its fixed
I used ?controls=0 at the end of my url and it resolved the issue.
<iframe title="video player" src={videoSrc} allowfullscreen="0"/>
React- Full Screen Fix for youtube API
You can remove the full-screen option from the youtube embed video by using fs parameter in the youtube embed URL
Example:- youtube embed URL https://www.youtube.com/embed/youtubeid
Add query parameter of fs in the above URL
https://www.youtube.com/embed/youtubeid5?fs=0
Special thanks to ecoe
To allow fullscreen in iframe add allowfullscreen attribute in the iframe
<iframe class="iframe-embed" [src]="url_link|safe" allowfullscreen>
</iframe>
Trying to add my bands like box to my website. I have done this for other websites and it has been fine but this page doesnt display any news feed or anything. I have heard that it wont show posts older than 30 days but I have much newer posts.
ANy help would be much appreciated.
page is www.facebook.com/Sidewaystheband
Existing code:
<iframe src="facebook.com/plugins/…; scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:400px; height:447px;" allowTransparency="true"></iframe>
Cheers
As I can see from your code that, the src attribute missed a closed double quote.
The code should be:
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FSidewaystheband&width=292&height=590&show_faces=true&colorscheme=light&stream=true&border_color&header=true&appId=YOUR_APP_ID" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:590px;" allowTransparency="true"></iframe>
p.s. recommend to use HTML5 approach if possible
So I used this code rather than the XFBHL/HTML5 code
<iframe src="http://www.facebook.com/plugins/comments.phphref=http://9gag.com/gag/5852530&num_posts=2&action=comment&scrolling=yes&"
scrolling="yes" frameborder="0" style="border:none; overflow:hidden;
width:470px; height:400px;" allowTransparency="true"></iframe>
As you can see I already set scrolling to yes but still the comments are limited to its dimension.Another problem is how can I limit the number of posts? the num_post isn't seem to work in this code.
I have a problem with multiple iframe in firefox on my wordpress site.
I have a twitter "tweet" button and a facebook "like" button. Both of them are iframes that I embed on my site. So far no problem. BUT when I make a post which has got an iframe embedded Vimeo clip in it, the Vimeo clip gets replaced by the "like" button, and the "tweet" button has taken the "like" buttons original position.
I have tested this in Firefox and Chrome. In Chrome it all looks good, but not in FF.
The facebook embed code:
<iframe id="facebook" name="facebook" src="http://www.facebook.com/plugins/like.php?href=<?php echo($url); ?>&layout=button_count&show_faces=false&width=90&action=like&font&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:90px; height:21px;" allowTransparency="true"></iframe>
The Twitter embed code:
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
Tweet
The embedded Vimeo code in the post:
<iframe src="http://player.vimeo.com/video/22382565?color=17bcda" width="400" height="225" frameborder="0"></iframe>
If you look at the top post there should be a Vimeo clip just below "testing testing testing...". And on the left sidebar you can see the two tweet buttons, which should be one tweet and one like. I want to point out though that all of this is working fine at my localhost. http://www.bentrovato.se/index_wp.php/
Any idea what the problem could be?
I had a similar problem and fixed it by clearing cache
Click the Firefox button > Options > Options > Advanced.
In the Cached Web Content section click on Clear Now.