Thêm liên kết mạng xã hội trong khung thông tin thành viên 2013-06-28

Demo : http://gome.vn/threads/cu-phap-template-trong-xenforo.10546/




Cách làm :
1. Tải file icon.zip về và up lên host của bạn theo đường dẫn sau : styles/ipb/xenforo/icons/

2. Vào AdminCP > User > Custom User Fields
+Facebook : vào phần Garenal Options và làm như hình



Đoạn code trong Value Display HTML :

Mã:

<a href="http://www.facebook.com/{$valueUrl}" target="_blank"><img src="styles/ipb/xenforo/icons/facebook.png" alt="Facebook Profile"/></a>

+Twitter : Vào phần Garenal Options và làm như hình


Đoạn code trong Value Display HTML:

Mã:

<a href="https://twitter.com/{$valueUrl}" target="_blank"><img src="styles/ipb/xenforo/icons/twitter.png" alt="Twitter Profile"/></a>

+Youtube : tạo fields với ID : Youtube, Display Location chọn Chi tiết liên hệ , còn phần options làm giống như trên :

Mã:

<a href="http://www.youtube.com/channel/{$valueUrl}" target="_blank"><img src="styles/ipb/xenforo/icons/youtube.png" alt="YouTuBe Chanel"/></a>

3. Vào AdminCP > Styles > Templates > message_user_info tìm đoạn sau :

Mã:

                <xen:foreach loop="$userFieldsInfo" key="$fieldId" value="$fieldInfo">
                    <xen:if is="{$fieldInfo.viewable_message}">
                        <xen:if hascontent="true">
                            <dl class="pairsJustified userField_{$fieldId}">
                                <dt>{xen:helper userFieldTitle, $fieldId}:</dt>
                                <dd><xen:contentcheck>{xen:helper userFieldValue, $fieldInfo, $user, {$user.customFields.{$fieldId}}}</xen:contentcheck></dd>
                            </dl>
                        </xen:if>
                    </xen:if>
                </xen:foreach>

Thay bằng đoạn sau :

Mã:

<dl class="pairsInline userField_{$fieldId}">
<xen:foreach loop="$userFieldsInfo" key="$fieldId" value="$fieldInfo">
<xen:if is="{$fieldInfo.viewable_message}">
<xen:if hascontent="true">
<dd><xen:contentcheck>{xen:helper userFieldValue, $fieldInfo, $user, {$user.customFields.{$fieldId}}}</xen:contentcheck></dd>
</xen:if>
</xen:if>
</xen:foreach>
</dl>

4. Vào AdminCP > Styles > Templates > EXTRA.css thêm đoạn sau :

Mã:

.messageUserBlock .userField_facebook, .userField_twitter, .userField_Youtube  {

float: left !important;

margin-top: 12px !important;

margin-right: -1px !important;

}

Nếu các bạn muốn thêm skype và yahoo thì thêm .userField_(id của field yahoo,skype) vào sau .userField_Youtube . VD :

Mã:

.messageUserBlock .userField_facebook, .userField_twitter, .userField_Youtube,  .userField_yahoo, .userField_skype {

float: left !important;

margin-top: 12px !important;

margin-right: -1px !important;

}

Thêm các mạng xã hội khác như trên
5.Done!