Advanced
Open Graph tags Vs moShare Custom tags
We give you the choice to utilize Open Graph tags or implement custom moShare ones. Use the Custom tags if you want to do things like, deliver a video or audio file via MMS, send a different image or URL from your existing Open Graph tags or because you just don't want to use Open Graph tags.
For example, let's say when someone shares to Facebook you want to drive them to your web page. But, when they moShare you may want to send a link to your mobile site. The Custom tags allow you completely customize the user experience. Try it out, and let us know if you have any questions.
Choose your category
Article
Video
Image
Audio
Choose your type
moShare an article using Open Graph tags
Live demo:
Step 1: Use Open Graph meta-tags within <head> to describe your content.
<meta property="og:title" content="Mogreet Recognized for Creating Innovative Mobile Marketing Solutions for Brand Marketers" />
<meta property="og:url" content="http://m.mogreet.com/news.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="http://corp.mogreet.com/images/news/innovation_logoweb.jpg" />
<meta property="og:description" content="Direct Marketing Association awarded Mogreet the 2011 DMA Innovation Award in the category of Mobile Marketing at this year's DMA conference in Boston." />
| Meta-property | Description | Requirement |
|---|---|---|
| og:title | Article title | Optional |
| og:url | A URL to an article | Required |
| og:type | Content type | Required (set to "article") |
| og:description | A one to two sentence description of the article | Optional |
| og:image | A URL to a thumbnail | Optional |
| og:message | The message to be sent | Optional |
| og:article_div | The ID of the <div> containing the article | Required if sending the article directly |
Note: If the metadata “data-article_div” is set, the content of this <div> will be sent directly in the message.
Step 2: Place the moShare button wherever you want inside the <body>.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button"></a>
Step 3: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
moShare an article using custom tags
Live demo:
Step 1: Place the moShare button and the content details wherever you want.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button" data-type="article" data-title="Mogreet Recognized for Creating Innovative Mobile Marketing Solutions for Brand Marketers" data-thumbnail="http://corp.mogreet.com/images/news/innovation_logoweb.jpg" data-article_div="article"></a>
Step 2: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
Choose your type
moShare a video using Open Graph tags
Live demo:
Step 1: Use Open Graph meta-tags within <head> to describe your content.
<meta property="og:title" content="The Art of Flight Movie Trailer" />
<meta property="og:url" content="http://www.moshare.com/examples/og_video.html" />
<meta property="og:type" content="video" />
<meta property="og:video" content="http://d2c.bandcon.mogreet.com/clients/7/assets/B-P_Redbull_TheArtOfFlight_1.mov" />
<meta property="og:image" content="http://d2c.bandcon.mogreet.com/clients/7/assets/B-P_Redbull_TheArtOfFlight_1.png" />
<meta property="og:description" content="Check out this movie trailer for The Art of Flight. Watch it and get inspired!" />
| Meta-property | Description | Requirement |
|---|---|---|
| og:title | Video title | Optional |
| og:url | Canonical URL | Optional |
| og:type | Content type | Required (set to "video", "movie" or "video.movie") |
| og:video | A URL to a video file | Required |
| og:description | A one to two sentence description of the video | Optional |
| og:image | A URL to a thumbnail | Optional |
| og:message | The message to be sent | Optional |
Step 2: Place the moShare button wherever you want inside the <body>.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button"></a>
Step 3: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
moShare a video using custom tags
Live demo:
Step 1: Place the moShare button and the content details wherever you want.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button" data-type="video" data-content="http://d2c.bandcon.mogreet.com/clients/7/assets/B-P_Redbull_TheArtOfFlight_1.mov" data-title="The Art of Flight Movie Trailer" data-message="Check out this movie trailer for The Art of Flight. Watch it and get inspired!" data-thumbnail="http://d2c.bandcon.mogreet.com/clients/7/assets/B-P_Redbull_TheArtOfFlight_1.png"></a>
| Custom attribute | Description | Requirement |
|---|---|---|
| data-title | Video title | Optional |
| data-location | Canonical URL | Optional |
| data-type | Content type | Required (set to "video") |
| data-content | URL to a video file | Optional |
| data-thumbnail | A URL to a thumbnail | Optional |
| data-message | The message to be sent | Optional |
Step 2: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
Choose your type
moShare an image using Open Graph tags
Live demo:
Step 1: Use Open Graph meta-tags within <head> to describe your content.
<meta property="og:title" content="Robot Photo" />
<meta property="og:url" content="http://www.moshare.com/examples/og_image.html" />
<meta property="og:type" content="image"/>
<meta property="og:image" content="http://d2c.bandcon.mogreet.com/clients/7/assets/1309468_88712931.png" />
<meta property="og:description" content="Check out this cool picture I took of my robot!" />
| Meta-property | Description | Requirement |
|---|---|---|
| og:title | Image title | Optional |
| og:url | Canonical URL | Optional |
| og:type | Content type | Required (set to "image") |
| og:description | A one to two sentence description of the image | Optional |
| og:image | A URL to an image file | Required |
| og:message | The message to be sent | Optional |
Step 2: Place the moShare button wherever you want inside the <body>.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button"></a>
Step 3: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
moShare an image using custom tags
Live demo:
Step 1: Place the moShare button and the content details wherever you want.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button" data-type="image" data-content="http://d2c.bandcon.mogreet.com/clients/7/assets/1309468_88712931.png" data-title="Robot Photo" data-message="Check out this cool picture I took of my robot!"></a>
| Attribute | Description | Requirement |
|---|---|---|
| data-title | Image title | Optional |
| data-location | Canonical URL | Optional |
| data-type | Content type | Required (set to "image") |
| data-content | URL of an image file | Optional |
| data-message | The message to be sent | Optional |
Step 2: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
Choose your type
moShare an audio file using Open Graph tags
Live demo:
Step 1: Use Open Graph meta-tags within <head> to describe your content.
<meta property="og:title" content="Brian Auger's Oblivion Express - Compared to What" />
<meta property="og:type" content="audio" />
<meta property="og:audio" content="http://d2c.bandcon.mogreet.com/clients/7/assets/compared_to_what.mp3" />
<meta property="og:image" content="http://d2c.bandcon.mogreet.com/clients/7/assets/closer_to_it.jpeg" />
<meta property="og:description" content="Check out this song by Brian Auger's Oblivion Express from their album "Closer to It!" Buy it on iTunes: http://bit.ly/znDNhs" />
| Meta-property | Description | Requirement |
|---|---|---|
| og:title | Audio title | Optional |
| og:url | Canonical URL | Optional |
| og:type | Content type | Required (set to "audio") |
| og:audio | A URL to an audio file | Required |
| og:description | A one to two sentence description of the audio file | Optional |
| og:image | A URL to a thumbnail | Optional |
| og:message | The message to be sent | Optional |
Step 2: Place the moShare button wherever you want inside the <body>.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button"></a>
Step 3: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
moShare an audio file using custom tags
Live demo:
Step 1: Place the moShare button and the content details wherever you want.
<a href="http://www.mogreet.com/moshare/it/" class="moshare-button" data-content="http://d2c.bandcon.mogreet.com/clients/7/assets/compared_to_what.mp3" data-type="audio" data-title="Brian Auger's Oblivion Express - Compared to What" data-message="Check out this song by Brian Auger's Oblivion Express from their album "Closer to It!" Buy it on iTunes: http://bit.ly/znDNhs" data-thumbnail="http://d2c.bandcon.mogreet.com/clients/7/assets/closer_to_it.jpeg"></a>
| Custom attribute | Description | Requirement |
|---|---|---|
| data-title | Audio title | Optional |
| data-location | Canonical URL | Optional |
| data-type | Content type | Required (set to "audio") |
| data-content | URL to an audio file | Optional |
| data-thumbnail | A URL to a thumbnail | Optional |
| data-message | The message to be sent | Optional |
Step 2: Include our script just before the closing </body> and you're are done!
<script type="text/javascript" src="http://d2c.bandcon.mogreet.com/moshare/embed/moshare.js"></script>
