xenForo 2.x Mükemmel Pospit Stili

Zeki · 7 Ağustos 2020

XF 2.x sürümü
için message_macros şablonunuzda alttaki kodu bulun

Kod:

<xf:if is="$extras.message_count">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('messages') }}</dt>
                            <dd>{$user.message_count|number}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.like_count">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('likes') }}</dt>
                            <dd>{$user.like_count|number}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.trophy_points && $xf.options.enableTrophies">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('points') }}</dt>
                            <dd>{$user.trophy_points|number}</dd>
                        </dl>
                    </xf:if>

bununla değiştirin

Kod:

   <div class="WbbWupBlock WbbWupCenterBlock">
                      <div class="infoxi shadow_hgi">
                        <div class="textxi">
                 <h4 class="orange-texti">{$user.message_count|number}</h4>
               </div>
                    <div class="arrowi orange-arrowi"></div>
                     <div class="block_hgi shadow_hgi orange-bgi">
                  <div class="orange-textim"><i class="fa fa-comments fa-large fa-fixed-width" style="padding-right:3px;"></i>
              </div>
            </div>
          </div>
        </div>
                <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="red-texti">{$user.trophy_points|number}</h4>
             </div>
                  <div class="arrowi red-arrowi"></div>
                   <div class="block_hgi shadow_hgi red-bgi">
              <div class="red-textim"><i class="fa fa-trophy fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>
                <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="green-texti">{$user.like_count|number}</h4>
              </div>
                  <div class="arrowi green-arrowi"></div>
                   <div class="block_hgi shadow_hgi green-bgi">
              <div class="green-textim"><i class="fa fa-thumbs-up fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>

Extra.less şablonunuzada şu kodları ekleyin:

Kod:

/////////Block-by-laurent68////////////
.WbbWupBlock {
  background: transparent;
}
.infoxi {
    overflow: hidden;
    margin: 5px auto;
    height: 40px;
}
.shadow_hgi {
    box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.1),1px 1px 5px 1px rgba(0,0,0,0.1);
}
.textxi {
    float: right;
    font-weight: bold;
    width: auto;
    margin-top: -5px;
}
.textxi h4 {
    margin-top: 15px;
    padding-bottom: 5px;
    border: none;
}
.arrowi {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    margin-left: 50px;
    margin-top: 10px;
}
.block_hgi {
    width: 50px;
    height: 50px;
    text-align: center;
}
.orange-texti, .red-texti, .green-texti {
    font-size: 16px;
    animation: blink 1s linear;
    padding-right: 10px;
}
.orange-textim, .red-textim, .green-textim {
    width: 100%;
    height: 100%;
    font-size: 20px;
    line-height: 40px;
    position: aboslute;
    float: left;
    color: #32CD32;
}
.orange-bgi {
    background: #ebb551;
}
.orange-textim, .orange-texti {
    color: #f46320;
}
.orange-arrowi {
    border-left: 12px solid #ebb551;
}
.red-arrowi {
    border-left: 12px solid #c62642;
}
.red-bgi {
    background: #c62642;
}
.red-textim, .red-texti {
    color: #7b132a;
}
.green-arrowi {
    border-left: 12px solid #008000;
}
.green-bgi {
    background: #008000;
}
.green-textim, .green-texti {
    color: #32CD32;
}
//////////fin-block///////////

Message_macros şablonundaki XF 2.1 sürümü için bu kodu şu kodla değiştirin
{$user.like_count|number}: {$user.reaction_score|number}

SONUÇ

EĞER ARTI ALAN EKLEMEK İSTERSENİZ ÖRNEK KONUMU WEBSİTESİ vb..

2. yöntem

message_macros şablonunuzda şunları arayın:

Kod:

<xf:if is="$extras.register_date">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('joined') }}</dt>
                            <dd>{{ date($user.register_date) }}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.message_count">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('messages') }}</dt>
                            <dd>{$user.message_count|number}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.reaction_score">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('reaction_score') }}</dt>
                            <dd>{$user.reaction_score|number}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.trophy_points && $xf.options.enableTrophies">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('points') }}</dt>
                            <dd>{$user.trophy_points|number}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.age && $user.Profile.age">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('age') }}</dt>
                            <dd>{$user.Profile.age}</dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.location && $user.Profile.location">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('location') }}</dt>
                            <dd>
                                <xf:if is="$xf.options.geoLocationUrl">
                                    <a href="{{ link('misc/location-info', '', {'location': $user.Profile.location}) }}" rel="nofollow noreferrer" target="_blank" class="u-concealed">{$user.Profile.location}</a>
                                <xf:else />
                                    {$user.Profile.location}
                                </xf:if>
                            </dd>
                        </dl>
                    </xf:if>
                    <xf:if is="$extras.website && $user.Profile.website">
                        <dl class="pairs pairs--justified">
                            <dt>{{ phrase('website') }}</dt>
                            <dd><a href="{$user.Profile.website}" rel="nofollow" target="_blank">{$user.Profile.website|url('host', phrase('visit_site'))}</a></dd>
                        </dl>
                    </xf:if>

Ve şu kodla değiştirin:

