Once a browser gets the main html page, how does it know which are the embedded content should be request again from web server, and which are only external links? Is it based on type of tags, e.g ?
If so, could someone give me a reference of what these tags are?
Thanks.
The HTML5 spec defines the element category "Embedded content":
Embedded content is content that imports another resource into the document, or content from another vocabulary that is inserted into the document.
It lists the following elements:
audio
canvas
embed
iframe
img
math
object
svg
video
Elements like link or script (both in Metadata category) can also refer to other ressources that user-agents (browsers, screen-readers, …) are free to link to or include or do whatever they want to do with it. For example, browsers like Firefox or Chromium will (by default) load and "apply" CSS that is linked within the link element, that has the rel value = stylesheet. Browsers like Lynx or w3m won't do that. They simply ignore that link.
For link, HTML5 states which link types "are links to resources that are to be used to augment the current document, generally automatically processed by the user agent":
Two categories of links can be created using the link element: Links to external resources and hyperlinks. The link types section defines whether a particular link type is an external resource or a hyperlink.
Maybe also consider the style attribute (for inline CSS), which could include a background-image url.
Yes, the tags help browser identify the resources to load. After downloading/retrieving the content the browser determines what to do with the content based on the content-type header in the response.
Related
I'm trying to create a clone of getpocket.com for learning. On that app, every saved link gets converted into a markdown; and it seems like the it's a filtered content with only the page title and body without headers, footers, etc.
I could get the page's title using puppeteer api thru different means:
using page.title()
or get the page's opengraph "og:title"
But how do i get like the summarized version containing only the main content of the page.
Note that i don't know beforehand the "css class" of the main content since i'm planning on just entering a url in a textbox and scrape that site from there.
I have found what i've needed for this scenario.
I used the Readability.js library for making webpages readable by removing some certain html tags. Here's the library.
This library is what mozilla uses behind the scenes when rendering their reader view
I am out after adding a video element in the template level as it is possible to add a button element like the following;
{action:button}
Is there any way of doing it like this;
{media:video}
I am building a custom template, that's why I should statically give such elements in the HTML so that user can see that there is a video element in the content (it is mandatory) and s/he will edit the source of with the desired URL.
Unfortunately video is not a valid tag.
See:: https://dev.weebly.com/create-the-html-layout-templates.html
The only real option would be to use Weebly's built-in Sections feature, which allows the user to add a video as a background (if that was your intention).
The only other options would be to have them hardcode the URL of the video, in your Theme, have them use the Video Element or point them in the direction of the App Center so they can use an app that provides the feature.
Let's say that I am using an AUI Carousel to display a news item slideshow.
This is a typical slideshow - a series of images with overlay text and each image/overlay text links to a web content article for the site's news.
It seems that with Liferay 6.2, it's only possible to link to a page containing the article rather than the article itself.
How does one link to an individual article?
The solution here is to use a Display Page; starting with Liferay 6.1, there is the concept of Canonical URLs (see here).
In order to use this, you need two things:
an asset publisher page (in my example here, the page is called News)
when creating the web content item, set the Display Page to the above (News)
Now the content item can be referred to via: http(s)://<site-url>/-/<web-content-item-url-title>
So, if I have a web content item with the name Come Join Us For Lunch, and a site url of http://my-site.com/, the canonical URL for this web content item will be http://my-site.com/-/come-join-us-for-lunch
However, you should always get the actual url-title from
JournalArticle.getUrlTitle()
I'm trying to create a CSS documentation library in Orchard. I want to save a description, CSS snippet and HTML snippet against each content type. The first view would show the description and CSS and HTML code written out. The second view would show a preview of what the CSS and HTML look like rendered.
cssdocumentation.com/content/item1
cssdocumentation.com/content/item1/live-preview
I've created the content type and the first view. But I'm not sure how to create the second view. I can see if I can create the alternative URL I can use the Url Alternates module to create an overriding .cshtml
To create an alternative URL I've looked at the autoroute module but this only allows you to adapt a single URL (unless I'm missing something?) and I've looked at Alias UI but this forces me to manually create an alternative URL everytime I create a content item.
Is this possible in Orchard without writting too much C#? (I'm a frontend developer so I only dabble in the behind the scenes stuff)
Thanks for any help
Best solution is to do this within your own module. But as a secondary option instead of having a second page, combine this content with your first page and hide it with CSS. When the user clicks a button to navigate to the next step render the CSS/HTML result on the same page. You can do this in many ways, here are a few ideas:
Render the CSS/HTML result out straight away on the same page but hide it. Show it when the user clicks a button
using jQuery to render the result on the client side. More dynamic if you allow editing of the HTML and CSS.
Redirecting the user to the same page with specific url parameters which you can pick up in your alternate to modify the output.
If I load a string containing HTML into a UIWebView, and that string contains objects (hyperlinks) that are relative to that string, i.e. , where there is some object with id "something," then the link works - click on it and the web view jumps to the referenced object.
What I want is to get navigation to a different file in my project, in other words as though the path to the different file were a URL.
I have found that if the href IS a URL, such as href="http://www.amazon.com", then the link works.
If I put the name of a file, OR the [NSBundle mainBundle] pathForResource: ] of that name, in the href, then the link does not work.
Is there some way I can generate the equivalent of a URL pointing to an HTML file that is in the project, so that an can link to that HTML file?
I found a solution at this link:
How to use Javascript to communicate with Objective-c code?
Essentially, the solution is to implement the UIWebViewDelegate protocol's shouldStartLoadWithRequest method, and "trap" a particular value of scheme. So my links, instead of saying something like:
<a href="http://someplace.location">
are like:
<a href="mylink://#filename.ext">
By catching attempts to load anything with scheme "mylink," I can use:
[[request URL] fragment]
within shouldStartLoadWithRequest, and get the filename.ext. I then release my previous UIWebView, load in the contents of the specified file, and make that the contents of a new UIWebView. The effect is that the links work with normal appearance, even though they are being implemented with my code. I return NO because I don't want the usual loading to take place. If the scheme is NOT mylink, I can return YES to allow normal operation.
Regrettably, I still have no way to jump TO a fragment within a web view. In linking to a real URL, you can say something like "www.foo.org#page50" and jump straight to wherever an object on the new page has an id of "page50." With my method, I can only go to the top of the page.
This is also not going to give me a "go-back" function unless I record the filenames and implement it myself.