Mit einem Social Sharing -Plugin k?nnen Ihre Website -Besucher Ihre Website -Inhalte auf Social -Media -Websites problemlos freigeben. Dies hilft, das allgemeine Bewusstsein Ihrer Website zu sch?rfen.

Es gibt bereits Dutzende vorhandener Plugins für soziale Freigabe, die Sie einfach installieren und damit erledigen k?nnen, aber wo ist der Spa? darin?

In diesem Tutorial zeige ich Ihnen, wie Sie Ihr eigenes Social Sharing -Plugin für WordPress von Grund auf neu erstellen, das unter jedem Beitrag soziale Freigabentasten hinzufügen kann. Benutzer k?nnen den Beitrag einfach teilen, indem sie auf die gewünschte Social -Media -Site -Schaltfl?che klicken.

Key Takeaways

• Plugins mit Social Sharing -Plugins erm?glichen es den Besuchern der Website, Inhalte auf Social -Media -Websites problemlos zu teilen und das Bewusstsein für Ihre Website zu sch?rfen.
• Erstellen eines eigenen Social Sharing -Plugins für WordPress beinhaltet das Erstellen eines Verzeichnisses und die Dateien, das Erstellen eines Verwaltungsmenüelements, das Erstellen einer Optionsseite, das Anzeigen der Social Sharing -Schaltfl?chen und das Stylen der Social -Media -Schaltfl?chen.
• Auf der Seite "Optionen" k?nnen Benutzer ausw?hlen, für welche Social -Media -Websites sie Schaltfl?chen haben m?chten, und die Schaltfl?chen selbst werden am Ende der Beitr?ge mit dem Filter "The_Content" in WordPress hinzugefügt.
• Das Anpassen des Plugins für soziale Freigabe kann das ?ndern von CSS -Stilen, das Hinzufügen weiterer Social -Media -Plattformen, die Reaktion der Schaltfl?chen, die Verfolgung der Leistung mit Analyse -Tools, das Hinzufügen von Freigabenz?hlungen mit APIs und Optimierung der Schaltfl?chen für SEO.

Warum brauchen Sie Social Media Share -Schaltfl?chen?

wird oft berichtet, dass mehr als 80% der Benutzer in Betracht ziehen, Inhalte auf der Grundlage der Empfehlungen ihrer Freunde zu lesen. Mit der sozialen Freigabe geben Sie den Benutzern die M?glichkeit, Ihre Inhalte mit ihren eigenen Freunden von Freunden zu teilen.

werden t?glich im Internet mehr als 40 Milliarden Aktien klicken, weshalb die Schaltfl?chen für soziale Freig?nge auf Ihrer WordPress -Website hinzugefügt werden k?nnen, um Ihre Website zu vermarkten.

Plugin -Verzeichnis und Dateien

Um die Dinge zu starten, erstellen Sie ein Verzeichnis namens Social-Share und erstellen Sie die folgenden Dateien darin:

--social-share
	-social-share.php
	-style.css

In der Datei Social-Share.php fügen Sie den folgenden Text hinzu, um das Plugin installierbar zu machen.

<span><span><?php
</span></span><span>
</span><span><span>/*
</span></span><span><span>Plugin Name: Social Share
</span></span><span><span>Plugin URI: https://www.sitepoint.com
</span></span><span><span>Description: Displays Social Share icons below every post
</span></span><span><span>Version: 1.0
</span></span><span><span>Author: Narayan Prusty
</span></span><span><span>*/</span></span>

Erstellen eines Administrator -Menüelements

Wir müssen eine Optionsseite für unser Plugin erstellen, auf dem der Benutzer Schaltfl?chen ausw?hlen kann, für die Social -Media -Websites angezeigt werden sollten. Zum Erstellen einer Optionsseite zuerst müssen wir ein Menüelement erstellen, an den die Seite Optionen angeh?ngt wird.

Hier ist der Code zum Erstellen eines Admin -Menüelements unter Einstellungen Top -Level -Menüelement.

<span>function social_share_menu_item()
</span><span>{
</span>  <span>add_submenu_page("options-general.php", "Social Share", "Social Share", "manage_options", "social-share", "social_share_page"); 
</span><span>}
</span>
<span>add_action("admin_menu", "social_share_menu_item");</span>

