We Keep Coding

The attached email appears in compose mode when open in desktop Outlook

I attached an email message to a new message before sending it. But, the received attachment is editable on Outlook Desktop and is not on Outlook web. It means that when I try to open the attachment, it appears in compose mode in Outlook desktop. I used createItem to create and send the message, and ItemAttachment to put the attachment. I don't understand why it works on the web and not on the desktop.
Here is the part of code which make the attachment:
var soap = '<m:CreateItem MessageDisposition="SendAndSaveCopy">'+
' <m:Items>' +
' <t:Message>' +
' <t:Subject>' + subject + '</t:Subject>' +
' <t:Body BodyType="HTML">' + body + '</t:Body>' +
' <t:Attachments>' +
' <t:ItemAttachment>' +
' <t:Name>' + attachmentName + '</t:Name>' +
' <t:IsInline>false</t:IsInline>' +
' <t:Message>' +
' <t:MimeContent CharacterSet="UTF-8">' + attachmentMime + '</t:MimeContent>' +
' </t:Message>' +
' </t:ItemAttachment>' +
' </t:Attachments>' +
' <t:ToRecipients><t:Mailbox><t:EmailAddress>' + to + '</t:EmailAddress></t:Mailbox></t:ToRecipients>' +
' </t:Message>' +
' </m:Items>' +
'</m:CreateItem>';
Thank you.

You need to set the PR_MessageFlags extended property https://msdn.microsoft.com/en-us/library/ee160304(v=exchg.80).aspx on the attachment to make it appear sent eg
<t:Message>
<t:ItemClass>IPM.Note</t:ItemClass>
<t:Subject>subject</t:Subject>
<t:Body BodyType="HTML">body</t:Body>
<t:IsRead>false</t:IsRead>
<t:ExtendedProperty>
<t:ExtendedFieldURI PropertyTag="3591" PropertyType="Integer" />
<t:Value>1</t:Value>
</t:ExtendedProperty>
</t:Message>

How to actually use meta tags to share data through social networks?

So I'm trying to do a website that has multiple images with their own content and allow users to click on a dropdown next to an image and share that image and the content to: Twitter, Facebook, LinkedIn, and Email.
What I've looked into is creating a separate URL for each image with it's content. Then in each page setting it's description, image, etc. in the meta tags. So on the landing page when they click to share it's actually pulling a separate page.
My question is...how do I share meta tag information to Twitter, Facebook, LinkedIn, and Email?
I've tried for Twitter:
<a rel="nofollow" class="share-twitter sd-button share-icon no-text" href="http://twitter.com/share?text=Textgoeshere&url=https://www.landingpage.com/&hashtags=example" target="_blank" title="Click to share on Twitter"><span></span><span class="sharing-screen-reader-text">Click to share on Twitter (Opens in new window)</span></a>
This seems like a lot of text that I would have to then write for each image. Plus it doesn't pull the image, author, etc. Isn't there a way to grab the meta tag information to share to Twitter here?
I mean I have the meta tags present (below) but no idea how to actually use them to share.
<meta name="twitter:card" content="Here's Twitter Card"/>
<meta name="twitter:site" content="#author"/>
<meta name="twitter:domain" content="#author"/>
<meta name="twitter:url" content="http://www.mainpage.com">
<meta name="twitter:title" content="Twitter Title">
<meta name="twitter:description" content="Here is the Twitter Description">
<meta name="twitter:image" content="link to image">
Found the following for Facebook:
https://developers.facebook.com/docs/plugins/share-button#
Found the following for Twitter:
https://publish.twitter.com/#

Okay here is what I'll do for you because I am not sure what answer you are looking for here. We are going to write some javacript that can do this for you.
Here you have your HTML tag. It's important that you give every div the class "twitter-input-card" and you give them an onload function of "updateCards()".
HTML here:
<div class="twitter-input-cards" onload="updateCards(tCard1)"> </div>
Now here is your js....:
//this function creates your object
function twitterCards(twitterCard, twitterAuthor1, twitterAuthor2, twitterURL, twitterTitle, twitterDes, twitterImg) {
//this will be twitter:card
this.twitterCard = twitterCard;
//this will be twitter:site
this.twitterAuthor1 = twitterAuthor1;
//this will be twitter:domain
this.twitterAuthor2 = twitterAuthor2;
//this will be twitter:url
this.twitterURL = twitterURL;
//this will be twitter:title
this.twitterTitle = twitterTitle;
//this will be twitter:description
this.twitterDes = twitterDes;
//this will be twitter:image
this.twitterImg = twitterImg;
}
//this isn't as important but i am not familiar with twitter cards so if there are more meta tags you can define them here.
var tcard = 'twitter:card';
var tsite = 'twitter:site';
var tdomain = 'twitter:domain';
var turl = 'twitter:url';
var ttitle = 'twitter:title';
var tdes = 'twitter:description';
var timg = 'twitter:image';
//this function will update the card with information
function updateCards(selectCard){
cardSelect = selectCard;
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + tcard + "' content = '" + twitterCard + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + tsite + "' content = '" + twitterAuthor1 + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + tdomain + "' content = '" + twitterAuthor2 + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + turl + "' content = '" + twitterURL + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + ttitle + "' content = '" + twitterTitle + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + tdes + "' content = '" + twitterDes + "'/>"
document.getElementsByClassName("twitter-input-cards").innerHTML = "<meta name=" + "'" + timg + "' content = '" + twitterImg + "'/>"
}
//this is where you define your cards info
var tCard1 = new twitterCards (
//this will be twitter:card
"Here is a new card",
//this will be twitter:site
"here is an author",
//this will be twitter:domain
"here is another aurthor",
//this will be twitter:url
"here is the page",
//this will be twitter:title
"here is the title",
//this will be twitter:description
"here is the description",
//this will be twitter:img
"img.jpg"
)

