Web design and hosting, database, cloud and social media solutions that deliver real business results
  • Veritabanı Hizmetleri
    • Araçlar
      • Claytabase Server Disk IOPs Calculator
      • SQL Kod Yedekleme
      • SQL Yazıcı
    • Teknik Makaleler
      • SQL-Server
      • SQL Server 2008 Bakım Planı
      • SQL Server işlevlerini kullanma
      • SQL Server Tarihlerini Kullanma
  • Web Sitesi Tasarımı
    • Ousia
    • Teknik Makaleler
      • ASP-NET
      • CSS
    • Web Sitesi Güvenliği
    • Wight Adası
  • İş hizmetleri
    • Microsoft Azure
    • Microsoft Office
  • Sosyal Medya
  • Hakkında
    • Portföy
    • Takım
      • Chester Copperpot
CS - češtinaDE - DeutschEN - EnglishES - EspañolFR - FrançaisHI - हिंदीIT - italianoPL - polskiPT - PortuguêsRU - русскийZH - 中国的

Sosyal Medya Tweet Share Like Google Twitter ve Facebook Düğmelerini izle

.NET, C # ve VB.NET'te Javascript'li veya olmadan Sosyal Medya Paylaşımlı Düğmeler Oluşturma

Başka bir yol - JavaScript olmadan

Orijinal blog sitemde aşağıdaki kodu kullanarak bazı paylaşım düğmelerini bir araya getirdim; ancak yeni sitemde, önbellekleme eksikliği ve Javascript miktarı açısından cezalandırıldık gibi görünüyordu. Şimdi bu düğmeleri birinin JS ve diğerinin arkasındaki salt kodda yaratmanın iki yolunu da sıraladım.

Bu sosyal medyayla ilgili olduğu için lütfen bunu paylaşmaktan çekinmeyin! Bu, 2015 yılı itibariyle% 100'dü.

  • heyecan
  • Facebook
  • Google
  • LinkedIn

Javascript'le - Daha eski yol

Bunlar sizin gibi / takip düğmeleriniz.

HTML - Like

<div id="SocialMedia">
<div class="fb-like" data-href="http://www.facebook.com/Claytabase/" data-layout="button_count" data-action="like" data-show-faces="true" data-share="false" style="margin-right:5px;"></div>
<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>

Başka bir yol - JavaScript olmadan

Ve artık HTML paylaşım düğmeleri için.

HTML - Share

<div id="Share">
<div style="float: left; margin: 0 5px 0 5px;">
    <div id="fbShare" runat="server" clientidmode="Static" class="fb-share-button" data-href="http://www.gsclayton.net" data-type="button_count"></div>
</div>
<div style="float: left; margin: 0 0px 0 5px;">
    <a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
</div>
<div style="float: left; margin: 0 5px 0 -19px;">
    <div class="g-plus" data-action="share" data-annotation="bubble" align="left">
</div>
</div>
<div style="float: left;">
    <script type="IN/Share" data-counter="right" data-showZero="true"></script>
</div>
<div style="float: left; margin: 0 5px 0 5px;">
    <su:badge layout="1"></su:badge>
</div>
<div style="float: left; margin: 0 5px 0 5px;">
    <a id="PinItButton" runat="server" href="//www.pinterest.com/pin/create/button/?media=http%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg" data-pin-do="buttonPin" data-pin-config="beside"><img src="//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_gray_20.png"/></a></div>
</div>

Başka bir yol - JavaScript olmadan

Ve şimdi JavaScript

JavaScript

<!--Facebook Share andFollow-->
<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>
<!--Google +1 and Follow-->
<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>
<!--Twitter Share-->
<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>
<!--StumbleUpon andPinterest-->
<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>
<!--Linked In Share-->

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

Başka bir yol - JavaScript olmadan

Komut dosyasını sayfanın altına eklerseniz, size daha hızlı bir yükleme süresi sağlayarak en son yüklenecektir. Şans eseri Facebook, Google ve Twitter'daki çocuklar ileride düşünerek hem paylaşım hem de benzeri düğmeler için aynı Javascript'i kullandı.

LoaderVB

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://", "")
Loader[]

Başka bir yol - JavaScript olmadan

