Hello, how i can add 2 column in modern statistics

  1. namtam

    namtam - Feb 22, 2016 New Member VIP Member

    Credit
    Point
    Hello, i want to have 2 column in modern statistics, like new user and recent thread.
    There is demo, thanks
    [​IMG]
     
    Loading...
  2. Brivium

    Brivium - Feb 22, 2016 XenForo Services Staff Member

    Credit
    Point
    You can add this code into your PAGE_CONTAINER template where you want to display.
    Code:
    <div class="columnsContainer">
        <div class="leftColumn"><xen:hook name="msLeftColumn" /></div>
        <div class="rightColumn"><xen:hook name="msRightColumn" /></div>
    </div>
    And add following code into EXTRA.css template
    Code:
    .leftColumn {
        float: left;
        width: 50%;
    }
    .rightColumn {
        float: right;
        width: 50%;
    }
    .columnsContainer {
        content:"";
        display: table;
        clear: both;
    }
    Then create 2 modern stats with above hook name (msLeftColumn & msRightColumn)

    Regards,
     
    namtam likes this.
    #2
  3. namtam

    namtam - Feb 22, 2016 New Member VIP Member

    Credit
    Point
    Hello, i have try this metod but not show in 2 column side by side
     

    Attached Files:

    #3
  4. phucdinh997

    phucdinh997 - Feb 23, 2016 New Member VIP Member

    Credit
    Point
    Code:
    msLeftColumn
    Code:
    msRightColumn
    You should put these in "position:"
     
    namtam likes this.
    #4
  5. Brivium

    Brivium - Feb 23, 2016 XenForo Services Staff Member

    Credit
    Point
    Position (hook name) should be msLeftColumn & msRightColumn for each MS.

    Regards,
     
    namtam likes this.
    #5
  6. namtam

    namtam - Feb 23, 2016 New Member VIP Member

    Credit
    Point
    Hello, i thanks for your help. But i have problem with mobile browser. Can i hide modern statistic on mobile? Thanks
    Screenshot_2016-02-23-07-07-17
     
    #6
  7. Brivium

    Brivium - Feb 23, 2016 XenForo Services Staff Member

    Credit
    Point
    Just adding following code into EXTRA.css template
    Code:
    <xen:if is="@enableResponsive">
    @media (max-width:@maxResponsiveNarrowWidth)
    {
        .Responsive .columnsContainer
        {
          display: none;
        }
    }
    </xen:if>
     
    namtam likes this.
    #7
  8. namtam

    namtam - Feb 23, 2016 New Member VIP Member

    Credit
    Point
    :D, thanks you. I have done! I looking for other the best add-on! Great man
     
    #8