Link alla condivisione Facebook senza JavaScript

Risposte:

190

Puoi usare

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

Attualmente non esiste alcuna opzione di condivisione senza passare l'URL corrente come parametro. È possibile utilizzare un modo indiretto per raggiungere questo obiettivo.

  1. Creare una pagina laterale del server, ad esempio: "/sharer.aspx"
  2. Collega questa pagina ogni volta che vuoi la funzionalità di condivisione.
  3. Nel "sharer.aspx" ottieni l'URL di riferimento e reindirizza l'utente a " https://www.facebook.com/sharer/sharer.php?u= {referer}"

Esempio di codice 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();
    }
}
— Medeni Baykal
fonte
si questa è una bella opzione. Ma se voglio che questo si apra in un pop-up come la versione js, cosa devo fare? In questo momento si sta aprendo in una nuova scheda! Grazie !
— Sagiruddin Mondal
Questo non è quello che stavo chiedendo. Ciò richiede che tu sappia l'URL della pagina da condividere, quindi puoi sostituire "#url" nel tuo hrefcon l'URL della pagina. Utilizzando il link twitter.com/share , tuttavia, non è necessario inserire l'URL della pagina da condividere.
— Web_Designer,
1
Sai come inviare un'immagine?
— miguelmpn,
@miguelmpn (e il lettore più recente), vedi questa risposta . In breve: og:imagetag.
— Mosh Feu,
Esiste documentazione per questo particolare metodo?
— Navò Khan il
129

Ps 2: come sottolineato da Justin , controlla la nuova finestra di dialogo Condividi di Facebook . Lascerà la risposta come per i posteri. Questa risposta è obsoleta

