Announcement

Collapse
No announcement yet.

How to change the Private Message "Post" button text to "Send"

Collapse
This is a sticky topic.
X
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Free Mod How to change the Private Message "Post" button text to "Send"

    The Private Message thread page is just re-using the Forum/Article/Blog thread page template. PMs are stored in the database the same way as normal thread posts. Private Message is just a special channel and essentially acts the same as a regular channel. This is the reason the UI for PM is the same as the forum/article/blog channels.

    But for PMs, using "Post" as the button label for sending a PM is not appropriate. Using "Send" button label is more appropriate. The button is globally using the phrase variable "post_verb" in the Phrase Manager in AdminCP but if you change it to "Send", it will change all instances which is not good for non-PM channels.

    But worry not! There is a simple pure CSS solution. Simply add this custom CSS in css_additional template in AdminCP or Sitebuilder Style Editor:

    For vBCloud:
    Code:
    /* Change PM button to "Send" - START */
    #privateMessageContainer .js-content-entry-submit,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit,
    .b-pmchat__widget .js-pmchat-submit​ {
        text-indent: -999999px;
        display: flex;
        justify-content: center;
    }
    
    #privateMessageContainer .js-content-entry-submit::after,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit::after,
    .b-pmchat__widget .js-pmchat-submit​::after​ {
        content: 'Send';
        text-indent: 0;
    }
    /* Change PM button to "Send" - END */
    The above code hardcodes the button label to "Send" as vBCloud does not support using phrase variables in templates. Update the button label to the desired text accordingly. If your forum uses multiple languages and you want to have different translations for the Send button, add the following additional CSS code:

    Code:
    /* Sample code for Italian */
    html[lang="it"] #privateMessageContainer .js-content-entry-submit::after,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit::after​,
    .b-pmchat__widget .js-pmchat-submit​::after{
        content: 'Inviare';
    }​
    The sample code above is for Italian language denoted by lang="it". Simply change "it" with a different 2-letter language code in lowercase. Repeat the same block for each language your forum supports.



    For vB5 and vB6 (Self-hosted):
    Code:
    /* Change PM button to "Send" - START */
    #privateMessageContainer .js-content-entry-submit,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit​,
    .b-pmchat__widget .js-pmchat-submit​ {
        text-indent: -999999px;
        display: flex;
        justify-content: center;
    }
    
    #privateMessageContainer .js-content-entry-submit::after,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit::after​,
    .b-pmchat__widget .js-pmchat-submit​::after{
        content: '{vb:phrase send}';
        text-indent: 0;
    }
    /* Change PM button to "Send" - END */
    The above code doesn't hardcode the button text like it does for vBCloud but it uses a phrase variable which means you don't have to do anything extra for multiple translations. It uses the existing phrase variable called "send" (in {vb:phrase send}) which has default value of "Send". If you want to use a different phrase variable, you can create a new custom phrase in the Phrase Manager and then use the variable name you assigned to it and replace it like below

    Code:
    #privateMessageContainer .js-content-entry-submit::after,
    #vb-page-body:has(#privateMessageContainer) #preview-overlay .js-content-entry-preview-submit::after​,
    .b-pmchat__widget .js-pmchat-submit​::after{
        content: '{vb:phrase thePhraseVariableYouCreated}';
        text-indent: 0;
    }

    If you find this mod useful, please consider buying me a ☕. Thanks!

    Enjoy!

    Last edited by glennrocksvb; 02-20-2024, 12:06 AM. Reason: Fixed issue in Safari
    Helpful? Donate. Thanks!
    Buy me a coffeePayPal QR Code
    Fast VPS Host for vBulletin:
    A2 Hosting & IONOS

    #2
    Still shows "Post" using the quick VB chat window. Shows "Send" if using the message center, (chrome)

    On iPad shows both?
    Attached Files

    Comment


      #3
      Ditto what Mitch said. Also, if one is using a custom style for your forum; I am; the text in the Send button is the same color as the button, at least it is in my case.
      Click image for larger version

