I am embedding a Google Drive folder's content into my website, via the following code (as suggested here):
<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID#list" style="width:100%; height:600px; border:0;"></iframe>
I am trying to sort it by name in descending order, but I have not been able to do so.
I tried with what was suggested here, but nothing seems to work.
Here are some of my attempts:
<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&orderBy=name,desc#list" style="width:100%; height:600px; border:0;"></iframe>
<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&orderBy=desc,name#list" style="width:100%; height:600px; border:0;"></iframe>
Thanks!
In the sample
orderBy=folder,modifiedTime desc,name
you are refering to:
desc refers to modifiedTime.
You should interpret the sample as:
"Order by ascending folder, descending modified time and ascending name"
In your case:
The r query for Files: list should be orderBy=name desc
Related
I want to build a website for a local football (soccer) team but I'm not sure how I can display the league table standings on the site which are available at http://wnl.org.uk/tables.htm.
I can create an iframe but it pulls in the entire page and I only need one of the tables. I would also like to make it responsive and apply my own styles to be consistent with my theme.
It's only an amateur league so it's not available via opta or something similar so I'm unsure what's the best approach.
Can any one help - This question is more of a how can I do something rather than this is what I've got. I'm not sure how I can achieve it.
If the page you want to fetch the data from is inside your server you can use the jQuery .load() function like this: (this method is without the iframe)
<div id="target-div">
</div>
And than use this code:
$('#target-div').load('./tables.htm #main');
When this method executes, it retrieves the content of ajax/test.html, but then jQuery parses the returned document to find the element with an ID of container. This element, along with its contents, is inserted into the element with an ID of target-id, and the rest of the retrieved document is discarded.
.load() jQuery Documentation
But this can only be done if this site is inside your server, because it gets the contents using AJAX.
Hope this helps.
Another Way
If you want to do this with iframe you can use some css-tricks to display only the part of the page you want.
<div style="border: 2px solid #D5CC5A; overflow: hidden; margin: 15px auto; max-width: 575px;">
<iframe scrolling="no" src="http://wnl.org.uk/tables.htm" style="border: 0px none; margin-left: -36px; height: 812px; margin-top: -486px; width: 650px;">
</iframe>
</div>
Source: http://www.dimpost.com/2012/12/iframe-how-to-display-specific-part-of.html
The downside of this is that you will need to test different values for the margins of the iframe and the width of the div manually until you get the result you want.
Shortest way using PHP
1) Create a file "tables.htm" and leave it empty.
2) Create a file "test.php" (Make sure those are in the same folder).
3) Add there this lines of code:
<?php
$contents = file_get_contents("http://wnl.org.uk/tables.htm");
$file = fopen("tables.htm", "w") or die ("Unable to open file");
fwrite($file, $contents);
fclose($file);
echo "Successful";
?>
4) Run this file in your browser. This will write the contents of the file in that website to the file "tables.htm" in your Server.
5) Now that the file is written access its data using the .load() function I mentioned above.
<div id="target-div">
</div>
<script>
$('#target-div').load('tables.htm #main');
</script>
6) If you have option "Cron Jobs" in your host, use that to make the script "test.php" run in a specific time without you needing to run it in your browser manually.
This is the best way you can do it, and the best part is that you can change the style of the elements as well.
I am working on a personal site, and the site uses an <iframe> to display most of its contents. You navigate the site by changing the target of the <iframe> to a specific .html.
Here's an example of how the navigation works:
<ul>
<li><a>onclick="document.getElementById('iframe1').src='home.html'>Home</a></li>
<li><a>onclick="document.getElementById('iframe1').src='prjcts.html'>Projects</a></li>
</ul>
<iframe src="home.html" id="iframe1"></iframe>
The problem that I've encountered is that since most things are is inside of the <iframe> that I can't link directly to any specific content.
If I wanted to show someone the Projects page, I can only link "www.example.com/" and tell them to navigate there themselves, and not simply link "www.example.com/projects".
My theory is that you can do it with something like:
"www.example.com#projects" using ID's or something, but since I'm pretty new to HTML5, I might be completely wrong. I have no idea how to make it work, and I can't seem to find anyone explaining it.
Is there any way to use the URL to specify an <iframe> target, and if so, how?
You would want to check the url and then set the src of your iframe using the url:
This is just an example of how you could do it, you should use maybe an array of URLs. There are a bunch of ways to accomplish this.
HTML:
<div id="wrapper">
<iframe id="myIframe" src="http://example.com/"></iframe>
</div>
JavaScript (using jQuery here):
$(document).ready(function () {
var myPath = window.location.pathname; // returns something like /projects.html
if (myPath == "/projects.html") {
$('#myIframe').src = "http://www.example.com/projects.html"; // sets the src of your iframe
}
});
Refer to this post's answer: dynamically set iframe src
i need to make my iframe to show me a specific area of a website in my page.
i failed to find the answer on the internet, i tried several codes but nothing seems to work.
if anyone is kind enough to show me how to do the exact location - i need it to be where the scrolling news part is. thank you!
this is my code-
<section><iframe src="http://www.walla.co.il" scrolling="no" frameborder="0"></iframe></section>
the css -
iframe { width:130px; height:275px; position:absolute; top:40px; left:55px; clip:rect(692px 682px)}
You can use window.scrollBy as commented by anishsane, as long as you know how many pixels to scroll. But this will obviously change as the second pages design changes.
If this is a page under your control, this is an acceptable solution, and you now need to figure out how to remove the scrollbars (IE has posed problems for me in the past).
If this page is from another domain, you have another problem to deal with. The cross domain policy for iframes.
This does what you want...
<html>
<head>
<script>
function scrollTheIframe()
{
var frame = document.getElementById("ifr");
frame.contentWindow.scrollTo(350,300);
}
</script></head>
<body onLoad = "scrollTheIframe()">
<iframe src="r.html" id="ifr" width="500">
</iframe>
</body>
</html>
The above example does expect the page (in the iframe) to load very fast... If updated the source to an external site, such as bbc.co.uk then it didn't function. the r.html I've used in the above was a very small file.
I am using this code in my website to show Google search results for my website :
<!-- Search block -->
<div class="searchBox">
<form method="get" action="http://www.google.com/search">
<input type="text" name="query" class="searchField" />
<input type="hidden" name="sitesearch" value="my_website.com">
<input type="submit" value="" class="searchSubmit">
</form>
</div>
I like that simple code and i do not prefer to use Google Custom Search, but is there a way to show the output of this search embedded in a page i specify ?
Bing has a much better terms of use and an excellend API when it comes to site search integration.
It lets you take the XML that is returned and pretty much do whatever you want with it as long as you reference that your search is being powered by Bing somewhere in the result list.
Checkout my post here http://www.foliotek.com/devblog/integrating-bing-search-results-within-a-web-app-using-net/.
As far as Google results your only option is to use there built in frameing. The fully custom search cost were super high when I looked to do it behind SSL. For more information on Google Custom Search go here http://www.google.com/cse/.
Real World Bing Example A: http://www.mshsaa.org/Search/?q=basketball
You could read the content from the page with file_get_contents and than read out the parts you need and display them on your page.
http://php.net/manual/en/function.file-get-contents.php
Looking at the terms and services for Google CSE (at the time of writing this):
1.3 Your Obligations. You shall receive a Query from the End User and shall forward that Query to Google. You may not in any way frame,
cache or modify the Results produced by Google, except as otherwise
agreed to between You and Google.
Seems to imply that I have to show the search results in the standard google page and not my own. Will look at Bing.
You could use the argument igu=1
Example: Do you want to embedd the results of "Adelle"
Your URL shoud look like this: https://www.google.com/search?igu=1&q=Adelle, where q=Adelle is the query you want to search and igu=1 is set to allow iframe embedding.
Run the code snippet to see the result:
iframe {
width: 400px;
height: 200px;
border: 1px solid black;
border-radius: 5px;
}
With igu=1: <iframe src="https://www.google.com/search?igu=1&q=Adelle"></iframe>
<br>Without igu=1: <iframe src="https://www.google.com/search?q=Adelle"></iframe>
I'm having a problem while implementing facebook registration tool.
I've followed the steps described on facebook docs and here is my code:
<iframe src="http://www.facebook.com/plugins/registration.php?
client_id=ID&
redirect_uri=redirect_url&
fields= [
{'name':'name'},
{'name':'email'},
{'name':'location'},
{'name':'gender'},
{'name':'birthday'},
{'name':'password', 'view':'not_prefilled'},
{'name':'like', 'description':'Do you like this plugin?', 'type':'checkbox', 'default':'checked'},
{'name':'phone', 'description':'Phone Number', 'type':'text'},
{'name':'anniversary','description':'Anniversary', 'type':'date'},
{'name':'captain', 'description':'Best Captain', 'type':'select', 'options':{'P':'Jean-Luc Picard','K':'James T. Kirk'}},
{'name':'force', 'description':'Which side?', 'type':'select', 'options':{'jedi':'Jedi','sith':'Sith'}, 'default':'sith'},
{'name':'live', 'description':'Best Place to Live', 'type':'typeahead', 'categories':['city','country','state_province']},
{'name':'captcha'}
]
" scrolling="auto" frameborder="no" style="border: none" allowtransparency="true" width="100%"
height="330"></iframe>
And I'm facing with this error message:
Unknown name: ' [ {'name':'name'}'. Either switch from CSV to JSON to use custom fields, or check that you spelled the field correctly.
Any help would be really appreciated
I think that your error here is that the iFrame cannot take custom fields (as far as I recall). It looks like you copied the code from the sample, and merged it with the set of fields. Whenever I have done this, and in their example, customs fields are use with the XFBML version of the page. For instance, their code (for the fields demo you used) is actually:
<fb:registration class=" fb_iframe_widget" redirect-uri="https://developers.facebook.com/tools/echo/" fields="[ {'name':'name'}, {'name':'email'}, {'name':'location'}, {'name':'gender'}, {'name':'birthday'}, {'name':'password'}, {'name':'like', 'description':'Do you like this plugin?', 'type':'checkbox', 'default':'checked'}, {'name':'phone', 'description':'Phone Number', 'type':'text'}, {'name':'anniversary','description':'Anniversary', 'type':'date'}, {'name':'captain', 'description':'Best Captain', 'type':'select', 'options':{'P':'Jean-Luc Picard','K':'James T. Kirk'}}, {'name':'force', 'description':'Which side?', 'type':'select', 'options':{'jedi':'Jedi','sith':'Sith'}, 'default':'sith'}, {'name':'live', 'description':'Best Place to Live', 'type':'typeahead', 'categories':['city','country','state_province']}, {'name':'captcha'} ]">
I think that your format is correct. Try using the XFBML plugin, and I think that it will work fine.
I managed to get it working with the iframe after I removed the extra whitespace within the fields parameter. Not sure why.