Is there any way embed Google mobile-friendly tool in my website? - mobile

I have a PHP site and want my visitors check mobile-friendly tool via Google.
https://www.google.com/webmasters/tools/mobile-friendly/
Is it possible embed this tool on my site? Or any solution?

I had the very same question and eventually came up with the following solution
<iframe src="https://www.google.com/webmasters/tools/mobile-friendly/" width="600" height="500"> <p>Your browser does not support iframes.</p> </iframe>
This works fairly well but ironically the iframe is not responsive enough to all devices!! Looking for code to make the iframe auto respond and would appreciate any ideas..

Related

How can i render a pdf, doc or docx file in reactjs web app

I have a built a react app. Where i want to render pdf, doc or docx files dynamically.I tried google document viewer and Microsoft Office 365 viewer Both are not consistence.
Is there any react library for rendering such documents that is consistence and reliable?
I also have tried react-file-library and it always show LOADING 0%. That also doesn't work
I've found many libraries fail miserably or the simply won't support. But, since it was a requirement for my project, i had to find a way. i once heard about google api's and just searched can it be done with that and came up with
<iframe className={filetype} width="100%" height="600" frameborder="0" src={`https://docs.google.com/gview?url=${file_url}&embedded=true`}></iframe>
just plug your file_type and file_url into the given api(it requires internet since it an api..).
ps: just for you to know there are many api's by google, windows etc, does the same..
I recommend looking at https://github.com/babel/babel-loader/issues/173 for the solution to your 0% loading problem. Also please see below as this solution worked for me. you need to make sure that the url is correct and the file type is as well.
<FileViewer
fileType={this.state.type}
filePath={this.state.previeURL}
/>

Embedded SurveyMonkey survey not appearing on mobile

I'm looking to embed an existing survey monkey survey into a webpage, following the instructions here:
http://help.surveymonkey.com/articles/en_US/kb/Website-Collector
which is working perfectly on desktop and tablet sizes, but for some reason not working on mobile (either on an android device or in chrome emulator)
The following steps appear to be working:
Loading embed script into the page
Embed script calls surveymonkey.com, and retrieves the SMCX script
SMCX.boot() is called
But, the survey (or its markup) does not appear in the page.
Has anyone else run into this issue? What other additional information can I provide?
The Website Collector used to work everywhere, but they changed their API and now document that mobile is not supported.
http://help.surveymonkey.com/articles/en_US/kb/Website-Collector
"Website Collectors display on desktop browsers only—not on mobile devices or tablets."
It's actually worse than not supporting mobile or tablets, their surveys don't even load on desktop browsers if your browser is currently 760 pixels or less wide.
The solution is to just iframe the web link in manually.
<iframe height="500" width="500" src="https://www.surveymonkey.com/r/XL3DDMS"></iframe>
In addition to the answer of using iframe, for iPhone, both in Safari and Chrome rendered a weird view (the spacing between each question is extremely large), and I finally tackled it by turn off the "One Question at a Time" option, hope this helps someone.

Hybrid App IFRAME youtube embedding not working

I'm using ionic framework and got the error of "This video contains content from Vevo. It is restricted from playback on certain sites. Watch yon YouTube".
To reproduce my problem technically, try to post below code into your hybrid app and see the result in the android phone.
<iframe width="560" height="315" src="http://www.youtube.com/embed/09R8_2nJtjg" frameborder="0" allowfullscreen></iframe>
If you doesn't white-list the domain that you access outside the application will be blocked for security reason . In the case of Intel xdk please add the domain name in white-list as https:///
Click to view the screen shot

cakephp site within an iframe

I have developed a site using cakephp 2.x.
I want to show cakephp site in another site using iframe.
When I use Iframe code in normal site, Iframe displaying blank content with provided styles.
Below is the Iframe code
<iframe
src='http://mycakephpsite.com/'
width='600' height='800'
frameborder='1'
scrolling='yes'
align='bottom'
style='border:1px #68293c dotted;'>
</iframe>
Please let me know where I am doing mistake.
Thanks in advance.
This iframe works for me:
<iframe
sandbox="allow-scripts allow-forms allow-same-origin"
src="http://www.mycakephpsite.com/">
</iframe>
I think you may have an issue with your web server headers, check your X-Frame-Options option
https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

how to build a mobile website using html on ubuntu 12.04

I'm working on a simple mobile website for a hotel.they don't need much dynamic feature.most are simple HTML.So my question are as below.
I find it's hard to debug mobile website on Ubuntu.cause you know ,desktop browser are to big to show a mobile website.each time i need to put it on a server.then using a phone to test the mobile website.is't too annoy.is there a better way to do this?
On windows u have Dreamweaver to change the css style.but on Ubuntu can I find a tool like Dreamweaver?
is any any JavaScript code for animation for a mobile website.
Jquery mobile is a good js lib to create the basic element in webpages.but if I want to do some transition between pictures.how could I do that.
PS:if you want to use php to send a email to a email address how to do that?
In chrome you can emulate a mobile device, the viewport and user agent will adjust to desired device. In your developer tools you have something called Emulation where you can change your device.
Link!
To send a email with PHP, check the documentation:
Link to php docs
FWIW, I would reccomend you start with a resposive framework. There are plenty of great options, including Bootstrap , Foundation or Skeleton
From what you describe about your requirements, responsive is going to be a good fit for your client and you'll future-proof your design.
Then with a responsive design, you can test everything in a standard web browser by making the viewport or window wider or smaller.
Good luck!

Resources