PortalLatest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 09 Oct 2018, 11:34
» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28
» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15
» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11
» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24
» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58
» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50
» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22
» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12
» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10
» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51
» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11
» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19
» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34
» Numbering of messages in the topic
by SLGray Mon 04 Dec 2017, 22:40
by Ange Tuteur Tue 09 Oct 2018, 11:34
» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28
» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15
» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11
» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24
» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58
» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50
» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22
» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12
» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10
» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51
» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11
» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19
» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34
» Numbering of messages in the topic
by SLGray Mon 04 Dec 2017, 22:40
Recent Tutorials
Top posting users this month
Top Achievers
Who is online?
In total there are 4 users online :: 0 Registered, 0 Hidden and 4 Guests :: 1 Bot
None
Most users ever online was 172 on Fri 19 Feb 2016, 05:17
None
Most users ever online was 172 on Fri 19 Feb 2016, 05:17
About Last topic Widget
Page 1 of 1 • Share •
- Luffy
- Gender :
Age : 24
Posts : 291
Points : 2152
Reputation : 64
Language : Greek, English
Browser :
Forum Version : 
Luffy on Sun 15 May 2016, 07:51
Hello you can do that by following the below steps:
Go to: Admin Panel > Display > Templates > Portal > mod_recent_topics
and replace the entire template with this one:
Then go to your CSS and add this code:
That should do what you want!
Go to: Admin Panel > Display > Templates > Portal > mod_recent_topics
and replace the entire template with this one:
- Code:
<!-- BEGIN scrolling_row -->
{MARQUEE_JS_SRC}
<div class="module main">
<div class="main-head"><div class="h3">{L_RECENT_TOPICS}</div></div>
<div class="main-content" id="comments_scroll_div">
<div class="marquee" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">
<!-- BEGIN recent_topic_row -->
» <a 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 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 -->
<!-- END recent_topic_row -->
</div>
</div>
</div>
<script type="text/javascript">
$(".marquee").marquee();
</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"><div id="recent_topic_list" class="gensmall">
<!-- BEGIN recent_topic_row -->
» <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br />{BY}
<!-- BEGIN switch_poster -->
<a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
<!-- END switch_poster -->
<!-- BEGIN switch_poster_guest -->
{classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
<!-- END switch_poster_guest -->
{ON} {classical_row.recent_topic_row.S_POSTTIME}<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 />
-->
<!-- END recent_topic_row -->
</div>
</div>
<!-- END classical_row -->
Then go to your CSS and add this code:
- Code:
#recent_topic_list {height:200px;overflow-y:auto;}
#recent_topic_list::-webkit-scrollbar {width:6px;}
#recent_topic_list::-webkit-scrollbar-track {background:rgba(0, 0, 0, 0.1);}
#recent_topic_list::-webkit-scrollbar-thumb { background:#999;}
That should do what you want!
- Van-Helsing
- Gender :
Age : 44
Posts : 853
Points : 2937
Reputation : 84
Location : Somewhere out there!
Language : English, Greek
Browser :
Forum Version : 
-
Van-Helsing on Sun 15 May 2016, 08:01
Hello,
You can also embed the css in the template to reduce the css stylesheet size by adding the widget's css in the template mod_recent_topics.
You can also embed the css in the template to reduce the css stylesheet size by adding the widget's css in the template mod_recent_topics.
- Code:
<!-- BEGIN scrolling_row -->
{MARQUEE_JS_SRC}
<style>
#recent_topic_list {height:200px;overflow-y:auto;}
#recent_topic_list::-webkit-scrollbar {width:6px;}
#recent_topic_list::-webkit-scrollbar-track {background:rgba(0, 0, 0, 0.1);}
#recent_topic_list::-webkit-scrollbar-thumb { background:#999;}
</style>
<div class="module main">
<div class="main-head"><div class="h3">{L_RECENT_TOPICS}</div></div>
<div class="main-content" id="comments_scroll_div">
<div class="marquee" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">
<!-- BEGIN recent_topic_row -->
» <a 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 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 -->
<!-- END recent_topic_row -->
</div>
</div>
</div>
<script type="text/javascript">
$(".marquee").marquee();
</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"><div id="recent_topic_list" class="gensmall">
<!-- BEGIN recent_topic_row -->
» <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br />{BY}
<!-- BEGIN switch_poster -->
<a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
<!-- END switch_poster -->
<!-- BEGIN switch_poster_guest -->
{classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
<!-- END switch_poster_guest -->
{ON} {classical_row.recent_topic_row.S_POSTTIME}<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 />
-->
<!-- END recent_topic_row -->
</div>
</div>
<!-- END classical_row -->
- Ange Tuteur
Administrator - Gender :
Age : 23
Posts : 4736
Points : 10094
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser :
Forum Version : 
-
Ange Tuteur on Sun 15 May 2016, 12:01
I suppose I could always make a simple tutorial about it, but the codes posted above should work for you. 
Personally, I prefer the scroll bar over the auto-scrolling, because the auto-scrolling annoys the you-know-what out of me, as I have no control over the topics shown to me other than stopping them on mouse over. It's why I changed the widget on the support forum..
Personally, I prefer the scroll bar over the auto-scrolling, because the auto-scrolling annoys the you-know-what out of me, as I have no control over the topics shown to me other than stopping them on mouse over. It's why I changed the widget on the support forum..
- Van-Helsing
- Gender :
Age : 44
Posts : 853
Points : 2937
Reputation : 84
Location : Somewhere out there!
Language : English, Greek
Browser : Forum Version : -
- Van-Helsing
- Gender :
Age : 44
Posts : 853
Points : 2937
Reputation : 84
Location : Somewhere out there!
Language : English, Greek
Browser : Forum Version : -
Van-Helsing on Fri 20 May 2016, 08:37
Hello,
Replace the template mod_recent_topics with the following code:
Then save and publish your template. I just removed some double < br / > codes.
Replace the template mod_recent_topics with the following code:
- Code:
<!-- BEGIN scrolling_row -->
{MARQUEE_JS_SRC}
<style>
#recent_topic_list {height:200px;overflow-y:auto;}
#recent_topic_list::-webkit-scrollbar {width:6px;}
#recent_topic_list::-webkit-scrollbar-track {background:rgba(0, 0, 0, 0.1);}
#recent_topic_list::-webkit-scrollbar-thumb { background:#999;}
</style>
<div class="module main">
<div class="main-head"><div class="h3">{L_RECENT_TOPICS}</div></div>
<div class="main-content" id="comments_scroll_div">
<div class="marquee" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">
<!-- BEGIN recent_topic_row -->
<br/><a 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 href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br />
<!-- END switch_poster -->
<!-- BEGIN switch_poster_guest -->
{scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br />
<!-- END switch_poster_guest -->
<!-- END recent_topic_row -->
</div>
</div>
</div>
<script type="text/javascript">
$(".marquee").marquee();
</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"><div id="recent_topic_list" class="gensmall">
<!-- BEGIN recent_topic_row -->
» <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br />{BY}
<!-- BEGIN switch_poster -->
<a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
<!-- END switch_poster -->
<!-- BEGIN switch_poster_guest -->
{classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
<!-- END switch_poster_guest -->
{ON} {classical_row.recent_topic_row.S_POSTTIME}<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 />
-->
<!-- END recent_topic_row -->
</div>
</div>
<!-- END classical_row -->
Then save and publish your template. I just removed some double < br / > codes.
- Guest
Guest
Guest on Tue 23 Aug 2016, 17:49
*** This topic will be closed soon if we don't get any feedback. @omarpop23 Is this solved / still needed? ***
- omarpop23
- Gender :
Age : 24
Posts : 140
Points : 1349
Reputation : 24
Location : Egypt
Language : Arabic , English
Browser : Forum Version : -
omarpop23 on Wed 24 Aug 2016, 13:50
make topic solved.
sorry for late i was very busy
i add a css code and now it worked well
i make postion: relative; of #recent_topics_classical
sorry for late i was very busy
i add a css code and now it worked well
i make postion: relative; of #recent_topics_classical
- GuestGuest
Guest on Wed 24 Aug 2016, 13:52
*** Topic solved, locked and archived ***
- Sponsored content
Sponsored content
Create an account or log in to leave a reply
You need to be a member in order to leave a reply.
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum|
|
|