Kod:

 <div class="WbbWupBlock WbbWupCenterBlock">
                 <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="cyan-texti">{{ date($user.register_date) }}</h4>
             </div>
                  <div class="arrowi cyan-arrowi"></div>
                   <div class="block_hgi shadow_hgi cyan-bgi">
              <div class="cyan-textim"><i class="fas fa-registered fa-large fa-fixed-width" style="padding-right:3px;line-height: 2;font-size: 20px;"></i>
           </div>
         </div>
        </div>
                      <div class="infoxi shadow_hgi">
                        <div class="textxi">
                 <h4 class="orange-texti">{$user.message_count|number}</h4>
               </div>
                    <div class="arrowi orange-arrowi"></div>
                     <div class="block_hgi shadow_hgi orange-bgi">
                  <div class="orange-textim"><i class="fas fa-comments fa-large fa-fixed-width" style="padding-right:3px;"></i>
              </div>
            </div>
          </div>
        </div>
                <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="red-texti">{$user.trophy_points|number}</h4>
             </div>
                  <div class="arrowi red-arrowi"></div>
                   <div class="block_hgi shadow_hgi red-bgi">
              <div class="red-textim"><i class="fas fa-trophy fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>
                <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="green-texti">{$user.like_count|number}</h4>
              </div>
                  <div class="arrowi green-arrowi"></div>
                   <div class="block_hgi shadow_hgi green-bgi">
              <div class="green-textim"><i class="fas fa-thumbs-up fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>
                <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="blueviolet-texti">{$user.Profile.age}</h4>
             </div>
                  <div class="arrowi blueviolet-arrowi"></div>
                   <div class="block_hgi shadow_hgi blueviolet-bgi">
              <div class="blueviolet-textim"><i class="fas fa-user-alt fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>
            <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="fuchsia-texti" style="font-size: 13px;">{$user.Profile.location}</h4>
             </div>
                  <div class="arrowi fuchsia-arrowi"></div>
                   <div class="block_hgi shadow_hgi fuchsia-bgi">
              <div class="fuchsia-textim"><i class="fas fa-map-marker-alt fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>
                    <div class="infoxi shadow_hgi">
                      <div class="textxi">
                <h4 class="blue-texti" style="font-size: 5px;line-height: 4;">{$user.Profile.website|url('host', phrase('visit_site'))}</h4>
             </div>
                  <div class="arrowi blue-arrowi"></div>
                   <div class="block_hgi shadow_hgi blue-bgi">
              <div class="blue-textim"><i class="fas fa-link fa-large fa-fixed-width" style="padding-right:3px;"></i>
           </div>
         </div>
        </div>

Ekstra .less şablonunuzada şunu ekleyin:

Kod:

/////////Block-by-laurent68////////////
.WbbWupBlock {
  background: transparent;
}
.infoxi {
    overflow: hidden;
    margin: 5px auto;
    height: 40px;
}
.shadow_hgi {
    box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.1),1px 1px 5px 1px rgba(0,0,0,0.1);
}
.textxi {
    float: right;
    font-weight: bold;
    width: auto;
    margin-top: -5px;
}
.textxi h4 {
    margin-top: 15px;
    padding-bottom: 5px;
    border: none;
}
.arrowi {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    margin-left: 50px;
    margin-top: 10px;
}
.block_hgi {
    width: 50px;
    height: 50px;
    text-align: center;
}
.orange-texti, .red-texti, .green-texti, .cyan-texti, .blueviolet-texti, .fuchsia-texti, .blue-texti {
    font-size: 16px;
    animation: blink 1s linear;
    padding-right: 10px;
}
.orange-textim, .red-textim, .green-textim, .cyan-textim, .blueviolet-textim, .fuchsia-textim, .blue-textim {
    width: 100%;
    height: 100%;
    font-size: 20px;
    line-height: 40px;
    position: aboslute;
    float: left;
    color: #32CD32;
}
.blue-arrowi {
    border-left: 12px solid blue;
}
.blue-bgi {
    background: blue;
}
.blue-textim, .blue-texti {
    color: #5cb0c6;
}
.fuchsia-arrowi {
    border-left: 12px solid fuchsia;
}
.fuchsia-bgi {
    background: fuchsia;
}
.fuchsia-textim, .fuchsia-texti {
    color: #8117e6;
}
.blueviolet-arrowi {
    border-left: 12px solid blueviolet;
}
.blueviolet-bgi {
    background: blueviolet;
}
.blueviolet-textim, .blueviolet-texti {
    color: #d81cec;
}
.cyan-arrowi {
    border-left: 12px solid cyan;
}
.cyan-bgi {
    background: cyan;
}
.cyan-textim, .cyan-texti {
    color: #1DA1F2;
    font-size: 9px;
    line-height: 2
}
.orange-bgi {
    background: #ebb551;
}
.orange-textim, .orange-texti {
    color: #f46320;
}
.orange-arrowi {
    border-left: 12px solid #ebb551;
}
.red-arrowi {
    border-left: 12px solid #c62642;
}
.red-bgi {
    background: #c62642;
}
.red-textim, .red-texti {
    color: #7b132a;
}
.green-arrowi {
    border-left: 12px solid #008000;
}
.green-bgi {
    background: #008000;
}
.green-textim, .green-texti {
    color: #32CD32;
}
//////////fin-block///////////

SONUÇ

Ara

Ara

xenForo 2.x Mükemmel Pospit Stili

Zeki

Benzer konular

Tema özelleştirme sistemi

Gece/Gündüz modunu seç

Tam ekran yada dar ekran

Izgara yada normal mod

Forum arkaplan resimleri

Sidebar blogunu kapat/aç

Yapışkan sidebar kapat/aç

Radius aç/kapat

6.2K

19.1K

9.2K

adamsansa