Name:	Screen Shot 2024-02-19 at 9.04.43 AM.png
Views:	87
Size:	206.1 KB
ID:	28949
      The Linux Community has given me much. I do what I can to return the favor!

      Comment


        #4
        Originally posted by Mitch View Post
        Still shows "Post" using the quick VB chat window. Shows "Send" if using the message center, (chrome)

        On iPad shows both?
        Forgot about the vBMessenger. I have updated the first post to also change the Post button in the quick chat popup.
        Helpful? Donate. Thanks!
        Buy me a coffeePayPal QR Code
        Fast VPS Host for vBulletin:
        A2 Hosting & IONOS

        Comment


          #5
          Originally posted by Snowhog View Post
          Ditto what Mitch said. Also, if one is using a custom style for your forum; I am; the text in the Send button is the same color as the button, at least it is in my case.
          Since it is a custom style, I need to inspect the page to be able to see what's wrong. There might be other CSS that's overriding the CSS for this mod.

          Helpful? Donate. Thanks!
          Buy me a coffeePayPal QR Code
          Fast VPS Host for vBulletin:
          A2 Hosting & IONOS

          Comment


            #6
            Originally posted by glennrocksvb View Post
            I need to inspect the page to be able to see what's wrong.
            You should be able to do that; you have privileges of a Retired Administrator on our Forum. If you aren't able to get to where you need to be, let me know.
            The Linux Community has given me much. I do what I can to return the favor!

            Comment


            • glennrocksvb
              glennrocksvb commented
              Editing a comment
              I don't know my credentials. Please PM to me. Thanks!

            • glennrocksvb
              glennrocksvb commented
              Editing a comment
              Can you try copying the code again? I checked your site and I saw some red dot characters in the pasted CSS code which causes the code to break.

            #7
            On IOS I’m still getting “sendpost”


            Attached Files

            Comment


            • glennrocksvb
              glennrocksvb commented
              Editing a comment
              Hmm, do you also see the same issue on this site? I also installed the mod here.

            • Mitch
              Mitch commented
              Editing a comment
              Yes

            #8
            A screen shot on IOS from this site


            Click image for larger version

Name:	IMG_3747.jpg
Views:	86
Size:	69.1 KB
ID:	28961

            Comment


            • glennrocksvb
              glennrocksvb commented
              Editing a comment
              Thanks. I'll look into this.

            #9
            glennrocksvb Those red dot's must be in the code you wrote. I simply used my mouse to click 'n drag to highlight the code then used Edit | Copy and Command+C (tried it both ways), then pasted the code using Edit | Paste and Command+V (tried it both ways). It's exactly how I've copied and pasted codes of yours before into the CSS Editor.

            I'm on my iMac, so MacOS. That's why it's the Command key and not Ctrl.

            I removed the red dots from the pasted code in CSS Editor and then the SendPost button shows as it should. Thank you.
            The Linux Community has given me much. I do what I can to return the favor!

            Comment


              #10
              Mitch and Snowhog, can you try again? I have updated the code in the first post to fix the issue in Safari. Please let me know if it fixes the issue.
              Helpful? Donate. Thanks!
              Buy me a coffeePayPal QR Code
              Fast VPS Host for vBulletin:
              A2 Hosting & IONOS

              Comment


                #11
                All good now!

                Comment


                  #12
                  Safari (on MacOS): Good
                  Safari (on iPhone 11 Pro Max): Good
                  Firefox (on MacOS): Good
                  Firefox (on iPhone 11 Pro Max): Good
                  Firefox (on Ubuntu Linux): Good
                  The Linux Community has given me much. I do what I can to return the favor!

                  Comment


                    #13
                    Thanks Mitch and Snowhog for confirming that the latest CSS code works on multiple browsers.
                    Helpful? Donate. Thanks!
                    Buy me a coffeePayPal QR Code
                    Fast VPS Host for vBulletin:
                    A2 Hosting & IONOS

                    Comment

                    Users Viewing This Page

                    Collapse

                    There is 1 user viewing this forum topic.

                    • Guest Guest

                    Latest Posts

                    Collapse

                    Working...
                    X
                    Searching...Please wait.
                    An unexpected error was returned: 'Your submission could not be processed because you have logged in since the previous page was loaded.

                    Please push the back button and reload the previous window.'
                    An unexpected error was returned: 'Your submission could not be processed because the token has expired.

                    Please push the back button and reload the previous window.'
                    An internal error has occurred and the module cannot be displayed.
                    There are no results that meet this criteria.
                    Search Result for "|||"