Coding-Spot

You are not connected. Please login or register

Coding-Spot » Support Category » Javascript Support » JS Support Archives

Go to page : 1, 2  Next

 
 
 

How Do I Put Small Avatar Besides Recent Topics? (PunBB)

Started by -

Message (Page 1 of 2)

#1

refresh101

refresh101
 
Advance Member

Posted May 26th 2013, 3:53 pm

 
Title Says It All :)

Not Work For Me Because It Only Works For PhPBB3


Thanks In Advance :)





#2

Mark

Mark
 
Administrator
Administrator

Posted May 26th 2013, 4:01 pm

 
What do you mean? You've already worked it on PunBB, on your forum.



https://coding-spot.darkbb.com


#3

refresh101

refresh101
 
Advance Member

Posted May 26th 2013, 4:07 pm

 
I Want The Recent Post Will Have Avatar Besides Recent Post Topics :)

Like AvacWeb
But I Failed Its Not Working





#4

tommycoo

tommycoo
 
CS Staff
CS Staff

Posted May 26th 2013, 5:05 pm

 
Look here for all version http://www.avacweb.com/t1239-small-avatar-on-current-topics-invision#12395



http://atlanta.forumid.net/


#5

refresh101

refresh101
 
Advance Member

Posted May 26th 2013, 5:10 pm

 
That One Doesnt WOrk :(





#6

refresh101

refresh101
 
Advance Member

Posted May 27th 2013, 6:15 pm

 
Its 6:14 So Time To BUMP :)

Bump Anyone Help?





#7

Mark

Mark
 
Administrator
Administrator

Posted May 31st 2013, 6:00 am

 
Go to ACP > Display > Templates > Portal > mod_recent_topics:
- Delete all the codes and replace it with this one:
Code:
<!-- BEGIN scrolling_row -->
<div class="module main">
  <div class="main-head"><div class="h3">{L_RECENT_TOPICS}</div></div>
  <div class="main-content" id="comments_scroll_div">
      <!-- BEGIN recent_topic_row -->
          <div class="avt_recent">
              <div class="recent_space">
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TOPIC_TITLE}</a><br />
          <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}

      <!-- BEGIN switch_poster -->
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br /><br />
      <!-- END switch_poster -->

      <!-- BEGIN switch_poster_guest -->
      {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br /><br />
      <!-- END switch_poster_guest -->

      <!--
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_POSTER}">{scrolling_row.recent_topic_row.S_POSTER}</a><br /><br />
      -->
            </div>
          </div>
      <!-- END recent_topic_row -->
  </div>
</div>

<script type="text/javascript">
//<![CDATA[
$(function(){
  div_marquee('comments_scroll_div', 'comments_scroll_container', '{SCROLL_WAY}', '{SCROLL_STEP}', '{SCROLL_DELAY}', '{SCROLL_HEIGHT}');
});
//]]>
</script>
<!-- END scrolling_row -->

<!-- BEGIN classical_row -->
<div class="module main">
  <div class="main-head"><h3>{L_RECENT_TOPICS}</h3></div>
  <div class="main-content">
      <!-- BEGIN recent_topic_row -->
          <div class="avt_recent">
              <div class="recent_space">
                <a href="{classical_row.recent_topic_row.U_TITLE}" class="bottooom"><font style="font-size: 11px;">{classical_row.recent_topic_row.L_TITLE}</font></a><br />
      <!-- BEGIN switch_poster -->
                <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}"><font style="font-size: 11px;">{classical_row.recent_topic_row.switch_poster.S_POSTER}</font></a>
      <!-- END switch_poster -->
      <!-- BEGIN switch_poster_guest -->
      {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
      <!-- END switch_poster_guest -->

                {ON} <font style="font-size: 11px;" class="bottooom">- {classical_row.recent_topic_row.S_POSTTIME}</font><br /><br />
      <!--
      <a href="{classical_row.recent_topic_row.U_POSTER}">{classical_row.recent_topic_row.S_POSTER}</a> {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />
        -->
            </div>
          </div><br/>
    <!-- END recent_topic_row -->
  </div>
</div>
<!-- END classical_row -->

Now add this to your CSS:
Code:
.recent_space {
border-bottom: 1px solid #F3F3F3;
margin: -5px;
}
.avt-r {
float: left;
}
.avt-r img {
width: 30px;
height: 30px;
margin: 3px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.avt-r img:hover {
border-color: #a1a1a1;
-webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
}

Javascript: (All page)
Code:
jQuery(document).on('ready', function() {
jQuery('.avt_recent').prepend('<div class="avt-r"><div>');
jQuery('.avt_recent .avt-r').each(function () {
var profileUserURL = jQuery(this).parent().children('.recent_space').children('a:last').attr('href');
jQuery(this).html('<a href="' + profileUserURL + '" class="avt-r-enlace"><img src="http://r19.imgfast.net/users/1914/10/10/84/avatars/1-97.png" alt="No Avatar" /></a>');
jQuery(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
});
});



https://coding-spot.darkbb.com


#8

Nathan Adhitya

avatar
 
Advance Member

Posted May 31st 2013, 1:08 pm

 
won't work for me D:





#9

Mark

Mark
 
Administrator
Administrator

Posted May 31st 2013, 1:19 pm

 
Make sure Advance Profile is on.
Go to ACP > User and Groups > Users > Profiles > General Options:
- Activate advanced profile: (Set to Yes)



https://coding-spot.darkbb.com


#10

Nathan Adhitya

avatar
 
Advance Member

Posted May 31st 2013, 8:27 pm

 
so first..
i already did what you did sayed
at the first
the avatar comes
then instantly disappeared...
it's weird...





#11

Mark

Mark
 
Administrator
Administrator

Posted May 31st 2013, 8:39 pm

 
Should work now. Try refreshing the page again.
Might cause by too much request from fm server. Happy



https://coding-spot.darkbb.com


#12

Nathan Adhitya

avatar
 
Advance Member

Posted May 31st 2013, 8:56 pm

 
still won't work
even i tried to add the width + height manually...





#13

Mark

Mark
 
Administrator
Administrator

Posted May 31st 2013, 9:42 pm

 
Can you provide me your forum url? Thanks. Smile



https://coding-spot.darkbb.com


#14

Nathan Adhitya

avatar
 
Advance Member

Posted May 31st 2013, 9:51 pm

 
http://nathancoding.forumotion.com/
EDIT : it instantly disappears after the page fully loaded...





#15

Mark

Mark
 
Administrator
Administrator

Posted May 31st 2013, 9:59 pm

 
Yeah. Can you upload your own avatar, then check.



https://coding-spot.darkbb.com


#16

Sponsored content


 

Posted

 





Message (Page 1 of 2)

Permissions in this forum:
You cannot reply to topics in this forum

In total there is 0 user online :: 0 Registered, 0 Hidden and 0 Guests

Users browsing this forum: None