İçindekiler

Important: this documentation is not applicable to your currently selected format stories!

amp-social-share

You can now use this component outside valid AMP documents using the Bento version of this component. Learn more in the Bento guide.

Description

Paylaşım izleme özelliği geliştirme aşamasındadır.

Required Scripts

<script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>

Supported Layouts

container fill fixed fixed-height flex-item nodisplay responsive

Bir sosyal paylaşım düğmesi görüntüler.

Zorunlu Komut Dosyası	`<script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>`
Desteklenen Düzenler	container, fill, fixed, fixed-height, flex-item, nodisplay, responsive
Örnekler	Örneklerle AMP amp-social-share örneği sayfasına bakın.

Genel Bakış

amp-social-share bileşeni, çeşitli sosyal platform sağlayıcıları için bir sosyal paylaşım düğmesi görüntüler.

Örnekler

Örnek: Temel sosyal paylaşım düğmesi

Paylaşım düğmesi, sizin adınıza önceden yapılandırılmış sağlayıcıların bazılarını içeren bazı varsayılanlar tahmin eder. Geçerli doküman standart URL'sinin paylaşmak istediğiniz URL ve sayfa başlığının, paylaşmak istediğiniz metin olduğunu varsayar.

<amp-social-share type="twitter"></amp-social-share>

Örnek: Parametreleri geçirme

Parametreleri paylaşım uç noktasına geçirmek istediğinizde, paylaşım uç noktasına eklenecek data-param-<attribute> değerini belirtebilirsiniz.

<amp-social-share type="linkedin" width="60" height="44"
    data-param-text="Hello world"
    data-param-url="https://example.com/">
</amp-social-share>

Linkedin önceden yapılandırılmış sağlayıcılardan biridir; dolayısıyla, data-share-endpoint özelliğini sağlamanız gerekmez.

Özellikler

type (gerekli)	Bir sağlayıcı türü seçer. Bu, hem önceden yapılandırılmış hem de yapılandırılmamış sağlayıcılar için gereklidir.
data-target	Hedefin içinde açılacağı hedefi belirtir. iOS'te e-posta/SMS dışındaki tüm durumlar için `_blank` varsayılan ayardır; e-posta/SMS durumunda hedef `_top` değerine ayarlanır. Bu geçersiz kılmayı yalnızca e-posta için kullanmanızı önerdiğimizi lütfen unutmayın.
data-share-endpoint	Bu özellik, yapılandırılmamış sağlayıcılar için gereklidir. Bazı popüler sağlayıcıların önceden yapılandırılmış paylaşım uç noktaları vardır. Ayrıntılar için Önceden Yapılandırılmış Sağlayıcılar bölümüne bakın. Yapılandırılmamış sağlayıcılar için paylaşım uç noktasını belirtmeniz gerekir.
data-param-*	`data-param-*` önekli tüm özellikler URL parametrelerine dönüştürülür ve paylaşım uç noktasına geçirilir.

Önceden yapılandırılmış sağlayıcılar

amp-social-share bileşeni, bazı varsayılan parametrelerin yanı sıra kendi paylaşım uç noktalarını bilen bazı önceden yapılandırılmış sağlayıcılar sunar.

