[Hỏi đáp] Thêm 4 button: tường nhà, bạn bè, bài viết, chặn vào mục thông tin người viết

avatar

Kou94109
157
8
Punbb
An toàn
Oppai daisuki~
Thành viên thân thiết
Thành viên thân thiết

Bài viết :
109
Points :
157
Like :
8
Punbb
An toàn
Oppai daisuki~
Hiện tại mình muốn thêm 4 button: tường nhà, bạn bè, bài viết, chặn vào mục thông tin người viết như của phutu.vn

DEMO:

Rất mong bạn nào biết phần này có thể hỗ trợ giúp mình Very Happy tk vì đã ghé thăm topic
 Trả lời bài viết
avatar

Giựt238
388
80
Punbb
Cẩn thận
Éo có đối thủ
Thành viên thân thiết
Thành viên thân thiết

Bài viết :
238
Points :
388
Like :
80
Punbb
Cẩn thận
Éo có đối thủ
Demo :



Code:
http://blogitforum.forumvi.com/t1-topic?tt=1

Cách làm :

Vào viewtopic tìm đoạn sau :

Code:
{postrow.displayed.POSTER_AVATAR}

Thay đoạn trên thành :

Code:
<span class="ava_pt"><span><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td align="center">{postrow.displayed.POSTER_AVATAR}</td></tr></tbody></table></span></span>
<div class="profile">
  <div class="poster-info" style="display:none">
    <div>
      <span class="poster-name">                            
                                {postrow.displayed.POSTER_NAME}                          
                    </span>
      <span class="poster-connect">                            
                                {postrow.displayed.ONLINE_IMG}
                    </span>
      <span class="poster-rank">
                                {postrow.displayed.RANK_IMAGE}        
                    </span>
    </div>
  </div>
  <div style="height:40px;width:100%;overflow:hidden" class="poster-field">
    <!-- BEGIN profile_field -->
    <p>{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}</p>
    <!-- END profile_field -->
  </div><span class="profile11"> <div class="zzPoster-name" style="display:none">
                          </div> <span class="poster-link"><a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">Tường</a>                          
      <a target="_blank" href="/spa/[POSTER_NAME]">Bài viết</a>                          
      <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Kết bạn</a>              
      <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Chặn</a>                        
      </span> </span><span style="background-image: url(http://i.imgur.com/U09NXkO.png);background-repeat:no-repeat;width:21px;height:11px;display:inline-block;float:left;margin-bottom:-7px;margin-top:7px"></span></div>

Thêm vào cuối view_topic code :

Code:
<script type="text/javascript">
        $(".poster-info .label:contains('Status')").parent().addClass("status");
        $(".poster-link a").attr("href", function () {
          return this.href.replace("[POSTER_NAME]", encodeURI($(this).closest(".poster-info").find(".poster-name strong").text()));
        });
        </script>

Vào css thêm :

Code:
/*Drop-rip by Giựt*/
.profile {
    width: 290px;
    height: 97px;
    position: absolute;
    margin-left: -1px;
    background: url(http://i.imgur.com/IdTTHEE.png);
    border: 1px solid rgb(189, 190, 189);
    margin-top: -200px;
    z-index: 1;
    text-align: left;
    padding: 5px 10px 0px 20px;
    box-shadow: 0 0 2px rgb(231, 231, 231);
    display: none;
}
.profile span {
  font-weight: bold
}

.profile div {
  width: 135px;
  display: inline-block;
  color: #31414a;
  font: 11px Tahoma;
  margin: 2px 0px
}

.pun .profile .label {
  display: inline-block;
  width: 75px;
}

.profile div:nth-of-type(5) {
  display: none
}

.profile11 {
  width: 300px;
  display: inline-block;
  float: right;
  margin-top: 15px;
  padding-top: 5px;
  border-top: 1px dashed #d4d4d4
}

.poster-link a {
  float: left;
  display: inline-block;
  margin-right: 2px;
  font: bold 12px Arial;
  padding: 5px 5px 5px 25px;
  background-repeat: no-repeat;
  background-position: 5px center
}
.poster-field p{line-height:20px;color:#999;width:160px;display:inline-block}
.poster-link a:hover {
  background-color: rgb(239, 239, 247)
}

.poster-link a:nth-of-type(1) {
  background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/profil10.png)
}

.poster-link a:nth-of-type(2) {
  background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/total_10.gif)
}

.poster-link a:nth-of-type(3) {
  background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/friend10.png)
}

.poster-link a:nth-of-type(4) {
  background-image: url(http://i57.servimg.com/u/f57/17/05/17/70/button10.png)
}

.profile:hover,
.ava_pt:hover+.profile {
  display: inline-block!Important
}

Hiện tại mình chỉ rip cho phiên bản punbb Smile còn các phiên bản kia mình chưa test :)
 Trả lời bài viết
avatar

Kou94109
157
8
Punbb
An toàn
Oppai daisuki~
Thành viên thân thiết
Thành viên thân thiết

Bài viết :
109
Points :
157
Like :
8
Punbb
An toàn
Oppai daisuki~
Nếu mình chỉ cần 4 nút đó thôi thì lấy đoạn
Code:
<span class="poster-link"><a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">Tường</a>                         
      <a target="_blank" href="/spa/[POSTER_NAME]">Bài viết</a>                         
      <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Kết bạn</a>             
      <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Chặn</a>                       
      </span> </span><span style="background-image: url(http://i.imgur.com/U09NXkO.png);background-repeat:no-repeat;width:21px;height:11px;display:inline-block;float:left;margin-bottom:-7px;margin-top:7px"></span>

Với cái js chèn cuối viewtopic đúng ko nhỉ?
 Trả lời bài viết
avatar

Giựt238
388
80
Punbb
Cẩn thận
Éo có đối thủ
Thành viên thân thiết
Thành viên thân thiết

Bài viết :
238
Points :
388
Like :
80
Punbb
Cẩn thận
Éo có đối thủ
@Kou94 đã viết:Nếu mình chỉ cần 4 nút đó thôi thì lấy đoạn
Code:
<span class="poster-link"><a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">Tường</a>                          
      <a target="_blank" href="/spa/[POSTER_NAME]">Bài viết</a>                          
      <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Kết bạn</a>              
      <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Chặn</a>                        
      </span> </span><span style="background-image: url(http://i.imgur.com/U09NXkO.png);background-repeat:no-repeat;width:21px;height:11px;display:inline-block;float:left;margin-bottom:-7px;margin-top:7px"></span>

Với cái js chèn cuối viewtopic đúng ko nhỉ?

Bạn lấy đoạn :
Code:
<span class="poster-link"><a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">Tường</a>                          
      <a target="_blank" href="/spa/[POSTER_NAME]">Bài viết</a>                          
      <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Kết bạn</a>              
      <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">Chặn</a>                        
      </span> </span>

Và thêm đoạn js chèn cuối viewtopic :)
 Trả lời bài viết
avatar

Kou94109
157
8
Punbb
An toàn
Oppai daisuki~
Thành viên thân thiết
Thành viên thân thiết

Bài viết :
109
Points :
157
Like :
8
Punbb
An toàn
Oppai daisuki~
Cảm ơn vì đã giúp đỡ ^^
 Trả lời bài viết
Điểm 4.6/5 dựa vào 87 đánh giá

Có Thể Bạn Quan Tâm

Đang tải...