Udostępnij link na Facebooku bez JavaScript


Odpowiedzi:


190

Możesz użyć

<a href="https://www.facebook.com/sharer/sharer.php?u=#url" target="_blank">Share</a>

Obecnie nie ma opcji udostępniania bez podania bieżącego adresu URL jako parametru. Możesz to osiągnąć w sposób pośredni.

  1. Utwórz stronę po stronie serwera, na przykład: „/sharer.aspx”
  2. Połącz tę stronę, kiedy chcesz, aby funkcja udostępniania.
  3. W „sharer.aspx” pobierz odsyłający adres URL i przekieruj użytkownika na „ https://www.facebook.com/sharer/sharer.php?u= {referer}”

Przykładowy kod ASP .Net:

public partial class Sharer : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        var referer = Request.UrlReferrer.ToString();

        if(string.IsNullOrEmpty(referer))
        {
            // some error logic
            return;
        }

        Response.Clear();
        Response.Redirect("https://www.facebook.com/sharer/sharer.php?u=" + HttpUtility.UrlEncode(referer));
        Response.End();
    }
}

tak, to fajna opcja. Ale jeśli chcę, aby to otworzyło się w wyskakującym okienku, takim jak wersja js, co mam zrobić? W tej chwili otwiera się w nowej karcie! Dzięki !
Sagiruddin Mondal

Nie o to prosiłem. Wymaga to znajomości adresu URL udostępnianej strony, więc możesz zamienić „#url” w swoim hrefna adres URL strony. Korzystanie z linku twitter.com/share nie wymaga jednak wstawiania adresu URL udostępnianej strony.
Web_Designer

1
Czy wiesz, jak wysłać zdjęcie?
miguelmpn

@miguelmpn (i nowszy czytelnik), zobacz tę odpowiedź . W skrócie: og:imagetag.
Mosh Feu

Czy istnieje dokumentacja dotycząca tej konkretnej metody?
Naved Khan

129

Ps 2: Jak wskazał Justin , sprawdź nowe okno udostępniania na Facebooku . Pozostawi odpowiedź taką, jaka jest dla potomności. Ta odpowiedź jest przestarzała


Krótka odpowiedź, tak, istnieje podobna opcja dla Facebooka, która nie wymaga javascript (cóż, istnieje minimalny wbudowany JS, który nie jest obowiązkowy, patrz uwaga).

Ps: Ta onclickczęść pomaga tylko trochę dostosować wyskakujące okienko, ale nie jest wymagana do działania kodu ... bez niego będzie działać dobrze.

Facebook

<a href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Facebook">
</a>

Świergot

<a href="https://twitter.com/share?url=URLENCODED_URL&via=TWITTER_HANDLE&text=TEXT"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Twitter">
</a>

@ superluminary ... ma, ale tego nie wymaga. Wspomniałem, że możesz go usunąć (część onclick) ... i nadal będzie działać. Ale widzę, że to wszystko nie jest w 100% jasne ... Zmienię to.
King'ori Maina

2
Niezły przykład pełnej gracji degradacji!
Arnold Daniels

6
+1. Powinien zmienić się http://www.facebook.com/sharer.phpnahttp://www.facebook.com/sharer/sharer.php
Nir Levy

1
Zaktualizowałbym tę odpowiedź, aby wskazać ludziom korzystanie z okna dialogowego udostępniania zgodnie z zaleceniami Facebooka.
Justin Skiles

Co to jest TWITTER_HANDLEparametr?
hamidfzm

38

Możliwe jest włączenie JavaScript do kodu i nadal obsługiwać użytkowników innych niż JavaScript.

Jeśli użytkownik kliknie którykolwiek z poniższych linków bez włączonej obsługi JavaScript, po prostu otworzy nową kartę:

<!-- Remember to change URL_HERE, TITLE_HERE and TWITTER_HANDLE_HERE -->
<a href="http://www.facebook.com/sharer/sharer.php?u=URL_HERE&t=TITLE_HERE" target="_blank" class="share-popup">Share on Facebook</a>
<a href="http://www.twitter.com/intent/tweet?url=URL_HERE&via=TWITTER_HANDLE_HERE&text=TITLE_HERE" target="_blank" class="share-popup">Share on Twitter</a>
<a href="http://plus.google.com/share?url=URL_HERE" target="_blank" class="share-popup">Share on Googleplus</a>

Ponieważ zawierają share-popupklasę, możemy łatwo odwołać się do nich w jQuery i zmienić rozmiar okna, aby pasował do domeny, z której udostępniamy:

$ (". share-popup"). click (function () {
    var window_size = "szerokość = 585, wysokość = 511";
    var url = this.href;
    var domain = url.split ("/") [2];
    przełącznik (domena) {
        sprawa „www.facebook.com”:
            window_size = "szerokość = 585, wysokość = 368";
            przerwa;
        przypadek „www.twitter.com”:
            window_size = "szerokość = 585, wysokość = 261";
            przerwa;
        sprawa „plus.google.com”:
            rozmiar_okna = "szerokość = 517, wysokość = 511";
            przerwa;
    }
    window.open (url, '', 'menubar = nie, toolbar = nie, resizable = tak, scrollbars = tak,' + window_size);
    return false;
});

Koniec z brzydkim wbudowanym JavaScriptem lub niezliczonymi zmianami rozmiaru okien. I nadal obsługuje użytkowników innych niż JavaScript.


Niezłe rozwiązanie! Ponadto używam javascript do wypełnienia adresu URL bieżącej strony:$(".share-popup").each(function(){ var href = $( this ).attr( "href" ); href = href.replace( "URL_HERE", document.URL ); $( this ).attr( "href", href ); });
GavinoGrifoni

