把Facebook的Like功能做到Shopify頁面

今天SHOPIFY教學網說下facebook的Like功能,Facebook用戶可以通過點擊按鈕對你的facebook page做出喜歡關注的行為,對於用戶開發,精準營銷,需求挖掘等等商業行為有很大幫助。

Facebook Like功能

添加facebook Like到Shopify頁面

AddThis插件版,Facebook原生版,兩個版本各有各的好處。

AddThis免費,選擇樣式,生成,安裝代碼即可。

原生版呢,正宗的Facebook產物,需要代碼基礎,不過也不難。

AddThis版

註冊AddThis,Addthis這個功能還是很強大的,有分享,關註,訂閱等等網頁工具。

選擇Follow Button,選擇Follow的樣式類型,然後添加對應的社群帳號名稱,設置風格,保存,選擇程序Shopify 按照引導安裝即可。

這里只粗略一說,因為我感覺這個工具並不能把懶惰的習慣最大化,做出來是點擊進入Page,然後再Like的動作,但是樣式風格還算好看

,看個人喜好吧。而下面我要說的原生版則不同,更為方便,切展示風格原汁原味。

Facebook Like功能

Facebook 原生版

我們先打開https://developers.facebook.com/docs/plugins/Like-button

這里面他已經給出了教程,操作很簡單,添加上你的facebook

page鏈接,然後調整樣式,獲得代碼。

代碼分為兩個部分,上面的安裝代碼位置是theme.liquid文件內的上放即可。

第二段代碼要放置在你想顯示Like按鈕的位置,我這裡舉例產品頁面,我們放到描述的底部。

位置查找方法,先打開Templates文件夾內的product.liquid,這里面一般會引用Sections文件夾內的product-Template.liquid之類的名稱

如:{% section “product-Template” %};

有的會直接或者再引用Snippets文件夾內內的product-Template.liquid之類的名稱,如:{% include ‘product-Template’ %};

我們打開

這個代碼文件後,Ctrl+F查找哪個文件里面有(itemprop=”description”),點擊這段代碼,會有橘黃色高亮顯示,然後下面代碼結束位

置也會有一個代碼高亮顯示。那麽我們就在這個代碼下方放置第二段代碼,即可保存刷新查看效果。

有些模板有多個描述布局,也就是搜索itemprop=”description”的時候是多個,那麽我們隨便放置查看效果,如果不行我們換另外一個。

這個Like的好處是,如果你登錄了點擊下直接Like,如果沒有登錄,他它會一個小窗口登錄即可;它還可以展示你朋友圈內Like這個Page

的用戶,一個很容易獲得用戶信任值的小細節。

如何把Facebook的Like功能做到Shopify頁面,上面的做法希望對你們有用。有問題可以直接問SHOPIFY教學網客服。

留下評論

Please enter your comment!
Please enter your name here