Hier fügen wir ein Menüelement mit add_submenu_page hinzu, das tats?chlich in der Aktion admin_Menu aufgerufen wird. Social_Share_Page ist die Rückruffunktion, die den Inhalt der Optionsseite anzeigen muss.

Hier sieht unser Menüpunkt aus:

Seite einer Optionen erstellen Seite

codieren wir die Funktion social_share_page, den Seiteninhalt der Optionen anzuzeigen.

--social-share
	-social-share.php
	-style.css

Hier fügen wir einen Abschnitt mit dem Namen social_share_config_section hinzu und registrieren die Einstellungen als Social-Share.

Zeigt nun den Abschnitt und seine Optionsfelder an.

<span><span><?php
</span></span><span>
</span><span><span>/*
</span></span><span><span>Plugin Name: Social Share
</span></span><span><span>Plugin URI: https://www.sitepoint.com
</span></span><span><span>Description: Displays Social Share icons below every post
</span></span><span><span>Version: 1.0
</span></span><span><span>Author: Narayan Prusty
</span></span><span><span>*/</span></span>

Hier k?nnen wir den Benutzer aus den Schaltfl?chen Facebook, Twitter, LinkedIn und Reddit Sharing ausw?hlen. Wir stellen eine Checkbox -Schnittstelle zur Verfügung, mit der Administratoren ausw?hlen k?nnen, welche Schaltfl?chen angezeigt werden sollen. Sie k?nnen die Liste erweitern, um mehr Social -Media -Websites bei Bedarf zu unterstützen.

Hier sieht unsere endgültige Optionsseite aus:

Zeigen Sie die Social Sharing -Schaltfl?chen

an

Um soziale Freigabebasten unter jedem Beitrag anzuzeigen, müssen wir den Inhalt jedes Beitrags filtern, bevor er verschickt wird. Wir müssen den The_Content -Filter verwenden, um das Ende der Beitr?ge soziale Freigabebasten hinzuzufügen.

Hier ist Code, wie Sie Postinhalte filtern und Social -Media -Schaltfl?chen anzeigen.

<span>function social_share_menu_item()
</span><span>{
</span>  <span>add_submenu_page("options-general.php", "Social Share", "Social Share", "manage_options", "social-share", "social_share_page"); 
</span><span>}
</span>
<span>add_action("admin_menu", "social_share_menu_item");</span>

So funktioniert dieser Code:

• Zuerst fügen wir einen Wrapper für unsere Social -Media -Sharing -Links hinzu.
• Dann rufen wir die vollst?ndige URL des aktuellen Beitrags ab, der auf den Social -Media -Websites geteilt wird. Wir entkommen auch der URL mit WordPress, deren ESC_url -Funktion vorgesehen ist.
• Dann prüfen wir, welche Schaltfl?chen Benutzer anzeigen m?chten, und fügen Sie das jeweilige Schaltfl?che zum Post -Inhalt hinzu.
• Schlie?lich fügen wir die aktuelle Post -URL zum Ende der Links der sozialen Freigabe der jeweiligen Social -Media -Websites hinzu.

Hier ist, wie unsere Social-Media-Schaltfl?chen auf dem Front-End unter jedem Beitrag schauen:

Styling der Social -Media -Schaltfl?chen

Lassen Sie uns Style.css am Front-End anbringen, in dem wir den Code zum Styling der Schaltfl?chen platzieren. Hier ist der Code, der die Datei style.csss enth?lt.

function social_share_page()
{
   ?>
      <span><span><span><div</span> class<span>="wrap"</span>></span>
</span>         <span><span><span><h1</span>></span>Social Sharing Options<span><span></h1</span>></span>
</span> 
         <span><span><span><form</span> method<span>="post"</span> action<span>="options.php"</span>></span>
</span>            <span><span><?php
</span></span><span>               <span>settings_fields("social_share_config_section");
</span></span><span> 
</span><span>               <span>do_settings_sections("social-share");
</span></span><span>                
</span><span>               <span>submit_button(); 
</span></span><span>            <span>?></span>
</span>         <span><span><span></form</span>></span>
</span>      <span><span><span></div</span>></span>
</span>   <span><span><?php
</span></span><span><span>}</span></span>

