Latest topics
» How To Install the Code Snippet Button
by SLGray Today at 20:56

» Select Button
by SLGray Today at 20:25

» FM Themes
by SLGray Today at 16:48

» User - Made Creations
by SLGray Today at 16:48

» The Football Forums
by Mati Today at 15:22

» [BUG] Avatar doesn't resize when reading the profile
by Samantha NL Today at 12:33

» Search Bar Options
by Samantha NL Today at 11:38

» Chit Chat Thread
by Jazeon Today at 05:42

» Christmas logo
by Teo! Today at 03:56

» SyncEditor
by keko_ferkeko Today at 00:31

» Private message bg color
by Mr.Alam Yesterday at 22:54

» Multi-step Login Form
by Samantha NL Yesterday at 12:54

» Member of the Month
by Samantha NL Yesterday at 12:38

» Forumactif Edge - Dutch Translation
by Samantha NL Yesterday at 10:49

» Widget : Staff Online
by Samantha NL Yesterday at 10:39

Recent Tutorials
Who is online?
In total there are 2 users online :: 0 Registered, 0 Hidden and 2 Guests :: 1 Bot

None

[ View the whole list ]


Most users ever online was 172 on Fri 19 Feb 2016, 05:17

Widget: Active Topics Since Last Visit

View previous topic View next topic Go down

Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 21
Posts : 4091
Points : 8396
Reputation : 2010
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Google Chrome Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Mon 11 Nov 2013, 10:30

This is just a little something I came up with while practicing. At the click of a button this widget will display a list of the active topics since your last visit. You can also toggle its display as well, by clicking the button again to hide the list of topics.


There is a limit to the amount of topics that can be displayed at once, so don't worry. To deal with a large amount of topics a scroll bar will be added after the widget exceeds 120px. If you're interested in this widget, read on to find out how to install it.

To save you time the script, css, and widget are all in one code so you can edit the entire widget in one area.

Please navigate to..
Administration Panel > Modules > Portal & Widgets > Forum widgets management > Create a new widget

Widget name: Topics Since Last Visit
Use a table type: No
Widget Title: Your choice
Widget source:
Code:
<script>
jQuery(document).ready(function(){
jQuery('#newTopics').hide();
if(!document.getElementById('logout')) {
jQuery('#loadNewestBlock').hide();}
jQuery('#showNewest').click(function() {
jQuery('#newTopics').slideToggle();
jQuery('#topicShown').load('/search?search_id=newposts a.topictitle');
 });
});
</script>
<style>
/*Topic Load Button*/
#loadNewestBlock{
text-align:center;
margin:10px;
}
#showNewest{
font-size:10px;
font-weight:bold;
color:#fff;
background-color:#257;
border-radius:5px;
padding:10px;
box-shadow:0px -10px 6px rgba(0,0,0, 0.2) inset, 0px 10px 6px rgba(255,255,255, 0.2) inset;
}
#showNewest:hover{
color:#ff8;
background-color:#368;
cursor:pointer;
}
/*Topic Titles*/
#newTopics a.topictitle{
display:block;
font-weight:normal;
padding-top:3px;
padding-left:3px;
border-bottom:1px solid #ddd;
}
#newTopics a.topictitle:hover{
text-decoration:none !important;
}
#newTopics a.topictitle:before{
content:"•";
}
/*Topic Box*/
#lastVisitTitle{
text-align:center;
font-weight:bold;
font-size:10px;
border-bottom:1px solid #ccc;
background:#257;
color:#fff;
padding:3px;
box-shadow:0px 8px 6px rgba(255,255,255, 0.2) inset;
}
#newTopics{
max-height:120px;
overflow-y:auto;
border-radius:5px;
border:1px solid #DDD;
background-color:#F3F3F3;
box-shadow: 0px 0px 0px 1px #fff inset, 0px 0px 3px 1px rgba(128, 128, 128, 0.2) inset;
}
</style><div id="loadNewestBlock"><span id="showNewest" title="Show/Hide">Load Newest Topics</span></div><div id="newTopics"><div id="lastVisitTitle">Topics Since Last Visit</div><span id="topicShown"></span></div>