Fancybox iframe does not appear

HTML
<a class="fancybox fancybox.iframe" href="http://www.youtube.com/embed/L9szn1QQfas">Youtube (iframe)</a>
This code line works but I want to add dynamically javascript code.
JS
'<li>' +
'<div class="list-left">' +
'<img src="' + thumb + '">' +
'</div>' +
'<div class="list-right">' +
'<a class="fancybox fancybox.iframe" href="http://www.youtube.com/embed/' + videoID + '"><h3>' + title + '</h3></a>' +
'<small>By <span class="Title">' + channelTitle + '</span> on ' + videoDate + '</small>' +
'<p>' + description + '</p>' +
'</div>' +
'</li>' +
'<div class="clearfix"></div>' +
'';
When I clicked the link, I can't open with fancybox. It's open with new page and console says
Mixed Content: The page at 'https://www.youtube.com/embed/OFMSUI7PAS8'
was loaded over HTTPS, but requested an insecure image
'http://www.youtube.com/favicon.ico'. This content should also be served over HTTPS.

Update
I just used your pen and everything worked fine for me, you forgot to pass type: 'iframe' to fancybox, also you should put your js code in js section in codepen, here is screenshot
And here is the codepen's link: Click me

Creating Functions in JQuery to Avoid Writing the Same Code Again

I am currently using a Twitch API that receives information about a specific channel then prepends it to the HTML document. The code that prepends the information is used over and over. I was wondering how exactly do you create a function that could avoid repetition and be called throughout the document?
The codepen can be found here: http://codepen.io/sibraza/pen/AXRRvq
Here is the JQuery Code thats gets used repeatedly:
$("#follower-Info").prepend("<div class ='row'>" + "<div class = 'col-md-4'>" + "<img src='" + logo + "'>" + "</div>" + "<div class='col-md-4'>" + name +"</div>"+ "<div class ='col-md-4'>" + status + "</div></div>")
Would something like this work:
function addThis(){
$("#follower-Info").prepend("<div class ='row'>" + "<div class = 'col-md-4'>" + "<img src='" + logo + "'>" + "</div>" + "<div class='col-md-4'>" + name +"</div>"+ "<div class ='col-md-4'>" + status + "</div></div>")
}
And then I can could call addThis() after each $.getJSON request.

It would work, but you need to pass name, logo and status as parameters to the function. You can also remove the redundant string concatenation:
function addThis(name, logo, status) {
$("#follower-Info").prepend('<div class="row"><div class="col-md-4"><img src="' + logo + '"></div><div class="col-md-4">' + name + '</div><div class="col-md-4">' + status + '</div></div>');
}
Then you can call it from within your $.getJSON handler:
addThis('Foo', 'bar.jpg', 'online');

Sorry we could not fetch the image

I am facing one issue "Sorry we could not fetch the image" when I am clicking on pin it button:
below is the parameters I am passing
I am not getting what the this is missing :
1) ?url=
2) &media=
3) &description
This is the link which is creating in dailogbox :
http://www.pinterest.com/pin/create/button/?url=https://www.elivatefitness.com/lifestrength-ion-wristbands&media=https://www.elivatefitness.com/medias/LFE102-PureSeriesBlackGray.jpg-Default-WorkingFormat-479Wx479H?context=bWFzdGVyfHJvb3R8MTUxOTV8aW1hZ2UvanBlZ3xoNTUvaDFhLzg3OTk2MTg2NjI0MzAuanBnfDViZmIwMzM4ZTQ0NGQyYjQ1NWY2YmJkZTAxMjdjYjhmNjA3ZDk3ZDUwYTI2M2FmNzA1YjBlMTQyNDAyNzI1MTE&description=Combining%20comfort%20and%20improved%20performance%20the%20LifeStrength%20Ion%20Wellness%20Wristbands%20play%20an%20important%20part%20in%20boosting%20energy%20and%20fighting%20the%20negative%20effects%20of%20the%20environment%20around%20us%20to%20bring%20better%20health,%20relieve%20painful%20joints%20and%20encourage%20a%20deeper%20and%20more%20restful%20sleep.%20LifeStrength%20Ion%20Wellness%20Wristbands%20uses%20a%20proven%20method%20that%20combines%207%20natural%20minerals%20and%20gemstones%20into%20a%20slim%20Far-Infared%20infused%20silicon%20wristband%20you%20can%20wear%2024%20hours%20a%20day,%207%20days%20a%20week.%20Together%20the%20powerful%20mixture%20creates%20a%20unique%20band%20that%20emits%20more%20health-producing%20negative%20ions%20into%20your%20environment%20which%20in%20turn%20increases%20the%20flow%20of%20oxygen%20to%20the%20brain%20resulting%20in%20greater%20energy,%20alertness%20and%20an%20overall%20feeling%20of%20well-being.
Please help me out.
function pinIt()
{
var mediaURL = location.protocol + "//" + location.host
+ '${imgURL}' + "&description=" + "${description}";
window.open("//pinterest.com/pin/create/button/?url="+ document.URL + "&media=" + mediaURL,"",'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
}