I would like to know if there is a way to use meta information such as <meta property="og:image" content="image.jpg">and <meta name="twitter:image" content="tw-image.jpg">
to rather have image links to correctly sized images depending on what social platform they are being shared to.
In other words
A person from Facebook shares a link to my webpage http://www.example.com/pagex/ and facebook shows the image source i have provided fb-image.jpg at a size of 1200px x 900px so it does not crop my image.
Another person goes to share the same url http://www.example.com/pagex/ on google plus, and google plus chooses the source image i have provided gplus-image.jpg at a size of 1080px x 1080px so it shows my full image.
Another one for pinterest and another for twitter and another for linkedin
I hope this makes sense.
Related
Hy
How i can add a default image for my site to display in the google search results when i type the name of the site to search for?
Currently every few weeks a different image/picture is displaying, current one picture from my news.
Google Search result =
https://www.may_site.com [ logo ]
Currently I added a logo to my first link at the top of the page..
<img src="/images/logo.png" width="70" height="70" alt="Sitename Logo">
Sometimes no picture is visible :/
Google reads meta tags in your page <head></head> to understand what you want to show in search results.
As far as I know there is not an official "logo" or "image" tag that Google support, but is smart enough to understand that "og:image" is the page image.
<head>
<meta name="og:image" content="http://ia.media-imdb.com/rock.jpg">
</head>
You can read more here: https://developers.google.com/search/docs/advanced/crawling/special-tags
And you can find a comprehensive list of meta here
https://gist.github.com/lancejpollard/1978404
Google supports defining your logo in structured data. Here is their documentation on it:
https://developers.google.com/search/docs/advanced/structured-data/logo
However, I think you are talking more about a general image related to a page.
Using the og:image meta tag mentioned by #supermod can be a hint. Google also understands images in certain structured data types like recipes, products, articles etc. Their gallery shows what structured data can cause rich snippets like an image:
https://developers.google.com/search/docs/advanced/structured-data/search-gallery
But it is not necessary to provide metadata or structured data to get images in the search results. Sometimes Google just picks one from the page.
How do you get rid of or replace the Microsoft Azure Media Services logo overlay (water mark) that is put onto dynamic packaged video? The following link shows the topic area:
https://azure.microsoft.com/en-us/documentation/articles/media-services-dynamic-packaging-overview/
My html contains embedded code taken from http://amsplayer.azurewebsites.net/azuremediaplayer.html
It seems that you are attempting to use the iframe embed code on the "get embed code" section of the player. Please note that this is currently under development, as it is listed on the site: "this embed code is for demo purposes only. Do not use in production."
For your player needs in production, especially if you want to use the large amounts of API's available, you should create your own player page following the instructions in the documentation and by using the samples provided.
Specifically for the question regarding the logo, there is an API available to remove to logo and can be found in the logo option section of the documentation. This is the correct way to remove to logo using the APIs provided.
It might be helpful to post some of the HTML that you are using when you say "My html contains embedded code taken from..."
It looks like the code on that page has the following div:
<div class="amp-logo" style="opacity: 0.5;"></div>
This appears to be what is placing the logo on the page you reference. Not know what HTML is actually in your page, I don't know if this is the HTML they are generating for you as embedded or whether you cut and paste the HTML from the given page.
You may be able to remove it from your HTML. If not, try creating a style that overrides the amp-logo class.
Reading mode in Spartan/Edge seems to choose, somehow, which div on the site to display in reading mode. In many pages, it does not find the appropriate div (like bbc.co.uk).
However, on our site, it enables reading mode, but then displays the completely wrong part of the page.
So - how can I tell it to take the right part or at least how to disable it on those pages
You can find information on how to optimize reading view, as well as how to opt-out, here: http://dev.modern.ie/testdrive/demos/readingview/
07/10: Edit to include specific information
Specifically, you may be interested in optimizing your title, body, and image markup to ensure a good reading mode experience.
Title
Your page should include a <title> element in the header. In addition, you should include a <meta title=""> tag that matches your main heading in your content section.
Body text
Ensure your main content does not include a lot of deeply nested elements and that font-sizes and other styles are uniform. Style variations for things like pull quotes, etc. should still be fine.
Images
The first eligible image becomes the dominant image of the article. The dominant image is rendered as the first piece of content and given full column width. All following images are rendered as inline images within the article.
Images are recommended to be wrapped in <figure> tags with no more than two <figcaption> tags.
Opting out
Including this meta tag will disable reading mode in IE11 and, currently, Microsoft Edge.
<meta name="IE_RM_OFF" content="true">
Add the following Tag
<meta name="IE_RM_OFF" content="true">
Check the Below for more details
http://dev.modern.ie/testdrive/demos/readingview/
I am going to develop a mechanism to export as many as approx. 100 photos with their position information to a KML/KMZ file.
Just wondering what is the best practise to do this. My initial quick options are:
1. use html img tag in the description of a placemark to internally reference the actual photos wrapped in the internal "files" folder in the KMZ;
2. use html img tag in the description of a placemark to reference the URL of a photo (publicly accessible).
Option one involves writing all photos in the internal "files" folder of a KMZ. This would make it a massive file. Meanwhile, all photos would have to be loaded in memory during the loading of the KMZ file.
My question is with the option 2, if a particular photo would not be loaded until the user clicks on the placemark to open the popup balloon OR all the photos are loaded like the option 1?
Thanks!
Cheers,
Alex
You can think of Google Earth as a specialized web browser and the HTML within a given placemark as being handled same way HTML in a web browser is handled. In option 2 the images are not downloaded until user clicks the placemark and the description balloon is selected and starts to render.
Option 1 you have a huge KMZ file as you describe that must be downloaded entirely to the client and unpacked locally. The file may be too large to download in a mobile device if you want Google Earth mobile users to view it. The Google Earth essentially unpack the KMZ then access images as in the case of option 2 when the placemark with that image is selected. Only difference is that the entire collection must be downloaded in one shot so the initial startup time is slower and depends on network speed.
i've been searching for script that can bypass image search in google.
For example...If a image in my site is indexed by google image search then when the google user click on that image a page opens where the image is displayed and my site is shown at the backgrund.
They are many site that can overcome this google indexing and automatically redirect it to the webpage where the image was present.
I'm getting 600 hits a day just by google image results,but i want the users to get images by looking at my site,instead of showing on a popup sort of
I may be over-simplifying, but isn't it a matter of checking if your site is the "top frame"?
if (self.location != top.location){
top.location = self.location;
}
(or some facsimile)
Unless they're embedding custom content within your site's page, in which case you can probably run a script to check for a "known google DOM element" and, when present, do your own hijacking/redirecting.
If you want to force your website to properly load for visitors that come from Google Images, you just need to employ a frame-killing script like the one below.
<script type="text/javascript">
if (top != self) top.location.replace(location);
</script>