Skapa en social uppdateringsvägg i din WordPress-blogg med socialistiska jQuery-plugin
Socialist är ett otroligt nytt jQiuery-plugin som aggregerar dina uppdateringar på olika sociala nätverk och visar dem vackert i ett nät som liknar Pinterest. Kolla in skärmdumpen nedan för en uppfattning om hur vacker detta är och läs vidare om hur du implementerar detta i WordPress.
Obs! Socialist är ett jQuery-plugin. Jag ger fullständiga instruktioner om hur man implementerar detta i WordPress, men en fungerande kunskap om jQuery skulle vara till hjälp för att identifiera typsnitt eller fel i din kod. Detta bör också betraktas som en betaversion; vissa saker är trasiga, formatering är inte perfekt, men det är fortfarande ganska användbart och imponerande
Introduktion
Olika plugins finns för att dra uppdateringar från specifika nätverk eller de senaste inläggen från ett RSS-flöde, men ingen gör dem alla och ingen är lika attraktiva som detta. Här är vad du kan förvänta dig från cirka 10 linjer med kod:
Pluggen kan få tillgång till en mängd olika sojala nätverk, liksom vanliga RSS, gripande bilder och innehåll - inklusive:
- Flickr
- Youtube
- RSS
- craigs~~POS=TRUNC
- Google+
Tumblr-stöd finns också på listan, men det finns ett fel i koden som förhindrar det från att fungera. Förhoppningsvis kommer det att lösas när den här handledningen publiceras.
Integrera till WordPress
-
- Ladda en sida på din webbplats och visa källan. Sök efter strängen jQuery; Om du redan har det, fortsätt till steg 2. Om inte, lägg till jQuery genom att inkludera följande rad i dina funktioner.php: wp_enqueue_script ('jquery');
- Hämta zip-filen av socialist från github [Ej längre tillgänglig]. Unzip och ladda upp mappen till din fungerande temakatalog via FTP.
- Byt namn på mappen till “socialistisk”
- I header.php lägger du till följande två rader någonstans under wp_head-funktionen men före sluttaggen:
- Skapa en ny sida där du vill att det socialistiska blocket ska visas. Jag antar att du vill ha det på en separat sida, men du kan även lägga till koden i din indexmall någonstans. Om du går till en separat sida, duplicera din befintliga sidmall och ringa den “page-slug.php” där slug är den permalink som WordPress gav din nya sida (det vill säga titeln, med streck för mellanslag och vanliga ord borttagna).
- Redigera sidan för att ta bort WordPress-loop-innehållet; vi vill ha en grundläggande layout med meta info och sådant.
Lägga till socialistisk kod
Öppna den speciella sidmallen som du skapade tidigare och klistra in i följande kod till huvudinnehållsområdet. Ändra stilen för den socialistiska DIV för att passa ditt tema; Jag hittade att inte ange bredd bröt layouten, men det kan ha varit speciellt för mitt tema. Koden nedan är förprogrammerad till några av mina egna sociala uppdateringskällor; självklart vill du ändra de olika ID-erna till din egen. För det exakta formatet eller några ytterligare parametrar, se Readme-filen. I allmänhet är allt du behöver är id-parametern. Börja med en och arbeta upp, eftersom ett felaktigt ID kommer att orsaka att pluginet bryts.
Sammanfattning
Det kan göra med lite mer anpassning när det gäller boxstorlek eller layout och är mer robust; men det är fortfarande tidiga dagar och det vi redan har är verkligen imponerande tror jag. Faktum är att det här skulle vara perfekt att sätta på framsidan av din personliga domän med tanke på ett personligt domän? Här är några coola användningsområden för att ta hänsyn till ett personligt domän? Här är några coola användningar för det Även om du inte är en fan av bloggar och inte har en fantastisk ny webbplats att starta kan en personlig domän vara ett fantastiskt verktyg för att äga för roligt eller självpromotion: från en anpassad ... Läs Mer som vi diskuterade förra veckan.
Om du har problem eller behöver ha en hand som sätter detta in i WordPress, var god att fråga i kommentarerna nedan, men ta med en testwebbadress. Jag kan titta på och granska några kodfel. För fel i själva pluginet, vänligen skicka en ny fråga till GitHub. Tänk att någon annan skulle kunna göra av denna fantastiska jQuery-socialisera plugin? Dela sedan med knapparna nedan för att berätta för världen.
Utforska mer om: Blogging, Wordpress-plugins.