Şu an bunu biraz hızlı bir şekilde çalarak, paylaş ve takip düğmeleri için HTML ve CSS aşağıdadır. CSS için resim sprite'leri nasıl kullanılacağına aşağıdaki bağlantıyı kontrol etmiyoruz?

More: Kaydırma CSS oluştur
LoaderFollow

Follow

<div id="FollowBut" runat="server" clientidmode="Static" style="position:relative;width:64px;height:32px;float:right;">
    <img src="https://www.claytabase.co.uk/System/Artwork/Social/Follow.png" alt="share" style="width:64px;height:32px;float:left;" />
    <div id="FollowDiv" style="width:64px;position:absolute;top:0px;right:100%;">
    <a id="LikeFacebook" href="https://www.facebook.com/pages/Claytabase-Ltd/181461242059518" target="_blank" title="Facebook"style="width:64px;float:left;">
    <img src="https://www.claytabase.co.uk/System/Artwork/Social/Facebook.png" alt="Facebook" style="width: 64px; border-radius: 4px;"/></a>
    <a id="LikeTwitter" href="https://twitter.com/claytabase" target="_blank" title="Twitter" style="width: 64px; float: left;">
    <img src="https://www.claytabase.co.uk/System/Artwork/Social/Twitter.png" alt="Twitter" style="width: 64px; border-radius:4px;"/></a>
    <a id="LikeGoogle" href="https://plus.google.com/+ClaytabaseCoUk" target="_blank" title="Google"style="width: 64px;float: left;">
    <img src="https://www.claytabase.co.uk/System/Artwork/Social/Google.png" alt="Google" style="width: 64px; border-radius:4px;"/></a>
    </div>
</div>

Başka bir yol - JavaScript olmadan

Ve bu doğru sayfaya paylaşım bağlantılarını güncelleyecek koddur. Ayrıca tıklama üzerine küçük bir pencere açacak bazı isteğe bağlı JavaScript ekledim.

LoaderVB

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&amp;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

<script type="text/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>

Başka bir yol - JavaScript olmadan

Öğeler paylaşıldığında, görüntülemek istediğim resim önce geldiğinden emin olmak için bunları kullanın.

Social Media Share Buttons Optional Meta Tags

<meta property="og:image" content="https://www.claytabase.co.uk/Image/ClaytabaseWhiteOnNavy.png"/><meta property="og:site_name" content="Claytabase Ltd"/><link rel="publisher" href=”https://plus.google.com/+ClaytabaseCoUk"/><meta itemprop="image" content="https://www.claytabase.co.uk/Image/ClaytabaseWhiteOnNavy.png"/><meta name="twitter:image:src" content="https://www.claytabase.co.uk/Image/ClaytabaseWhiteOnNavy.png"/><!--<h1>Place this directly belowyour Header 1 Tag, facebook looks for this</h1>--><meta property="og:image" content="https://www.claytabase.co.uk/Image/ClaytabaseWhiteOnNavy.png"/>

Başka bir yol - JavaScript olmadan

Daha önce de söylediğim gibi, lütfen bunu faydalı bulursanız paylaşın ve düğmelerin her birinin nasıl çalıştığını görün!

Yazar

Gavin Clayton
Gavin Clayton
SQL Server ve ASP.NET ile çalışmamı sürdürmek için bir yol olarak Claytabase'i 2010'da kurdum. Bu, Ousia İçerik Yönetim Sisteminin konseptten pazardaki en hızlı CMS'lerden biri haline getirilmesiyle sonuçlandı.
 Google Translate
Google Translate
RSS Login ContactCookie PolicySitemap
facebook.com/Claytabaseinstagram.com/claytabase/twitter.com/Claytabaselinkedin.com/company/claytabase-ltd
+441983300796info@claytabase.co.ukGround Floor, Building 1000, Lakeside North Harbour, Western Road, Portsmouth, Hampshire, United Kingdom, PO6 3EZ
Bu sitedeki ayarlar tüm çerezlere izin verecek şekilde ayarlanmıştır. Bunlar, çerez politikamız ve ayarlar sayfamızdan değiştirilebilir. Bu siteyi kullanmaya devam ederseniz, çerezlerin kullanımını kabul etmiş olursunuz.
Ousia Logo
Ousia CMS Loader