[HowTo] Make your boards highlight with onMouseOver (template) hack

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Floris
    Senior Member
    • Dec 2001
    • 37767

    [HowTo] Make your boards highlight with onMouseOver (template) hack

    Support for this particular thread has been dropped by me. I have created a new thread which you can find here

    You can still use this template mod for it works as a stand alone.

    [HowTo] Make your boards highlight with onMouseOver (template) hack

    What does this one do?
    On the index page of your forum, the boards are listed (below each category) and now when you move your mouse over a board, it highlights, giving a very cool effect!

    Why did you make it?
    Because I wanted to
    When I just got the forum, I searched other forums too, and found a few of them applied this hack; and they just looked the coolest! So I wanted it to I contacted smoothie from macfora.com and he provided me with the hints. Since I have applied it on my board, I have been getting E-mails and private messages from users requesting how I have done it.. well: here it is

    The Code
    Walkthrough
    • Goto the Admin Control Panel and login as an administrator
    • From the left menu, browse down to the "Template"-section and select 'Modify'
    • Click on 'Expand' and browse down to the "Forum Home Page Templates" and click 'Expand' again
    • Click on 'edit' from "forumhome_forumbit_level2_post"
    • Search for this line:
      Code:
      <td bgcolor="{[i][/i]firstaltcolor}" align="left">
    • And replace that with:
      Code:
      <td bgcolor="{[i][/i]firstaltcolor}" align="left"
      onMouseOver="this.style.backgroundColor='{[i][/i]secondaltcolor}'; 
      this.style.cursor='hand';" 
      onMouseOut="this.style.backgroundColor='{[i][/i]firstaltcolor}';" 
      onClick="window.location.href='forumdisplay.php?s=$session[sessionhash]&forumid=$forum[forumid]'">
    • Click on 'Save'


    [UPDATE]
    As requested by many, both through PM system, E-mail and this thread: Here the code to also highlight the threads list page and the announcements (if any) on top. All template hacks! No code-hacking required (woot)

    Goto the Admin Control Panel,
    find the template: forumdisplaybit and from it find:
    Code:
    <td bgcolor="{[I][/I]firstaltcolor}" align="left" width="70%">
    and replace that with:
    Code:
    <td bgcolor="{[I][/I]firstaltcolor}" align="left" width="70%" onMouseOver="this.style.backgroundColor='{[I][/I]secondaltcolor}'; this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='{[I][/I]firstaltcolor}';" onClick="window.location.href='showthread.php?s=$session[sessionhash]&threadid=$thread[threadid]'">
    then save the template.

    Note, this doesn't highlight announcements. (which are different template)

    To also highlight the annoucements with onmouseover, find the template forumdisplay_announcement and in it find:
    Code:
    <td bgcolor="{[I][/I]firstaltcolor}" align="left">
    and replace that with:
    Code:
    <td bgcolor="{[I][/I]firstaltcolor}" align="left"  onMouseOver="this.style.backgroundColor='{[I][/I]secondaltcolor}'; this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='{[I][/I]firstaltcolor}';" onClick="window.location.href='announcement.php?s=$session[sessionhash]&forumid=$foruminfo[forumid]'">
    Version?
    Tested with vBulletin 2.2.5 and works just great


    The Result
    You can goto creations.nl and see how it looks!
    Last edited by Floris; Tue 11 Jun '02, 4:24pm.
  • tomk
    Member
    • Jan 2002
    • 59

    #2
    Worked great!

    Worked just fine!

    Thanks!
    TomK

    Comment

    • Floris
      Senior Member
      • Dec 2001
      • 37767

      #3
      Re: Worked great!

      Originally posted by tomk
      Worked just fine!

      Thanks!
      TomK
      I am happy to hear that.
      I just visited your web site, and I saw that it looks great. Nice Mac-theme!

      Uhm, I also saw that you have used my avatar. I can not remember you asking permission for that. Please remove it from your board. It is my personal avatar, and I rather not see anybody else use it. Sorry!

      Comment

      • tomk
        Member
        • Jan 2002
        • 59

        #4
        Done

        OK, changed, but I've seen it around on a few other boards, so not sure how original it is.

        The 'mac' theme is from snyx, all the credit is his. I've just made a few minor template changes.

        TomK

        Comment

        • Floris
          Senior Member
          • Dec 2001
          • 37767

          #5
          Re: Done

          Originally posted by tomk
          OK, changed, but I've seen it around on a few other boards, so not sure how original it is.

          The 'mac' theme is from snyx, all the credit is his. I've just made a few minor template changes.

          TomK
          Feel free to inform me on which boards you have seen my avatar.

          Yeah, I saw the theme on other boards too, it is open for public. I just registered on your forum, and it looks great!

          Comment

          • JTMON
            Senior Member
            • Oct 2001
            • 571

            #6
            This works great but can you tell me how to have it actually let you click inside the cell to goto the link, please please
            JTMON

            Comment

            • Floris
              Senior Member
              • Dec 2001
              • 37767

              #7


              Originally posted by JTMON
              This works great but can you tell me how to have it actually let you click inside the cell to goto the link, please please
              Thank you, and I am happy that it works for you.
              Maybe I do not understand you, but .. the table cell of the board is already clickable ..

              Code:
              onClick="window.location.href='forumdisplay.php?s=$session[sessionhash]&forumid=$forum[forumid]'"
              This is the same link as the text-link of the board, making it clickable. .. works on my site Uhm, I just surfed to your site, and it actually doesn't work .. but I also noticed that you have applied some code-hacks. So maybe the php page or the template has been altered, preventing it to process the javascript onClick event properly?
              Last edited by Floris; Fri 1 Feb '02, 11:16am.

              Comment

              • JTMON
                Senior Member
                • Oct 2001
                • 571

                #8
                Well I thought it was some Script code I had for a hack that does essentially the same thing, now that I have removed that and the only changes to that template are yours, the mouseover doesn't work. I'm stumped
                JTMON

                Comment

                • JTMON
                  Senior Member
                  • Oct 2001
                  • 571

                  #9
                  Well it WAS that other script, I had left some in another template. Well it works for Forumhome but inside the forum sections it links to an invalid thread it says, when I check the link it links to just forumdisplay.php?s. I should say that I tried the same code in the forumdisplaybit template
                  Last edited by JTMON; Fri 1 Feb '02, 1:18pm.
                  JTMON

                  Comment

                  • Floris
                    Senior Member
                    • Dec 2001
                    • 37767

                    #10
                    boy oh boy

                    Originally posted by JTMON
                    Well it WAS that other script, I had left some in another template. Well it works for Forumhome but inside the forum sections it links to an invalid thread it says, when I check the link it links to just forumdisplay.php?s. I should say that I tried the same code in the forumdisplaybit template
                    Hehe, nice to hear, I didn't make an error and that it was the other script.

                    Hey! I never said this would work on the other pages, but the forum's homepage. The other pages have different links. Check their template for the text link and add the correct link to the onClick part (replacing the one that gives the incorrect url).

                    Comment

                    • Mr. X
                      Senior Member
                      • May 2001
                      • 1112
                      • 2.3.0

                      #11
                      excellent. I've been wanting to do this for a while. Very easy to do. Just gotta figure how to do it on the thread index too.
                      website: joe.pcfx.cc
                      forums: pcfx.cc
                      gallery: here

                      Comment

                      • JTMON
                        Senior Member
                        • Oct 2001
                        • 571

                        #12
                        DOH, I don't know why I thought it should link to the same file. I have it working on both. Here's the way to get it to work inside on the threadlist.

                        Edit ForumDisplayBit Template.

                        Find:
                        Code:
                        <td bgcolor="#F1F1F1" align="left" width="70%">
                        Now use Xiphoid's Same code but change the last line to:
                        Code:
                        onClick="window.location.href='showthread.php?s=$session[sessionhash]&threadid=$thread[threadid]'">
                        NOTE-#F1F1F1 would be { firstaltcolor } in your template
                        Thanks Xiphoid!
                        Last edited by JTMON; Fri 1 Feb '02, 3:13pm.
                        JTMON

                        Comment

                        • Floris
                          Senior Member
                          • Dec 2001
                          • 37767

                          #13
                          No problem,
                          and thank you for posting the other page's code, I think others would like that

                          Comment

                          • X-Fan
                            Senior Member
                            • Jan 2002
                            • 122
                            • 3.0.7

                            #14
                            Great temp hack xiphoid, thanks! Works perfectly on my board:



                            Quick question though - is there anyway to stop the clicked link loading up in the original window if the user shift-clicked to open in a new window?

                            Cheers,
                            Last edited by X-Fan; Sat 2 Feb '02, 9:48pm.
                            Eric J. Moreels
                            ComiX-Fan Owner/Administrator
                            e-mail: [email protected]
                            Web: http://www.comixfan.com/xfan/

                            Comment

                            • Floris
                              Senior Member
                              • Dec 2001
                              • 37767

                              #15
                              Originally posted by X-Fan
                              Great temp hack xiphoid, thanks! Works perfectly on my board:



                              Quick question though - is there anyway to stop the clicked link loading up in the original window if the user shift-clicked to open in a new window?

                              Cheers,
                              Uhm, never knew that would happen

                              But no, I have no idea. Maybe you can stop this if the code gets put in a function between <head></head> and called when needed. I just think that would be overkill.. and I personally dislike users opening more windows to browse my site but that is just me.

                              I am happy to hear that you like the template hack

                              Comment

                              widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
                              Working...