Announcement

Collapse
No announcement yet.

[tip] Top 10 custom vB codes !

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • #31
    Is there a reason to use:

    HTML Code:
    <span title="{option}">{param}</span>
    instead of the way I did it?:

    HTML Code:
    [color=#008000]<a title=[color=#0000ff]"{option}"[/color][color=#008000]>[/color][color=#800080]<img src={param}>[/color][color=#008000]</a>[/color]
    [/color]
    Your way requires the use of [img] tags around the image url and my way (which came from you too ) doesn't which is arguably easier.
    The Admin Zone - Resources for Forum Administrators
    Articles - Forum Review
    Interviews:
    KierScottJerryAndreasSteveWayneJakeFlorisLogicianErwin
    Paul M

    Comment


    • #32
      Yeah, there is a good reason for it. This way you can put it around anything, not just an image (ie. image, text, etc.).

      That's the only reason though. If you don't want people to be able to add a Title to a bit of text, your method would work too. However, what you have there (the <a title=""> with the <img>) would make it a hyperlink, so if you only want to do an image with a title="" effect, just remove the <a> tags entirely and put the title="" inside the <img> tag

      Comment


      • #33
        Since it was not possible to put this in a seperate thread, I'll guess I post it here (I guess it could also be posted at vbulletin.org, but since it doesn't need hacks and works with all styles, I thought it would also be suitable here).

        I've created a slightly different type of spoiler tag. Instead of requiring you to hightlight the text, you click a small button to show the contents. The advantage of this tag is that it works with all styles and may include anything, including images, links etc!

        Usage:
        [spoiler=episode 2]he gets killed![/spoiler]

        HTML Code:
        <div style="margin:20px; margin-top:5px">
        <div class="smallfont" style="margin-bottom:2px"><b>Spoiler</b> for <i>{option}</i>: <input type="button" value="Show" style="width:45px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';		this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }">
        </div>
        <div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;">
        <div style="display: none;">
        {param}
        </div>
        </div>
        </div>
        The bbcode should be easy to modify if you don't want to use a {option} to show what the spoiler is for (or use both, as I do on my forum). It has been tested to work in all the latest browsers (IE 6, Mozilla 1.4, Opera 7.2, Safari 1.2).

        Now I'm not quite sure if this is allowed (so if it isn't, mods please delete this part) -- for an example of how it works, see this thread on my own forum (again my apologies if I'm breaking any rules here by posting this).
        Last edited by GHDpro; Wed 24th Mar '04, 9:47am.

        Comment


        • #34
          GHDpro - thanks for the contribution. I am now using it on my forums. =)
          Plan, Do, Check, Act!

          Comment


          • #35
            Bug detected! My forum members pointed out that the spoiler tag was breaking the
            "Preview Post" feature when replying. The cause of this was the < form > HTML tags
            I put in my spoiler tag.

            The reason I put them in there was because I thought that Netscape would otherwise
            ignore the buttons (as they're < input > HTML tags). But in any of the browsers I've tried
            this is not the case -- it's fine to keep the < form > tags out of the spoiler tag code.

            I've modified my post above to reflect this change. If you've already used the bbcode on
            your forum, simply remove the < form > and < /form > tags from the code.

            Edit: And today I finally upgraded to "Gold" and found yet another bug.
            Seems like vBulletin likes to #[email protected] with Javascript that is output by bbcodes.
            vB Team: please put the "anti-hacking" code BEFORE parsing the bbcodes please?

            Anyway, fortunately my script will work even without a specific javascript:
            directive on the "OnClick=" part. So I've fixed the tag again, and seems to be working
            again for me. To fix your forum, just do the same -- remove the "javascript:" part.
            Last edited by GHDpro; Wed 24th Mar '04, 9:50am.

            Comment


            • #36
              Introducing 'Named Anchors' to your VB

              Lumina,

              What about the ones I came up with today?! :

              See http://www.vbulletin.com/forum/showthread.php?t=99823 :

              ---------------------------------------------------------------

              Hi,

              I am curious how it works when I want to link to a named anchor inside a posting.

              I will give you an example:

              -----------------------------------------------------
              Thread 'Marsupilami FAQ'
              ----------------------
              Posting 1


              Hi, welcome to the 'Marsupilami' FAQ!


              Click through the following chapters to learn more about the Marsupilami:


              Chapter 1 : Who or what is the Marsupilami?
              Chapter 2 : What does he eat?
              Chapter 3 : How does he eat it?
              Chapter 4 : Why does he eat it?
              Chapter 5 : Why does he not throw it away then?

              ----------------------
              Posting 2

              Chapter 1 : Who or what is the Marsupilami?


              Hi, welcome to Chapter 1 : Who or what is the Marsupilami?

              Yes... you always wondered about the Marsupilami. Well... he's the story....blah-blah-blah.....



              Chapter 2 : What does he eat?


              Yes.... you tell me about it!


              Blah-blah-blah....
              ----------------------

              I want to achieve this : clicking on Chapter 1 : Who or what is the Marsupilami? in Posting 1 will transfer the user to this Chapter inside Posting 2. Yes... I know how to link to an individual posting but I do not want that... I want to link to different anchors in the same posting.

              I guess this is fairly simple to achieve, but I could not find out how to do it in VB3...

              Anyone?

              ---------------------------------------------------------------


              Originally posted by Wayne Luke
              You would need to enable HTML for this and by default each link will still open a new window unless you edit the code.
              Are you serious??!! The amazing thing is that seconds ago I found the solution by MYSELF! Yesssss.... learning day by day!

              I just thought.... what about 'Custom BBCode'? So knowing a little bit of basic HTML I tried to create 2 new BBCodes. This is what I came up with:

              Link to anchor
              -------------------------------------------------------------------
              Title : Link to anchor
              Tag : link_to_anchor
              Replacement : <a href="#{option}">{param}</a>
              Example : [link_to_anchor=Chapter1]Link to Chapter1[/link_to_anchor]

              And......

              Set anchor
              -------------------------------------------------------------------
              Title : Set anchor
              Tag : Set_anchor
              Replacement : <a name="{option}">{param}</a>
              Example : [set_anchor=Chapter1]This IS Chapter1[/set_anchor]

              And......

              IT WORKS!!!!! YAHOOOO!!!! I AM SO HAPPY!!!
              ---------------------------------------------------------------

              FANTASTIC. I feel so happy.... I am amazed to have achieved it by myself!

              The thing is....I need a supporting website for my forums. I need a website that integrates with the forums. I need a CMS for that task. Since the VB CMS hasn't been released yet I have to find alternative ways to present my members with structured information. So I decided to use my existing forums as a 'CMS'. :

              In all the 'main' forums I put a sticky thread in and called it '<main forumtopic> FAQ'. So all the main forums got a FAQ in it. I just wanted to find a way to make this FAQ thread more structered and useable for my members.

              Introducing those ANCHOR-tags makes it all much more userfriendly, because now I can make my FAQ TOC (table of contents / index) linkable!!! YEAH!
              ---------------------------------------------------------------

              How much do you love XenForo?

              Comment


              • #37
                Originally posted by GHDpro
                Usage:
                [spoiler=episode 2]he gets killed![/spoiler]

                HTML Code:
                <div style="margin:20px; margin-top:5px">
                 <div class="smallfont" style="margin-bottom:2px"><b>Spoiler</b> for <i>{option}</i>: <input type="button" value="Show" style="width:45px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';		this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }">
                 </div>
                 <div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;">
                 <div style="display: none;">
                 {param}
                 </div>
                 </div>
                 </div>
                Where do I put this code to get it to work?
                **********************************
                Golden Age Mysteries Forum
                - for fans of mysteries in the classic tradition.
                **********************************

                Comment


                • #38
                  You need to go into the admin panel and create a new bbcode. If your using vb3 its one of the options on teh sidepanel. When you create a new one, you'll see where to post it.
                  Plan, Do, Check, Act!

                  Comment


                  • #39
                    [BB Code] [3.0.0] [fieldset]boo[/fieldset]

                    Comment


                    • #40
                      GHDpro, thanks for the best spoiler implementation I've seen yet. My users love it, and are hunting for excuses to use it.

                      One issue that was reported, however: MacOS Internet Explorer 5.2.2 doesn't work, but Safari does. Known issue? (I'm not sure what the latest MSIE version is on the Mac.)

                      Thanks!

                      Comment


                      • #41
                        ryanozawa:
                        Don't think I had tested it in IE 5 for Mac yet, but I have now -- on my Mac
                        running Internet Explorer 5.2.3 under Mac OS X 10.3.3, I can't see any problems.
                        It seems to work fine. Also it's possible the tag may also break in all kinds of other
                        older browsers, due to the level of Javascript and DOM used.

                        IMHO, if you're using a Mac, just use Safari or FireFox. Or perhaps Netscape 7.0
                        if you're still running Mac OS 9 (since Netscape 7 is based on Mozilla, it should
                        work in theory).

                        ( latest version of IE 5 for Mac can be found here: http://www.microsoft.com/mac/ )

                        Comment


                        • #42
                          Thanks for checking into this. I'm not sure what's up. The IE 5.2.2 user says the button does expand the spoiler box, but that the text just isn't visible. But another Mac OSX 10.3 user on the latest IE version also says it doesn't work.

                          I'm wondering if an edit I made is the problem. I tweaked your code to not use/require the [spoiler=value] thing... just going [spoiler][/spoiler] in the expectation that the poster would explain what the spoiler is. In case I'm a lousy coder, could you perhaps post a version of your code without the {value} switch?

                          Comment


                          • #43
                            Originally posted by Lumina
                            But if you really want a tag for it :
                            • [swf]
                              <embed src="{param}" width="200" height="30" type="application/x-shockwave-flash"></embed>


                            Actually, I doubt the embed tag will work for all browsers. You might have to use the object tag as well to make it cross browser compatible. I believe the embed tag was created by netscape for gecko browsers.
                            <@Bane>Go on baby, be kinky and talk to me in PHP.

                            I recommend MBSHost to all my clients
                            PHP scripts I'm working on
                            My favourite search engine

                            Comment


                            • #44
                              Any ideal for getting a shadow effect?

                              I tried using this but don't seems to be working though.

                              <span style="filter:shadow(color=#006699 , direction=225)">{param}</span>
                              . . . . . . . . . . . . . . . . . . . . . . . . . . .
                              My Blog: www.MrBrian.net
                              My vBulletin:
                              www.vBulletin-Fans.com
                              JustIdling[dot]com: www.JustIdling.com NEW
                              . . . . . . . . . . . . . . . . . . . . . . . . . .

                              Comment

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