Hier ist der CSS -Code zum Styling der Schaltfl?chen:

function social_share_settings()
{
    add_settings_section("social_share_config_section", "", null, "social-share");
 
    add_settings_field("social-share-facebook", "Do you want to display Facebook share button?", "social_share_facebook_checkbox", "social-share", "social_share_config_section");
    add_settings_field("social-share-twitter", "Do you want to display Twitter share button?", "social_share_twitter_checkbox", "social-share", "social_share_config_section");
    add_settings_field("social-share-linkedin", "Do you want to display LinkedIn share button?", "social_share_linkedin_checkbox", "social-share", "social_share_config_section");
    add_settings_field("social-share-reddit", "Do you want to display Reddit share button?", "social_share_reddit_checkbox", "social-share", "social_share_config_section");
 
    register_setting("social_share_config_section", "social-share-facebook");
    register_setting("social_share_config_section", "social-share-twitter");
    register_setting("social_share_config_section", "social-share-linkedin");
    register_setting("social_share_config_section", "social-share-reddit");
}
 
function social_share_facebook_checkbox()
{  
   ?>
        <span><span><span><input</span> type<span>="checkbox"</span> name<span>="social-share-facebook"</span> value<span>="1"</span> <span><span><?php checked(1, get_option('social-share-facebook'), true); ?></span></span> /></span> Check for Yes
</span>   <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function social_share_twitter_checkbox()
</span></span><span><span>{  
</span></span><span>   <span>?></span>
</span>        <span><span><span><input</span> type<span>="checkbox"</span> name<span>="social-share-twitter"</span> value<span>="1"</span> <span><span><?php checked(1, get_option('social-share-twitter'), true); ?></span></span> /></span> Check for Yes
</span>   <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function social_share_linkedin_checkbox()
</span></span><span><span>{  
</span></span><span>   <span>?></span>
</span>        <span><span><span><input</span> type<span>="checkbox"</span> name<span>="social-share-linkedin"</span> value<span>="1"</span> <span><span><?php checked(1, get_option('social-share-linkedin'), true); ?></span></span> /></span> Check for Yes
</span>   <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function social_share_reddit_checkbox()
</span></span><span><span>{  
</span></span><span>   <span>?></span>
</span>        <span><span><span><input</span> type<span>="checkbox"</span> name<span>="social-share-reddit"</span> value<span>="1"</span> <span><span><?php checked(1, get_option('social-share-reddit'), true); ?></span></span> /></span> Check for Yes
</span>   <span><span><?php
</span></span><span><span>}
</span></span><span> 
</span><span><span>add_action("admin_init", "social_share_settings");</span></span>

Schlussfolgerung

In diesem Artikel habe ich Ihnen gezeigt, wie Sie einfach ein Social Media Sharing -Plugin erstellen k?nnen. Sie k?nnen nun dies erweitern, um Schaltfl?chen für weitere Social -Media -Websites hinzuzufügen und die Anzahl der Aktien zusammen mit den Schaltfl?chen anzuzeigen. Bitte teilen Sie Ihre Erfahrungen mit Ihren eigenen Plugins unten.

H?ufig gestellte Fragen zum Erstellen Ihres eigenen Plugin für soziale Freigabe für WordPress

Wie kann ich mein Social Sharing -Plugin für WordPress anpassen? Sie k?nnen das Aussehen Ihrer Schaltfl?chen, ihre Gr??e, Farbe und sogar ihre Schwebeffekte ?ndern. Sie k?nnen auch entscheiden, wo Ihre Schaltfl?chen auf Ihrer Website angezeigt werden sollen, unabh?ngig davon, ob sie sich oben, unten oder auf den Seiten Ihrer Beitr?ge befinden. Denken Sie daran, Ihre ?nderungen immer zu testen, um sicherzustellen, dass sie wie erwartet funktionieren, und st?ren die Funktionen Ihrer Website nicht.

Kann ich meinem Plugin mehr Social -Media -Plattformen hinzufügen? Kann Ihrem Plugin weitere Social -Media -Plattformen hinzufügen. Dies kann durch Hinzufügen weiterer Schaltfl?chenelemente in Ihren PHP -Code und der Verknüpfung mit den jeweiligen Social Media Sharing URLs erfolgen. Stellen Sie sicher, dass Sie für jede Plattform die richtige URL -Struktur verwenden, um sicherzustellen, dass die Freigabefunktion korrekt funktioniert. Medienfragen. Mit diesen k?nnen Sie verschiedene Stile für verschiedene Bildschirmgr??en festlegen und sicherstellen, dass Ihre Schaltfl?chen auf allen Ger?ten gut aussehen. Sie k?nnen je nach Bildschirmgr??e unterschiedliche Gr??en, Positionen und sogar verschiedene Bilder für Ihre Schaltfl?chen angeben. Verfolgen Sie die Leistung Ihrer Social Sharing -Schaltfl?chen, indem Sie sie in Analytics -Tools wie Google Analytics integrieren. Dies kann durch Hinzufügen von Tracking -Codes zu Ihren Schaltfl?chenlinks erfolgen. Auf diese Weise k?nnen Sie sehen, wie oft jeder Schaltfl?che klickt und wie viel Verkehr sie zu Ihrer Website f?hrt. Das Hinzufügen einer Aktienzahl zu Ihren Social Sharing -Schaltfl?chen kann durch die Verwendung der von den Social Media -Plattformen bereitgestellten APIs durchgeführt werden. Diese APIs erm?glichen es Ihnen, die H?ufigkeit abzurufen, mit der eine URL auf ihrer Plattform geteilt wurde. Sie k?nnen diese Nummer dann neben Ihren Freigabetasten anzeigen. Beachten Sie, dass nicht alle Plattformen diese Funktion bereitstellen, und einige müssen m?glicherweise eine Anwendung für die Verwendung ihrer API registrieren. Fügen Sie soziale Freigabetasten zu benutzerdefinierten Post -Typen hinzu. Dies kann durchgeführt werden, indem der PHP -Code ge?ndert wird, der Ihre Schaltfl?chen generiert. Sie müssen eine Bedingung hinzufügen, die den Post -Typ überprüft und die Tasten entsprechend hinzufügt. Stellen Sie sicher, dass Sie Ihre ?nderungen testen, um sicherzustellen, dass sie korrekt funktionieren.

Wie kann ich meine Social Sharing -Schaltfl?chen für SEO optimieren? Diese Tags enthalten Informationen zu Ihren Inhalten zu den Social -Media -Plattformen, wie z. B. Titel, Beschreibung und Bild, die angezeigt werden k?nnen, wenn Ihr Inhalt gemeinsam genutzt wird. Dies kann die Sichtbarkeit und die Klickrate Ihres gemeinsam genutzten Inhalts verbessern. . SVG-Symbole basieren auf vektorbasiertem, was bedeutet, dass sie ohne Qualit?tsabwehr skaliert werden k?nnen. Dies macht sie zu einer guten Wahl für reaktionsschnelle Designs. Sie k?nnen entweder vorgefertigte SVG-Symbole verwenden oder Ihre eigene mit Grafikdesign-Software erstellen. Das WordPress -Menü kann mit dem WordPress -Menü -Editor erfolgen. Sie k?nnen Ihrem Menü einen benutzerdefinierten Link hinzufügen und CSS verwenden, um ihn als Schaltfl?che zu stylen. Beachten Sie, dass dies einen statischen Link erzeugt, nicht eine dynamische, die sich basierend auf der aktuellen Seite ?ndert. Schneller kann erreicht werden, indem Sie Ihren Code und Ihre Ressourcen optimieren. Dies beinhaltet das Minimieren Ihrer CSS- und JavaScript -Dateien, die Optimierung Ihrer Bilder und die Verwendung effizienter Code. Sie k?nnen auch Caching- und Content Delivery Networks (CDNs) verwenden, um die Ladezeiten weiter zu verbessern.

Das obige ist der detaillierte Inhalt vonErstellen Sie Ihr eigenes Plugin für soziale Freigabe für WordPress. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!