@GavinoGrifoni lepiej jest dołączyć aktualny adres URL po stronie serwera, aby obsługiwać użytkowników innych niż JavaScript
rybo111

12

Wypróbuj te typy linków faktycznie dla mnie działają.

https://www.facebook.com/sharer.php?u=YOUR_URL_HERE
https://twitter.com/intent/tweet?url=YOUR_URL_HERE
https://plus.google.com/share?url=YOUR_URL_HERE
https://www.linkedin.com/shareArticle?mini=true&url=YOUR_URL_HERE

7

Możesz użyć opcji adresu URL kanału „Bezpośredni adres URL”, zgodnie z opisem na stronie okna dialogowego kanału :

Możesz także wywołać okno dialogowe kanału, bezpośrednio kierując użytkownika do punktu końcowego / dialog / feed:

  https://www.facebook.com/dialog/feed?  
  app_id=123050457758183&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=http://www.example.com/response`

Wygląda na to, że w swoich dokumentach nie wspominają już o „udostępnianiu”; zastąpiono to koncepcją dodawania do kanału.


2
Ale nie można uzyskać dostępu do tego okna bez rejestracji identyfikatora aplikacji?
Eli

7

Wiem, że to stary wątek, ale musiałem coś takiego zrobić dla projektu i chciałem się podzielić rozwiązaniem z 2019 roku.

Nowe dialogAPI może pobierać parametry i być używane bez javascript.

Parametry to:

  • app_id (Wymagany)
  • href Adres URL strony, którą chcesz udostępnić, w przypadku gdyby żadna nie została przesłana, będzie używać bieżącego adresu URL.
  • hashtagmuszą mieć #symbol, na przykład #amsterdam
  • quote tekst do udostępnienia za pomocą łącza

Możesz stworzyć href bez żadnego javascript.

<a href="https://www.facebook.com/dialog/feed?&app_id=APP_ID&link=URI&display=popup&quote=TEXT&hashtag=#HASHTAG" target="_blank">Share</a>

Jedną z rzeczy do rozważenia jest to, że Facebook używa Open Graph, więc jeśli tagi OG nie są ustawione poprawnie, możesz nie uzyskać pożądanych wyników.


Dziękuję za opublikowanie tej odpowiedzi. Jednak pojawia się błąd, Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings.że jestem na hoście lokalnym. Jakieś pomysły? Próbowałem uwzględnić kilka domen zarówno w ustawieniach, jak Basici Advancedna FB, ale bez powodzenia.
padawanTony

Nie wygląda na display=popupto, że działa na komputerze.
Nicke Manarin

6

Wiele z tych odpowiedzi już nie ma zastosowania, więc oto moje:

Skorzystaj z okna dialogowego udostępniania opisanego na stronie deweloperów na Facebooku .

Przykład:

https://www.facebook.com/dialog/share?
  app_id=<your_app_id>
  &display=popup
  &href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
  &redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

Ale musisz umieścić swój zarejestrowany identyfikator_aplikacji, href i przekierowanie uri.


redirect_urinie jest już wymagane.
Mori


3

1
(użyj wersji iframe)
DMCS

To nie jest to, czego szukam. Chcę tylko użyć elementu kotwicy.
Web_Designer

Przepraszam, ale nie masz szczęścia. To jest Javascript lub iFramed.
DMCS

3
Mówię, że jeśli użytkownik ma wyłączony JavaScript, to nie będzie mógł udostępniać strony na Facebooku. Zastanawiałem się tylko, czy istnieje podobny link, jak twitter.com/share, ale dla Facebooka.
Web_Designer

1
@Flimm Odwiedź developers.facebook.com/bugs/252983554810810 i przeczytaj komentarz Noorin. {quote} Noorin Ladhani · · Zespół Facebooka Cześć Ronald - Przycisk Udostępnij został zastąpiony przyciskiem Lubię to. {quote}
DMCS


2

Dla tych, którzy chcą używać javascript, ale nie chcą korzystać z biblioteki javascript Facebooka:

<a id="shareFB" href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"   target="_blank" title="Share on Facebook">Share on Facebook</a>
<script type="text/javascript">document.getElementById("shareFB").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=" + document.URL);</script>

Działa nawet, jeśli javascript jest wyłączony, ale wyświetla wyskakujące okienko z podglądem udziału, jeśli włączony jest JavaScript.

Oszczędza jedno kliknięcie igłą bez korzystania z żadnego oprogramowania szpiegującego js Facebooka :)


Czy jest jakiś sposób, aby otworzyć go w nowej karcie. W tej chwili pojawia się wyskakujące okienko
Alauddin Ahmed

2

Dodając do rozwiązania @ rybo111, oto jak wyglądałoby udostępnienie na LinkedIn:

<a href="http://www.linkedin.com/shareArticle?mini=true&url={articleUrl}&title={articleTitle}&summary={articleSummary}&source={articleSource}" target="_blank" class="share-popup">Share on LinkedIn</a>

i dodaj to do swojego Javascript:

case "www.linkedin.com":
    window_size = "width=570,height=494";
    break;

Zgodnie z dokumentacją LinkedIn: https://developer.linkedin.com/docs/share-on-linkedin (patrz sekcja „Dostosowany adres URL”)

Dla każdego, kto jest zainteresowany, użyłem tego w aplikacji Rails z logo LinkedIn, więc oto mój kod, jeśli może pomóc:

<%= link_to image_tag('linkedin.png', size: "50x50"), "http://www.linkedin.com/shareArticle?mini=true&url=#{job_url(@job)}&title=#{full_title(@job.title).html_safe}&summary=#{strip_tags(@job.description)}&source=SOURCE_URL", class: "share-popup" %>

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.