Announcement

Collapse
No announcement yet.

Add Custom Profile Fields in Postbit

Collapse
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Originally posted by zoran_dj View Post

    We can tell the system to change only location color, and we can do that like this, first you need to edit your user profile field location template like this:

    Code:
    {vb:data userInfo, user, fetchProfileInfo, {vb:raw conversation.userid}}
    
    <vb:if condition="$userInfo['field2']"><li class="b-userinfo__additional-info" [COLOR=#FF0000]data-field-label="{vb:phrase field2_title}"[/COLOR]><label>{vb:phrase field2_title}:</label> <span>{vb:raw userInfo.customFields.default.field2_title.val}</span></li></vb:if>
    With this change we have added the data field label which will be called Location if your user profile field for location is field2, then we can color it like this:

    Code:
    .b-userinfo__additional-info[data-field-label="Location"] span {
    font-weight: bold;
    color: red;
    }
    It is working for English language. If I change the language it is without color.
    I try to add a code containing the "Location" in Romanian: "Locație" . But without success.

    Thank you

    Comment


      If the code under doesn't work, then you have done something wrong because it must work if this CSS class is the only CSS class in your css_additional.css template:

      Code:
      .b-userinfo__additional-info[data-field-label="Locație"] span {
      font-weight: bold;
      color: red;
      }

      Comment


        For some reason the special character "ț" is creating problems.
        I had to change the translation from Locație to Locatie to make it works.


        The special character ț will become & # 5 3 9 ; after saving CSS Additional and it will not be recognised.

        Without the special character it is working as expected.

        Comment


          Try changing that letter with a CSS code if you want to use Locație:

          Code:
          https://unicode-table.com/en/021B/
          https://www.w3.org/International/questions/qa-escapes

          Comment


            Originally posted by zoran_dj View Post
            Try changing that letter with a CSS code if you want to use Locație:
            Thank you again. Solved.

            Comment


              I've recently upgraded vBulletin to the current v5.6.1. Used similar mod in vb4. Still examining new features & directory.

              The text for the fields displays where it should, but I'm unable to get the images to display. Verified Profile Fields are still configured, in the PF Manager and Options have correct fields in main dashboard.

              Where should images be stored on server in the vB directory? Chmodding should be set to...? Am I performing template edits?

              Thank you for any insight.

              Comment


                The mod is still supported? vB 5.6.1, PHP 7.3.18

                Comment


                  Display of users who have selected to remain in Invisible Mode is a deal breaker.

                  Comment


                    I want to add a link to send tips via cashapp. How could i go about adding something like <vb:if condition="$post['field5']"><div class="postdata">Send Tip: <a href="h.t.t.p.w.w.w.//cashapp.c.o.m/$post[field5]">CashApp</a></div></vb:if> and making it work correctly?

                    Comment


                      the mod working fine on vb 5.6.4 but the "SEND PM" icon doesn't work because of the system update
                      Code:
                      .send-pm-in-postbit:before {
                      content: '';
                      width: 15px;
                      height: 14px;
                      position: relative;
                      bottom: -1px;
                      background: transparent url('images/css/sprite_icons_vb_ltr.png') no-repeat scroll [COLOR=#FF0000]-16px[/COLOR] -176px;
                      display: inline-block;
                      margin-right: 3px;
                      }
                      Can someone update the updated code to the system?

                      Comment


                        Thanks for this product.

                        I will test it on legacy/vertical postbit.

                        Comment


                          Originally posted by glennrocksvb View Post
                          By default, vBulletin 5 only displays the Join Date and Post count in the postbit area (avatar and username section) in the thread view of a topic. There may be other tutorials out there to add custom fields in postbit but some require you to edit the existing postbit template. Editing existing templates is not good for maintenance reasons as you would have to resolve template merge conflicts every time you upgrade. Or some might require you to create a template hook and repeatedly copy/paste template code for adding multiple fields and change instances of profile field variable names. Another maintenance nightmare.

                          Don't look any further, here's the mod that is simple but rocks! Simply download the zip file, uncompress it and upload the XML in AdminCP > Products & Hooks > Manage Products > [Add/Import Product] and you're good to go. By default, it adds Location and Occupation profile fields. You can configure what profile fields to add in AdminCP > Settings > Options > Custom Profile Fields in Postbit Settings.

                          As a bonus, the mod also adds "Send PM" link to the postbit to make it easier for users to send a private message to a user while reading a thread. You can also configure that in the Custom Profile Fields in Postbit Settings.

                          Demo:
                          Look at the postbit section on this thread.

                          Upgrade Instructions:
                          If you are upgrading this mod from an older version, choose Yes in the "Allow Overwrite" radio button when importing the XML file.

                          Customizations:
                          To add the existing envelope icon in the default icon sprite image to the Send PM link, add the below custom CSS in css_additional template in AdminCP or in Sitebuilder > Style > CSS Editor.
                          Code:
                          .send-pm-in-postbit:before {
                          content: '';
                          width: 15px;
                          height: 14px;
                          position: relative;
                          bottom: -1px;
                          background: transparent url('images/css/sprite_icons_vb_ltr.png') no-repeat scroll [COLOR=#FF0000]-16px[/COLOR] -176px;
                          display: inline-block;
                          margin-right: 3px;
                          }
                          For dark colored themes, you can use the light colored envelope icon by changing -16px to 0 in the background value above.

                          Version History:
                          v1.1
                          • Added rel="nofollow" to Send PM link to prevent search engines to follow the link and get Access denied error.
                          v1.0
                          • Initial version.
                          can you help with css code like this field to add other fields without using products

                          Comment


                          • glennrocksvb
                            glennrocksvb commented
                            Editing a comment
                            What other fields? If custom profile fields then there's no way to show it via CSS if it's not present in the HTML source in the first place.

                          Thank you Glenn! Adds back to vBulletin 5 some of the look and feel we had gotten accustomed to in vBulletin 4.2.5.
                          The Linux Community has given me much. I do what I can to return the favor!

                          Comment


                            please, help the image is not shojng up on my forum, it is light colored theme... i even made my own image.

                            Comment


                              The sprite image containing all the icons used in vB5 has changed since this mod was posted. That's why the image icon will not show up. To find where the new location of the sprite image file is, right-click any of the icons on your forum and then choose Inspect. Observe the background used and locate the image path inside the "url(" and ")". Copy that path and use it in the CSS code. I will update the first post with this instruction.
                              Helpful? Donate. Thanks!
                              Buy me a coffeePayPal QR Code
                              Fast VPS Host for vBulletin:
                              A2 Hosting & IONOS

                              Comment


                              • glennrocksvb
                                glennrocksvb commented
                                Editing a comment
                                First post updated.

                            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 "|||"