Add Googles' +1 Buttons to your forum ( Thêm Nút Google +1)

Discussion in 'Template Modifications' started by thanhdia, 17/6/11.

  1. thanhdia

    • Moderator

    Member Since:
    2/5/11
    Message Count:
    51
    "Thích" đã nhận:
    48
    Điểm nhận Cup:
    18
    Giới tính:
    Nam
    Hey guys,

    When using my adsense account google kept nagging me to use their +1 button eventually I thought, why not?

    I wanted it in the same place as the other social network-y type things under the "Share this page" section near the bottom of a view-thread page.

    So I got what i wanted (http://www.hummy.tv/) click through on to a discussion/thread and you'll see at the bottom.

    This is what I did.

    First of all get your google +1 code:

    http://www.google.com/webmasters/ 1/button/

    Once you have your code, you need to put the javascript in either in the <head> section or just above the </body>.

    I used "footer" template and put it right at the bottom of the template after all code. It appears just above 2 jquery scripts then its </body> .. close enough I recon! :)

    Save this change then go back to Templates and look for: "share_page".

    This one is more awkward.. and a bit hacky! I didn't have time to add to any stylesheets so I cheated and used the class from the FacebookLike feature to give it the correct position and layout, otherwise the +1 button floats to the right.

    You can put the button where you like, but I put it between the Twitter and Facebook icons this is the code you need:
    HTML:
    <div class="facebookLike shareControl"><g:plusone size="medium"></g:plusone></div>
    Make sure you change the "size" to the size you want, but I believe the medium one matches the other social network plugin things..

    Your code for the share_page should now look like this:

    HTML:
    <xen:if hascontent="true">

    <xen:require css="share_page.css" />

    <div class="sharePage">

        <h3 class="textHeading larger">{xen:phrase share_this_page}</h3>

        <xen:contentcheck>

            <xen:if is="{$xenOptions.tweet.enabled}">
                <div class="tweet shareControl">
                    <a href="http://twitter.com/share" class="twitter-share-button"
                        data-count="horizontal"
                        data-lang="{xen:helper twitterLang, $visitorLanguage.language_code}"
                        data-url="{$url}"
                        {xen:if {$thread.title}, 'data-text="{$thread.title}"'}
                        {xen:if {$xenOptions.tweet.via}, 'data-via="{$xenOptions.tweet.via}"'}
                        {xen:if {$xenOptions.tweet.related}, 'data-related="{$xenOptions.tweet.related}"'}>{xen:phrase tweet}</a>
                </div>
            </xen:if>
<div class="facebookLike shareControl"><g:plusone size="medium"></g:plusone></div>
            <xen:if is="{$xenOptions.facebookLike}">
                <div class="facebookLike shareControl">
                    <xen:container var="$facebookSdk">1</xen:container>
                    <fb:like href="{$url}" show_faces="true" width="500" action="{$xenOptions.facebookLikeAction}" font="trebuchet ms" colorscheme="@fbColorScheme"></fb:like>
                </div>
            </xen:if>
        </xen:contentcheck>

    </div>
</xen:if>
    Now Save! That should be it! Hope this all makes sense!

    Any questions hit reply and I'll try my best.

    Regards,

    Micahael
    thanhdia, 17/6/11
    #1

  2. systems2512

    • New Member

    Member Since:
    1/5/11
    Message Count:
    10
    "Thích" đã nhận:
    0
    Điểm nhận Cup:
    1
    Giới tính:
    Nam
    Giờ em muốn thêm vào chỗ nút Like với Reple thì Edit ở Tem nào vậy anh?
    systems2512, 18/6/11
    #2

  3. hieucocc

    • Active Member

    Member Since:
    18/11/11
    Message Count:
    215
    "Thích" đã nhận:
    79
    Điểm nhận Cup:
    28
    Giới tính:
    Nam
    lên 1.1.2 tự động có sẵn rùi càng ngày XF càng ngon :D
    hieucocc, 20/2/12
    #3

  4. syntax

    • New Member

    Member Since:
    29/3/12
    Message Count:
    27
    "Thích" đã nhận:
    4
    Điểm nhận Cup:
    3
    Giới tính:
    Nam
    Sao của mình không hiện lên Google + nhỉ? Chỉ thấy mỗi Tweer, facebook, Mình check cũng đã có sẵn đoạn mã trên rồi. Hay là phải bật chỗ nào nữa ko??
    syntax, 3/4/12
    #4

  5. RED

    • Active Member

    • Demo Xenforo: www.4tvn.com
    Member Since:
    27/3/12
    Message Count:
    143
    "Thích" đã nhận:
    39
    Điểm nhận Cup:
    28
    Giới tính:
    Nữ
    Đến từ:
    Huế
    1.1.2 có sẵn rồi, vào options xem nhé
    RED, 3/4/12
    #5

Share This Page

Users found this page by searching for:

  1. button facebook like xenforo

    ,

  2. <fb:like href={$url} show_faces=true width=500 action={$xenOptions.facebookLikeAction}