sharelink examples

From Microformats Wiki
sharelink-examples /
Revision as of 16:32, 18 July 2020 by Aaronpk (talk | contribs) (Replace <entry-title> with {{DISPLAYTITLE:}})
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search


Part of the Sharelink effort.

Malte Ubl ‏@cramforce Jan 19

  • specifically we’d like to propose <link rel=share> (or similar name) to provide preference of shared URL for a given page.

Per the microformats The microformats process this page is here to document existing real world visible web publishing examples of pages publishing share links for themselves.


This article is a stub. You can help the microformats.org wiki by expanding it.

examples

  • Twitter has a "copy link" dropdown with javascript, no rel on the tweet link.
  • Medium changes the address bar link
  • giphy under the advanced tab has multiple links, displayed as text input fields to copy
<div class="advanced-action-group">
    <div class="action clearfix">
        <p class="action-note">Giphy links preview in Facebook and Twitter. HTML5 links autoselect optimized format.</p>
        <span class="action-label">Giphy Link</span>
        <div class="action-field">
            <input type="text" value="http://gph.is/2dmmt6J" data-copy="true">
        </div>
    </div>
    <div class="action clearfix">
        <span class="action-label">HTML5 Video</span>
        <div class="action-field">
        
            <input type="text" value="https://giphy.com/gifs/lC86xNTUs7CM0/html5" data-copy="true">
        
        </div>
    </div>
    <div class="action clearfix">
        <span class="action-label">Gif Download</span>
        <div class="action-field has-button">
            <input type="text" value="http://i.giphy.com/lC86xNTUs7CM0.gif" data-copy="true">
            <a class="action-button button blue" href="https://media.giphy.com/media/lC86xNTUs7CM0/giphy.gif" download="giphy.gif" target="_blank">Download</a>
        </div>
    </div>
    
</div>
  • svgshare has multiple URLs to copy as well:
  <ul id="shares">
  <li><h3>Image Link (chat, IM, email)</h3>
  <input readonly value="http://svgshare.com/s/Xe" type="text" >
  <li><h3>Direct Link (chat, IM, email)</h3>
  <input readonly value="http://svgshare.com/i/Xe.svg" type="text" >
  <li><h3>HTML (website, blog)</h3>
  <input readonly value="&lt;a href='http://svgshare.com/s/Xe' &gt;&lt;img src='http://svgshare.com/i/Xe.svg' title='' /&gt;&lt;/a&gt;" type="text" >
  <li><h3>HTML iframe (website, blog)</h3>
  <input readonly value="&lt;iframe src='http://svgshare.com/f/Xe' width=100% height=100% &gt;&lt;/iframe&gt;" type="text" >
  <li><h3>Hash resolver</h3>
  <input readonly value="http://svgshare.com/getbyhash/sha1-S0gBndRX/ONq105EfF1/tF8h9Lo=" type="text" >
  </ul>

see also