Социальные медиа Tweet Share Like Follow Buttons для Google Twitter и Facebook

.NET, создание кнопок совместного использования социальных сетей с или без Javascript в C # и VB.NET

Другой способ - без большого количества JavaScript

На моем исходном сайте блога я поместил несколько кнопок совместного доступа, используя код ниже, однако на нашем новом сайте было похоже, что мы были наказаны в скорости из-за отсутствия кеширования и количества Javascript. Теперь я перечислил оба способа создания этих кнопок: один с JS и другой в чистом коде.

Поскольку это связано с социальными медиа, вы можете поделиться этим! Это было 100% к 2015 году.

С Javascript - более старый способ

Это ваши кнопки / follow.

HTML - Like

<a href="https://twitter.com/Claytabase" class="twitter-follow-button" data-show-count="data-show-count" data-lang="en" data-show-screen-name="false">Claytabase</a>

</div>

Другой способ - без большого количества JavaScript

И теперь для HTML для кнопок совместного доступа.

HTML - Share

</div>

<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>

</div>

</div>

</div>

<su:badge layout="1"></su:badge>

</div>

</div>

Другой способ - без большого количества JavaScript

И теперь JavaScript

JavaScript

<script type="text/javascript">
    (function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js =d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
   fjs.parentNode.insertBefore(js, fjs);
} (document, 'script','facebook-jssdk'));
</script>

<script type="text/javascript">
    (function () {
        var po = document.createElement('script'); po.type = 'text/javascript';po.async = true;
       po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
    })();
</script>

<script type="text/javascript">
    !function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (!d.getElementById(id)) {
    js =d.createElement(s);
    js.id =id; js.src = "//platform.twitter.com/widgets.js";
   fjs.parentNode.insertBefore(js, fjs);
    }
} (document, "script","twitter-wjs");
</script>

<script type="text/javascript">
    (function () {
    var li = document.createElement('script'); li.type = 'text/javascript';li.async = true;
    li.src =('https:' == document.location.protocol ? 'https:' : 'http:')+ '//platform.stumbleupon.com/1/widgets.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(li, s);
    })();
</script>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>


<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>

Другой способ - без большого количества JavaScript

Если вы добавите скрипт в нижнюю часть страницы, он будет загружаться последним, что даст вам более быстрое время загрузки. К счастью, ребята из Facebook, Google и Twitter думали заранее и используют один и тот же Javascript для обеих кнопок и подобных кнопок.

VB

Dim u As String = Replace(Replace(Request.Url.ToString(), " ", "%20"),"http://", "")
If Right(u, 1) = "/" Then
u = Mid(u, 1, Len(u) - 1)
End If
fbShare.Attributes.Add("data-href",Request.Url.ToString())
Dim p1 As String = "//www.pinterest.com/pin/create/button/?url=http%3A%2F%2F"
Dim p2 As String = "%2F&media=http%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg&"
Dim pd As String = "description=Pin%20claytabase.com%20on%20Pinterest"
PinItButton.HRef = p1 + u + p2 + pd
Dim u As String = Replace(Replace(Request.Url.ToString(), " ", "%20"),"http://", "")

[]

Другой способ - без большого количества JavaScript

Мы можем прорваться через это немного быстрее, ниже - HTML и CSS для общего доступа и кнопки. Почему бы не проверить ссылку ниже о том, как использовать спрайты изображений для CSS?

More: Создать прокрутку CSS

Follow

Другой способ - без большого количества JavaScript

И это код для обновления ссылок на ссылку на правильную страницу. Я также добавил некоторый дополнительный JavaScript, который откроет небольшое окно при щелчке.

VB

Dim DocDesc As String = "en"

Dim DocUrl As String = Request.Url.ToString()

ShareFacebook.HRef = String.Format("https://www.facebook.com/sharer/sharer.php?u={0}",DocUrl)

ShareTwitter.HRef = String.Format("http://twitter.com/share?url={0}&text={1}&via=claytabase",DocUrl, DocDesc)

ShareGoogle.HRef = String.Format("https://plusone.google.com/_/+1/confirm?hl={1}&url={0}",DocUrl, lg)

ShareLinkedIn.HRef = String.Format("http://www.linkedin.com/cws/share?url={0}&original_referer={0}&token=&isFramed=false&lang={1}",DocUrl, lg)

ShareStumble.HRef = String.Format("https://www.stumbleupon.com/submit?url={0}",DocUrl)

ShareEmail.HRef = String.Format("mailto:?subject=I wanted you to see thissite&body=Check out this site {0}", DocUrl)

SharePinit.HRef = String.Format("http://www.pinterest.com/pin/create/button/?url={0}&media=http%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg&guid=XByRQbsL38y8-0&description={1}",DocUrl, DocDesc)

Social Media Share Buttons Optional Javascript

function popupwindow(url, title, w, h) {

var left = (screen.width / 2) - (w / 2);

var top = (screen.height / 2) - (h / 2);

return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no,menubar=no, copyhistory=no, width=' + w + ',height=' + h + ', top=' + top + ', left=' + left);

}

</script>

Другой способ - без большого количества JavaScript

Используйте их, чтобы убедиться, что при совместном использовании элементов изображение, которое я хочу отобразить, появляется первым.

Social Media Share Buttons Optional Meta Tags

Другой способ - без большого количества JavaScript

Как я уже говорил, поделитесь этим, если вы сочтете это полезным, и посмотрите, как работают каждая из кнопок!