添加社交網(wǎng)絡(luò)到您的站點(diǎn)(AddingSocialNetworkingtoYourWebsite)
本章詳細(xì)講述如何整合,在你的站點(diǎn)上建立社交網(wǎng)絡(luò)服務(wù)。
我們提供的服務(wù)有：做網(wǎng)站、成都網(wǎng)站建設(shè)、微信公眾號(hào)開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、洛扎ssl等。為上千家企事業(yè)單位解決了網(wǎng)站和推廣的問題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的洛扎網(wǎng)站制作公司
在本章中，您將學(xué)習(xí)如何讓社交網(wǎng)站的書簽\鏈接、Facebook或Digg等網(wǎng)站的鏈接、Twitter的feeds， gravatar頭像和Xbox玩家卡添加到您的網(wǎng)站中。
您將學(xué)習(xí)：
- 如何讓社交網(wǎng)站書簽/鏈接添加到您的網(wǎng)站。
- 如何添加一個(gè)Twitter的feeds。
- 如何呈現(xiàn)Gravatar.com圖像（頭像）。
- 如何顯示在您的網(wǎng)站上的Xbox玩家卡。
- 如何添加一個(gè)Facebook 按鈕到您的網(wǎng)頁。
以下是在本章介紹ASP.NET編程時(shí)引入的概念：
- LinkShare 助手。
- Twitter助手。
- Gravatar助手。
- GamerCard助手。
- Facebook助手。
讓社交網(wǎng)站的鏈接添加到您的站點(diǎn)
如果訪問者喜歡您網(wǎng)站的信息，并且經(jīng)常要分享給朋友時(shí)。人們可以點(diǎn)擊一個(gè)文字（圖標(biāo)）形式的鏈接，從而分享內(nèi)容到DIGG（掘客）、Reddit（一個(gè)社交新聞?wù)军c(diǎn)）、Facebook、Twitter或相似的網(wǎng)站，在本節(jié)內(nèi)容中，你可以簡(jiǎn)單的實(shí)現(xiàn)這一功能。為了顯示出這些圖標(biāo)或文字鏈接，需要加入LinkShare的助手。人們?cè)谠L問您的網(wǎng)頁，要分享內(nèi)容時(shí)可以點(diǎn)擊一個(gè)鏈接，如果他們有一個(gè)該社交站點(diǎn)的賬號(hào)，則可以將您站點(diǎn)的信息分享到社交站點(diǎn)，并將您的鏈接張?zhí)缴缃徽军c(diǎn)上。
1. 如果您還沒有添加ASP.NET Web Helpers Library到您的站點(diǎn)，請(qǐng)?zhí)砑舆M(jìn)來，具體方法請(qǐng)參照WebMatrix和ASP.NET網(wǎng)頁入門。
2. 創(chuàng)建一個(gè)名為頁ListLinkShare.cshtml，并在其中添加以下標(biāo)記：
<!DOCTYPE html>
<html>
<head>
<title>LinkShare 范例</title>
</head>
<body>
<h2>LinkShare Example</h2>
分享: @LinkShare.GetHtml("您要分享的內(nèi)容。")
</body>
</html>
在這個(gè)范例中，您可以將您要分享的內(nèi)容做為參數(shù)，分享到社交站點(diǎn)中。當(dāng)然，這個(gè)參數(shù)您是可以自定義的。
3. 在瀏覽器中運(yùn)行的ListLinkShare.cshtml的頁面。 （確保本頁面在選定的文件工作區(qū)，然后再運(yùn)行它。）
4. 點(diǎn)擊一個(gè)站點(diǎn)的文字（圖標(biāo)）鏈接，您可以共享您的信息和鏈接到您選定的社交網(wǎng)絡(luò)站點(diǎn)上的頁面中。例如，如果您按一下del.icio.us鏈接，將獲取你的頁面信息到del.icio.us站點(diǎn)的保存書簽頁面中。
在您的站點(diǎn)中加入一個(gè)Twitter feed
ASP.NET提供者輔助功能可以讓我們?cè)谡军c(diǎn)中增加Twitter feed，如果在您的代碼中使用Twitter.Profile方法，可以為您的網(wǎng)頁上顯示特定的Twitter用戶Twitter feed。如果在您的代碼中使用Twitter.Search方法，則可以為您的網(wǎng)站中顯示根據(jù)指定搜索內(nèi)容呈現(xiàn)出來的結(jié)果。并且這個(gè)Twitter助手高寬都是可以設(shè)置的。
在您的網(wǎng)站點(diǎn)添加Twitter助手的時(shí)候不需要您的賬號(hào)信息，這些信息是公開的。
下列步驟顯示了如何建立一個(gè)網(wǎng)頁，演示了這兩種Twitter的助手。
1. 如果您還沒有添加ASP.NET Web Helpers Library到您的站點(diǎn)，請(qǐng)查閱第1章所述。同時(shí)在這里也需要添加Twitter.Helper到您的站點(diǎn)。
2. 添加一個(gè)新的頁面網(wǎng)站名為Twitter.cshtml。
3. 添加下面的代碼和標(biāo)記到頁面中：
<!DOCTYPE html>
<html>
<head>
<title>Twitter 范例</title>
</head>
<body>
<table>
<tr>
<td>Twitter profile helper</td>
<td>Twitter search helper</td>
</tr>
<tr>
<td>@Twitter.Profile("<Insert User Name>")</td>
<td>@Twitter.Search("<Insert search criteria here>")</td>
</tr>
</table>
</body>
</html>
4. 將Twitter.Profile語句塊方法參數(shù)中的<Insert用戶名>改為您指定的帳戶名就會(huì)獲取您要顯示的賬號(hào)的feed。
5. 在Twitter.Search語句塊主應(yīng)運(yùn)參數(shù)中的<Insert搜索標(biāo)準(zhǔn)here>替換為您搜索的文本。
6. 在瀏覽器中運(yùn)行頁。
呈現(xiàn)Gravatar網(wǎng)站獲取的形像（頭像）
Gravatar（全球通用頭像）是一個(gè)提供可以代表您形像（頭像）服務(wù)的站點(diǎn)。例如Blog評(píng)論或論壇發(fā)帖等等，都可以使用Gravatar提供的形像。（你可以注冊(cè)自己的gravatar網(wǎng)站的gravatar http://www.gravatar.com/。）如果想在您的站點(diǎn)上提供形像（頭像）功能，則可以使用gravatar助手。
在下面的例子中，您將使用一個(gè)單一的表示您自己的gravatar形像。Gravatar還有另一種用法，是當(dāng)用戶在您站點(diǎn)注冊(cè)賬號(hào)時(shí)，可以指定一個(gè)Gravatar形像的地址。（關(guān)于注冊(cè)、安全和成員您可以查看第16章）每當(dāng)顯示用戶信息時(shí)，可以顯示該用話指定的Gravatar形像。
1. 如果您還沒有添加ASP.NET Web Helpers Library到您的站點(diǎn)，請(qǐng)查閱第1章所述。
2. 創(chuàng)建一個(gè)新的網(wǎng)頁，名為Gravatar.cshtml。
3. 將以下標(biāo)記添加到您的頁面中：
<!DOCTYPE html>
<html>
<head>
<title>Gravatar 范例</title>
</head>
<body>
<h2>Gravatar Example</h2>
@Gravatar.GetHtml("<您的Gravatar賬號(hào)寫>")
@Gravatar.GetHtml("<您的Gravatar 賬號(hào)>", 40)
</body>
</html>
Gravatar.GetHtml方法顯示的gravatar頁面上的圖像。為了改變圖像的大小，可以設(shè)置第二個(gè)參數(shù)。不設(shè)參數(shù)默認(rèn)大小為80，數(shù)字小于80使圖像變小，大于80的數(shù)字，使圖像放大。
4. 在Gravatar.GetHtml方法，替換<您的Gravatar賬號(hào)寫>您為您的gravatar帳戶使用的電子郵件地址。（如果沒有的gravatar的帳戶，您可以使用電子郵件地址）
5. 在瀏覽器中運(yùn)行頁。頁面顯示您指定的電子郵件地址的gravatar圖像。第二個(gè)圖像是比第一次小。
顯示您XBox玩家卡
當(dāng)人們玩微軟Xbox在線游戲時(shí)，每個(gè)用戶都有一個(gè)唯一的ID。統(tǒng)計(jì)信息被保存成一個(gè)游戲卡的形式，這張卡里顯示了他們的聲譽(yù)，玩家評(píng)分，最近玩過的每個(gè)游戲。如果您是Xbox玩家，您可以使用GamerCard幫手，在您的網(wǎng)站頁面上顯示您的玩家卡。
1. 如果您還沒有添加ASP.NET Web Helpers Library到您的站點(diǎn)，請(qǐng)查閱第1章所述。
2. 創(chuàng)建一個(gè)新頁面名為XboxGamer.cshtml添加下面的標(biāo)記。
<!DOCTYPE html>
<html>
<head>
<title>Xbox Gamer Card</title>
</head>
<body>
<h2>Xbox Gamer Card</h2>
@GamerCard.GetHtml("major nelson")
</body>
</html>
您使用GamerCard.GetHtml的方法時(shí)，需要在參數(shù)中指定要顯示玩家卡的別名。
3. 在瀏覽器中運(yùn)行本頁。該頁面顯示您指定的Xbox玩家卡。
顯示一個(gè)Facebook的“Like”按鈕
您可以通過使用Facebook 的助手的LikeButton方法，讓人們很容易的分享您的內(nèi)容與他們的Facebook朋友。
Facebook的助手呈現(xiàn)一個(gè) LIKE 按鈕本身以及其他人的點(diǎn)擊數(shù)（這是從Facebook讀?。?b>如下圖：
當(dāng)人們?cè)谀恼军c(diǎn)上點(diǎn)擊Facebook Like按鈕時(shí)，一個(gè)描述他們喜歡的頁面的鏈接會(huì)出現(xiàn)在頁面上。
默認(rèn)情況下，F(xiàn)acebook Like按鈕是針對(duì)當(dāng)前站點(diǎn)的。還有一種常見的場(chǎng)景——在您的站點(diǎn)上為某一個(gè)鏈接添加Facebook Like按鈕，您可以使用Facebook 的助手的LikeButton方法，在參數(shù)中指定一個(gè)URL地址，在這種情況下，LikeButton可以鏈接到您所指定的任何網(wǎng)頁。如果您想在站點(diǎn)上列出其他網(wǎng)站，并提供每個(gè)網(wǎng)站一個(gè)單獨(dú)的LikeButton，那么這個(gè)功能是非常有用的。
LikeButton方法可以讓您指定如何顯示按鈕，包括：
- 是否使鏈接顯示Like鏈接或推薦鏈接。
- 如何顯示統(tǒng)計(jì)的其他人喜歡的頁面：
- 是否顯示已經(jīng)Like該頁的人在Facebook的個(gè)人主頁上的圖片形像：
- 同樣的，LikeButton方法是可以設(shè)置按鈕顯示時(shí)的寬和顏色light或dark（亮或暗）
在下面的例子中，您將創(chuàng)建兩個(gè)LikeButton。一個(gè)點(diǎn)到當(dāng)前頁面，另一個(gè)鏈到一個(gè)特定的網(wǎng)址（如：ASP.NET WebMatrix網(wǎng)站）。為了方便測(cè)試該例子，您必須有一個(gè)Facebook帳戶。
1. 如果您還沒有添加Facebook.Helper library 到您的站點(diǎn)，請(qǐng)查閱第1章所述。（請(qǐng)注意，F(xiàn)acebook.Helper是在不同的庫中，需要另外添加。）
2. 創(chuàng)建一個(gè)新頁面名為FacebookLikeBtn.cshtml添加下面的標(biāo)記。
<!DOCTYPE html>
<html>
<head>
<title>Facebook '喜歡' Button</title>
<style>body {font-family:verdana;font-size:9pt;}</style>
</head>
<body>
<p>點(diǎn)擊到當(dāng)前頁面，可使用默認(rèn)配置:</p>
@Facebook.LikeButton()
<p>點(diǎn)擊到ASP.NET WebMatrix的配置:</p>
@Facebook.LikeButton(
href: "http://www.asp.net/webmatrix",
action: "recommend",
250,
buttonLayout: "button_count",
showFaces: true,
colorScheme: "dark")
</body>
</html>
第一個(gè)例子中Facebook.LikeButton方法使用所有默認(rèn)設(shè)置，所以它指向當(dāng)前頁。第二個(gè)例子中包括了參數(shù)項(xiàng)，您可以設(shè)置指定的URL地址到LikeButton上。您可以通過改變action，將like（喜歡）變?yōu)閞ecommend（推薦），默認(rèn)是like。您可以設(shè)置buttonLayout來改變按鈕的風(fēng)格，比如可以改變?yōu)閎utton_count（相對(duì)于"standard"或 "box_count"）布局方式。如果想要顯示Facebook 主頁上的圖標(biāo)銨鈕，可以將showFaces設(shè)置為true。最后更改配色方案，您可以修改COLORSCHEME屬性為”dark”（默認(rèn)是”light”） 。
3. 在您的瀏覽器運(yùn)行的網(wǎng)頁。該頁面顯示了Facebook 正如您所指定的按鈕。
4. 點(diǎn)擊Recommend（推薦）按鈕，將指向ASP.NET網(wǎng)站。如果你沒有登錄到Facebook的話，將提示您登錄。當(dāng)您操作成功，就可以看到在墻上的推薦鏈接。
如果您在本地測(cè)試在WebMatrix頁面，您將無法測(cè)試的第一個(gè)鏈接（Like按鈕，指向當(dāng)前頁）。因?yàn)槟诒镜赜?jì)算機(jī)上運(yùn)行程序（使用本地主機(jī)的URL），那么Facebook不回應(yīng)鏈接。然而，一旦您的網(wǎng)站發(fā)布到互聯(lián)網(wǎng)上之后，鏈接將可以工作。
原文：
http://www.asp.net/web-pages/tutorials/social-networking/13-adding-social-networking-to-your-web-site
資源：
ASP.NET網(wǎng)頁與Razor語法參考
當(dāng)前題目：添加社交網(wǎng)絡(luò)到您的站點(diǎn)(AddingSocialNetworkingtoYourWebsite)
網(wǎng)頁鏈接：http://aaarwkj.com/article38/peepsp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站建設(shè)、網(wǎng)站收錄、企業(yè)網(wǎng)站制作、網(wǎng)站設(shè)計(jì)公司、App開發(fā)、自適應(yīng)網(wǎng)站
聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)
- 服務(wù)器托管國內(nèi)哪些機(jī)房比較好？ 2022-10-11
- 高防秒解服務(wù)器托管哪家好？要多少錢？ 2022-10-04
- 什么是獨(dú)享服務(wù)器托管？ 2022-10-06
- Windows服務(wù)器解決“遠(yuǎn)程桌面連接:出現(xiàn)身份驗(yàn)證錯(cuò)誤,要求的函數(shù)不受支持 2023-05-04
- 服務(wù)器中毒處理 2022-05-25
- 服務(wù)器托管首要選對(duì)機(jī)房 2022-10-06
- 關(guān)于服務(wù)器托管四大秘訣，你知道嗎？ 2022-10-03
- 對(duì)于服務(wù)器托管您了解多少？ 2022-10-08
- 重慶電信服務(wù)器托管注意事項(xiàng) 2021-03-15
- 服務(wù)器托管一年的價(jià)格怎么算？ 2022-10-08
- 香港服務(wù)器托管如何進(jìn)行安全設(shè)置 2022-10-07
- 雙線服務(wù)器托管 適合流量大網(wǎng)站 2021-03-14