When you're done save the widget, drag and drop 'Topics since last visit' onto your forum, and save the structure. When new topics are active on your forum they will be displayed when you click the button. I'll also note this has only been tested on phpbb2 and phpbb3.

If you have any questions or bugs to report please let me know. Enjoy! Smile


Notice
Tutorial written by Ange Tuteur.
Reproduction not permitted without consent from the author.


Last edited by Ange Tuteur on Tue 15 Mar 2016, 06:26; edited 1 time in total
Michael_vx

Title :
Gender : Male
Age : 24
Posts : 290
Points : 1373
Reputation : 74
Language : Arabic
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Other
Awards :
View all awards
View user profile http://miccsoft.net https://www.facebook.com/Michaelvx2008

PostMichael_vx on Fri 06 Jun 2014, 05:26

hi i like to say thanks 1st
2nd
i think im lost here a little
i put that code in widget but looks i miss something here
why ?    its only show me a button and when press show me the line topics since last visit nothing more
 confused
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 21
Posts : 4091
Points : 8396
Reputation : 2010
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Google Chrome Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Sat 07 Jun 2014, 08:56

If there are no topics displayed, then there were no new topics since your last visit. Once you log out, the topics from that session are cleared. I think I should include a message which notifies that.
Michael_vx

Title :
Gender : Male
Age : 24
Posts : 290
Points : 1373
Reputation : 74
Language : Arabic
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Other
Awards :
View all awards
View user profile http://miccsoft.net https://www.facebook.com/Michaelvx2008

PostMichael_vx on Sat 07 Jun 2014, 19:01

1st thanks i miss that there was no new topics at that time
worked 100%
i just wonder now about make it right to left not left to right if you dont mind Smile
you know right to left for Arabic forum
thanks again the Script is cool
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 21
Posts : 4091
Points : 8396
Reputation : 2010
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Google Chrome Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 11 Jun 2014, 00:34

Try adding this to your CSS :
Code:
#loadNewestBlock { text-align:right; }
Michael_vx

Title :
Gender : Male
Age : 24
Posts : 290
Points : 1373
Reputation : 74
Language : Arabic
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Other
Awards :
View all awards
View user profile http://miccsoft.net https://www.facebook.com/Michaelvx2008

PostMichael_vx on Sun 15 Jun 2014, 02:53

@Ange Tuteur wrote:Try adding this to your CSS :
Code:
#loadNewestBlock { text-align:right; }
frist sorry for late i was have little proplem with my stomich
any way
after add the CSS
Still left not right  No
any more tips ?
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 21
Posts : 4091
Points : 8396
Reputation : 2010
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Google Chrome Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Thu 19 Jun 2014, 17:43

In the CSS of the widget is this :
Code:
#loadNewestBlock{
text-align:center;
margin:10px;
}

change it to :
Code:
#loadNewestBlock{
text-align:right;
margin:10px;
}
Michael_vx

Title :
Gender : Male
Age : 24
Posts : 290
Points : 1373
Reputation : 74
Language : Arabic
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Other
Awards :
View all awards
View user profile http://miccsoft.net https://www.facebook.com/Michaelvx2008

PostMichael_vx on Sun 31 Aug 2014, 09:06

hi again sorry for late to reply i was all the past with no internet at home
any way the code didnt work
but i like to say i find the way by a luck try
in the par
Code:
    #newTopics a.topictitle{
    display:block;
font-weight:normal;
    padding-top:3px;
    padding-right:3px;
i did just add this
Code:
        text-align:right;
to be like that
Code:

    #newTopics a.topictitle{
    display:block;
        text-align:right;
font-weight:normal;
    padding-top:3px;
    padding-right:3px;

and i solved the problem thanks to your tip telling me the CSS in the widget
Grow
New Member
Title :
Gender : Unspecified
Posts : 8
Points : 767
Reputation : 2
Language : deutsch englisch
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Other
Awards :
View all awards
View user profile

PostGrow on Wed 01 Apr 2015, 12:05

I found this great widget only now and it works great! BUT when i click on a new topic it directed me everytime to the first post of a topic...
It is possible that it shows me the newest post of a topic?

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

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