Sağlayıcı	Tür	Parametreler
Web Paylaşımı API'si (OS paylaşım iletişim kutusunu tetikler)	`sistem`	`data-param-text`: isteğe bağlı, varsayılan değeri: "Geçerli sayfa başlığı" `data-mode`: isteğe bağlı, `replace` değerine ayarlanırsa diğer tüm paylaşım seçenekleri kaldırılır.
E-posta	`e-posta`	`data-param-subject`: isteğe bağlı, varsayılan değeri: Geçerli sayfa başlığı `data-param-body`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-recipient`: isteğe bağlı, varsayılan değeri: '' (boş dize)
Facebook	`facebook`	`data-param-app_id`: gerekli , varsayılan değeri: none. Bu parametre, Facebook Paylaşımı iletişim kutusu için gerekli olan Facebook `app_id` bilgisidir. `data-param-href`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-quote`: isteğe bağlı. Bir alıntıyı veya metni paylaşmak için kullanılabilir.
LinkedIn	`linkedin`	`data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si
Pinterest	`pinterest`	`data-param-media`: isteğe bağlı (ancak ayarlanması önemle tavsiye edilir), varsayılan değeri: none. Pinterest'te paylaşılacak medyanın URL'si. Ayarlanmazsa son kullanıcının Pinterest aracılığıyla bir medya yüklemesi istenir. `data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-description`: isteğe bağlı, varsayılan değeri: Geçerli sayfa başlığı
G+	`gplus`	`data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si
Tumblr	`tumblr`	`data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-text`: isteğe bağlı, varsayılan değeri: Geçerli sayfa başlığı
Twitter	`twitter`	`data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-text`: isteğe bağlı, varsayılan değeri: Geçerli sayfa başlığı
Whatsapp	`whatsapp`	`data-param-text`: isteğe bağlı, varsayılan değeri: "Geçerli sayfa başlığı - geçerli sayfa URL'si"
LINE	`line`	`data-param-url`: isteğe bağlı, varsayılan değeri: `rel=canonical` URL'si `data-param-text`: isteğe bağlı, varsayılan değeri: Geçerli sayfa başlığı
SMS	`sms`	`data-param-body`: isteğe bağlı, varsayılan değeri: `rel=title - rel=canonical` URL'si

Yapılandırılmamış sağlayıcılar

Önceden yapılandırılmış sağlayıcılara ek olarak, amp-social-share bileşeninde ek özellikler belirterek yapılandırılmamış sağlayıcıları da kullanabilirsiniz.

Örnek: Yapılandırılmamış bir sağlayıcı için paylaşım düğmesi oluşturma

Aşağıdaki örnekte, data-share-endpoint özelliğinin Facebook Messenger özel protokolü için doğru uç noktaya ayarlanmasıyla Facebook Messenger üzerinden bir paylaşım düğmesi oluşturulmaktadır.

<amp-social-share type="facebookmessenger"
    data-share-endpoint="fb-messenger://share"
    data-param-text="Check out this article: TITLE - CANONICAL_URL">
</amp-social-share>

Bu sağlayıcılar önceden yapılandırılmadığından, sağlayıcı için uygun düğme resmini ve stillerini oluşturmanız gerekir.

Stiller

Varsayılan Stiller

Varsayılan olarak, amp-social-share bileşeni bazı popüler önceden yapılandırılmış sağlayıcıları içerir. Bu sağlayıcıların düğmeleri, sağlayıcının resmi rengi ve logosuyla şekillendirilmiştir. Varsayılan genişlik 60 piksel ve varsayılan yükseklik 44 pikseldir.

AMP sayfalarınızda kullanabileceğiniz duyarlı, önceden şekillendirilmiş paylaşım bağlantıları için AMP Start sayfasını ziyaret edin.

Özel Stiller

Bazen kendi stilinizi sağlamak istersiniz. Bunun için sağlanan stilleri aşağıda gösterilen şekilde geçersiz kılabilirsiniz:

amp-social-share[type="twitter"] {
  background: red;
  background-image: url(datauri:svg/myownsvgicon);
}

Değişken Değişikliği

<amp-social-share> öğesinde genel AMP değişkeni değişikliklerini kullanabilirsiniz. Aşağıdaki örnekte, TITLE değişkeni, doküman başlığı ve CANONICAL_URL değişkeni, dokümanın standart URL'si ile değiştirilmiştir.

<amp-social-share type="whatsapp"
    data-param-text="Check out this article: TITLE - CANONICAL_URL">
</amp-social-share>

Doğrulama

AMP doğrulayıcı spesifikasyonundaki amp-social-share kurallarına bakın.

Daha fazla yardıma mı ihtiyacınız var?

Bu belgeyi defalarca okudunuz ama tüm sorularınıza tatmin edici bir yanıt bulamadınız mı? Belki başka kişiler de bu şekilde hissetmiştir: Stack Overflow'dan onlara ulaşın.

Stack Overflow'a git

Bir hata veya eksik bir özellik mi buldunuz?

AMP projesi, katılımınızı ve katkılarınızı güçlü bir şekilde teşvik ediyor! Açık kaynak topluluğumuzun devamlı bir katılımcısı olacağınızı umuyoruz ancak özel olarak ilgilendiğiniz konularla ilgili tek seferlik katkıları da memnuniyetle karşılıyoruz.

GitHub'a git

amp-social-share 1.0 0.1