Risposta breve, sì, c'è un'opzione simile per Facebook, che non richiede javascript (beh, c'è qualche JS in linea minimo che non è obbligatorio, vedi nota).

Ps: La onclickparte ti aiuta solo a personalizzare un po 'il popup ma non è necessario per il funzionamento del codice ... funzionerà bene senza di esso.

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>

cinguettio

<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>
— King'ori Maina
fonte
@superluminary ... ha ma non lo richiede. Avevo detto che puoi rimuoverlo (la parte onclick) ... e funzionerà ancora. Ma vedo come tutto non sia chiaro al 100% ... Lo modificherò.
— King'ori Maina,
2
Bell'esempio di grazioso degrado!
— Arnold Daniels
6
+1. Dovrebbe cambiare http://www.facebook.com/sharer.phpinhttp://www.facebook.com/sharer/sharer.php
— Nir Levy il
1
Vorrei aggiornare questa risposta per indicare alle persone di utilizzare la finestra di dialogo Condividi come diretto da Facebook.
— Justin Skiles,
Qual è il TWITTER_HANDLEparametro?
— hamidfzm,
38

È possibile includere JavaScript nel codice e supportare ancora utenti non JavaScript.

Se un utente fa clic su uno dei seguenti collegamenti senza JavaScript abilitato, aprirà semplicemente una nuova scheda:

<!-- 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>

Poiché contengono la share-popupclasse, possiamo facilmente fare riferimento a queste in jQuery e modificare le dimensioni della finestra in base al dominio da cui condividiamo:

$ ( "Share-popup"). Cliccare (function () {
    var window_size = "larghezza = 585, altezza = 511";
    var url = this.href;
    var domain = url.split ("/") [2];
    switch (dominio) {
        caso "www.facebook.com":
            window_size = "larghezza = 585, altezza = 368";
            rompere;
        caso "www.twitter.com":
            window_size = "larghezza = 585, altezza = 261";
            rompere;
        caso "plus.google.com":
            window_size = "larghezza = 517, altezza = 511";
            rompere;
    }
    window.open (url, '', 'menubar = no, toolbar = no, ridimensionabile = yes, scrollbars = yes,' + window_size);
    restituire false;
});

Niente più brutti JavaScript inline o innumerevoli modifiche al dimensionamento delle finestre. E supporta ancora utenti non JavaScript.

— rybo111
fonte
Bella soluzione! Inoltre, sto usando alcuni javascript per compilare l'URL della pagina corrente:$(".share-popup").each(function(){ var href = $( this ).attr( "href" ); href = href.replace( "URL_HERE", document.URL ); $( this ).attr( "href", href ); });
— GavinoGrifoni,
@GavinoGrifoni è meglio includere l'attuale URL lato server per supportare utenti non JavaScript
— rybo111
12

Prova che questi tipi di link funzionano davvero per me.

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
— Asitha Yomal
fonte
7

Puoi utilizzare l'opzione "URL diretto" dell'URL del feed, come descritto nella pagina della finestra di dialogo del feed :

Puoi anche aprire una finestra di dialogo Feed indirizzando esplicitamente l'utente all'endpoint / 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`

Sembra che non menzionino più la "condivisione" da nessuna parte nei loro documenti; questo è stato sostituito con il concetto di aggiunta al tuo feed.

— Jordan Reiter
fonte
2
Ma non è possibile accedere a quella finestra di dialogo senza registrare un ID app?
— Eli,
7

So che è un vecchio thread, ma ho dovuto fare qualcosa del genere per un progetto e volevo condividere la soluzione del 2019.

La nuova dialogAPI può ottenere parametri ed essere utilizzata senza javascript.

I parametri sono:

  • app_id (Necessario)
  • href L'URL della pagina che desideri condividere, nel caso in cui nessuno sia passato, utilizzerà l'URL corrente.
  • hashtagdeve avere il #simbolo per esempio #amsterdam
  • quote testo da condividere con il link

Puoi creare un href senza 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>
Espandi frammento

Una cosa da considerare è che Facebook sta usando Open Graph, quindi nel caso in cui i tuoi tag OG non siano impostati correttamente potresti non ottenere i risultati desiderati.

— Shahar
fonte
Grazie per aver pubblicato questa risposta. Tuttavia, viene visualizzato l'errore 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.che si trova su localhost. Qualche idea? Ho provato a includere diversi domini in entrambe le impostazioni Basice Advancedsu FB, ma senza fortuna.
— padawanTony
Non sembra display=popupfunzionare sul desktop.
— Nicke Manarin,
6

Molte di queste risposte non si applicano più, quindi ecco la mia:

Utilizza la finestra di dialogo Condividi descritta nella pagina Dev di Facebook .

Esempio:

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

Ma devi inserire il tuo app_id registrato, l'href e un uri di reindirizzamento.

— Justin Skiles
fonte
redirect_urinon è più richiesto.
— Mori,
3

http://facebook.com/sharer.php è obsoleto

Hai alcune opzioni (usa la versione iframe):

http://developers.facebook.com/docs/reference/plugins/like/

http://developers.facebook.com/docs/reference/plugins/send/

https://developers.facebook.com/docs/reference/plugins/like-box/

— DMCS
fonte
1
(usa la versione iframe)
— DMCS
Questo non è proprio quello che sto cercando. Voglio solo usare un elemento di ancoraggio.
— Web_Designer
Scusa, allora sei sfortunato. È Javascript o iFramed.
— DMCS
3
Sto dicendo che se l'utente ha JavaScript disabilitato, non sarà in grado di condividere la pagina su Facebook. Mi chiedevo solo se esistesse un link simile come twitter.com/share ma per Facebook.
— Web_Designer,
1
@Flimm Si prega di consultare developers.facebook.com/bugs/252983554810810 e leggere il commento di Noorin. {quote} Noorin Ladhani · · Facebook Team Ciao Ronald - Il pulsante Condividi è stato deprecato a favore del pulsante Mi piace. {quote}
— DMCS
2

Per coloro che desiderano utilizzare javascript ma non desiderano utilizzare la libreria javascript di Facebook:

<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>

Funziona anche se JavaScript è disabilitato, ma ti dà una finestra popup con anteprima di condivisione se JavaScript è abilitato.

Salva un clic degli aghi mentre non si utilizza alcun js spyware di Facebook :)

— Marek Andreansky
fonte
C'è un modo per aprirlo in una nuova scheda. In questo momento sta spuntando un popup
— Alauddin Ahmed
2

Aggiungendo alla soluzione di @ rybo111, ecco cosa sarebbe una condivisione 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>

e aggiungilo al tuo Javascript:

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

Secondo la documentazione di LinkedIn: https://developer.linkedin.com/docs/share-on-linkedin (vedere la sezione "URL personalizzato")

Per chiunque sia interessato, l'ho usato in un'app Rails con un logo LinkedIn, quindi ecco il mio codice se potrebbe aiutare:

<%= 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" %>
— Kyle Carlson
fonte
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.