Embedding a Google Group into a website - iframe

I'm embedding a group into a (non-Google) website and getting a blank page.
I've added the code that the 'Manage your Group' gives, which is below.
<iframe id="forum_embed"
src="javascript:void(0)"
scrolling="no"
frameborder="0"
width="900"
height="700">
</iframe>
<script type="text/javascript">
document.getElementById('forum_embed').src =
'https://groups.google.com/forum/embed/?place=forum/the-sophia-club'
+ '&showsearch=true&showpopout=true&showtabs=false'
+ '&parenturl=' + encodeURIComponent(window.location.href);
I have tried removing the &parenturl with no success.
I also tried saving the code on a simple html doc by itself, and it still gives me a blank page.
Here's the code for the single page...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<p>Testing</p>
<iframe id="forum_embed"
src="javascript:void(0)"
scrolling="no"
frameborder="0"
width="900"
height="700">
</iframe>
<script type="text/javascript">
document.getElementById('forum_embed').src =
'https://groups.google.com/forum/embed/?place=forum/the-sophia-club'
+ '&showsearch=true&showpopout=true&showtabs=false'
+ '&parenturl=' + encodeURIComponent(window.location.href);
</script>
</body>
</html>
Any ideas on what is going wrong??

The issue is that your document is xhtml instead of html. The two standards are different and Google doesn't seem to like xhtml.
xhtml seems to be dead unfortunately, so try changing to html5. The only required change should be in the doctype declaration.
Also, the embedding didn't work when I opened the page using my web browser pointing to a local directory. However it did work when I uploaded the page to the web server.

Related

get html content from epub.js

By using epub.js. epub file is parsed into iframe.
like
<iframe id="epubjs-view-2d154c70-dc91-4704-bd66-821ad4de4a9f" scrolling="no" sandbox="allow-same-origin" enable-annotation="true" srcdoc="<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"><head><base href="http://localhost:4343/text/part0003.html" />
<title></title>
</iframe>
How to get the iframe list by code.
I'm trying to display the results parsed by epub.js in turn.js.
Thanks.

Audio Player not appearing when trying to play audio file (wav) stored in client machine in google chrome in ASP.net

<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm11.aspx.cs" Inherits="omos.WebForm11" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<object data="file:\\\n:\test\abc.wav" style="width: 100px" />
</div>
</form>
</body>
</html>
My ASP page will call the above html page. It work well in IE (the audio player appeared and start to play), but for google chrome, the audio player doesn't appear. The audio file n:\test\abc.wav is stored in another file server (i.e. n drive is not the Web Server). If I store the audio files in the web server, both IE and Google Chrome work fine, but my audio files have to be in another server.
Why IE can work and Google Chrome cannot (same code), why like that? I am headache, any one got Panadol?
Following code should work:
Note: We have checked in IE 10 & latest version. May not support in IE-8/9. Please excuse.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var activeobj = 0;
if (window.ActiveXObject) {
document.write("<object data='horse.wav' style='width:400px;' />");
} else {
document.write("<audio controls><source src='horse.mp3' type='audio/mpeg'> Your browser does not support the audio element.</audio>");
}
</script>
</head>
<body>
<div>
</div>
</body>
</html>

Errors "noscript", W3C XHTML

I am trying to validate my document as XHTML 1.0 Transitional (W3C).
I have the following error:
"document type does not allow element "noscript" here; assuming missing "object" start-tag"
which corresponds to this code:
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
</noscript>
</head>
But I get this validation failing. What is the problem? Please help me to solve this.
One of your solutions could be to place it in the body instead of the head of your document as following:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
</noscript>
</body>
</html>
This results in:
This document was successfully checked as XHTML 1.0 Transitional!
Additionally, according to this answer, it seams that it doesn’t really make difference (I'm talking about head vs body here):
Have done the move with the Google Ad section outside of HEAD and just
in the BODY part itself. Really doesn't make a difference since when
it was moved, it was just right after the parameters used for the ads
to display.
Solution #2
In case You will need to get rid of the <noscript> at all, You can try to make the following:
<div id='noscript' style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
<script>document.getElementById('noscript').style.display='none'</script>
This makes things work absolutely the same as in the first solution. If JavaScript is disabled, <script>...</script> won't be executed, thus <div>...</div> would be shown.

Intuit Partner Platform (IPP) QuickBooks Online (QBO) BlueDot Menu ASPX page not rendering in Internet Explorer (IE)

I have an .aspx page to display either the BlueDot or ConnectToQuickBooks buttons.
The resultant HTML looks like this, as collected from the IE page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>TrueCommerce to Intuit Connect Page</title>
<script type="text/javascript" src="https://appcenter.intuit.com/Content/IA/intuit.ipp.anywhere.js"></script>
<script type="text/javascript">
intuit.ipp.anywhere.setup({
menuProxy: 'http://localhost:1384/MenuProxy.aspx',
grantUrl: 'http://localhost:1384/OauthGrant.aspx'
});
</script>
</head>
<body>
<div id="blueDotDiv">
<ipp:bluedot></ipp:bluedot>
</div>
</body>
</html>
This code will not display in IE. It will display fine in Chrome and Firefox.
I validated the HTML with W3C Markup Validation Service and only received an error on the tag, which was to be expected.
I am using the following IE Browser
IE Version: 8.0.7601.17514 64-bit Edition
We are using Silverlight and have embedded the ASPX page utilizing the Infragistics HTML Viewer Control - Silverlight xamHtmlViewer. The BlueDot Menu does not appear when called from either inside of the xamHtmlViewer or called directly (though it works both ways in Chrome and Firefox).
Any Ideas?
https://ipp.developer.intuit.com/0010_Intuit_Partner_Platform/0025_Intuit_Anywhere/0060_Reference/Widgets/0010_Connect_Button
To display the Connect to QuickBooks button in IE8, the html xmlns attribute is required, for example:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ipp="">

IE 9 - text in text box got cut off after changing font-size (in percentage)

I got a weird behaviour in IE 9 (while firefox works fine) when I try to change the font-size of a fixed width texx box from 100% to 200%. The text in the input box got cut off partially. I don't know why and
I put my source and script in the below url.
http://jsfiddle.net/VVyQm/3/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="en" />
</head>
<body>
<input style="width:100px;font-size:100%" type="text" value="abc"/>
</body>
</html>
The problem is caused by some settings in the jsfiddle environment. Testing the following document directly in IE 9 does not exhibit the problem:
<!doctype html>
<meta charset=utf-8>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<input style="width:100px;font-size:100%" type="text" value="abc"/>
<script>
$('body').css('font-size', '200%');
</script>
Thus, if the problem occurs in your environment outside jsfiddle, then it’s apparently caused by some other code, such as a library or framework being used.
For IE you can refresh values in inputs after changing font size. After that displaying will be correct.
<input id="example_id" style="width:100px;font-size:100%" type="text" value="abc"/>
<script>
$('body').css('font-size', '200%'); <!-- change font size -->
$('#example_id').val($('#example_id').val()) <!-- refresh value-->
</script>

Resources