1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Country Custom Field Made Easy

Discussion in 'Tips and Guides [Archive]' started by John L., Oct 13, 2011.

  1. John L.

    John L. Well-Known Member

    What is this?
    Just a simple little modification for those of us who want our users to be able to select what country they are from. This tutorial will save you a fair bit of time when setting it up.

    field-screenshot.jpg

    *Note: The country list WILL NOT be maintained and this IS NOT SUPPORTED in any way, shape or form. This is simply a tutorial to make adding countries easier.

    The Setup Process
    The setup process is pretty straight forward, but make sure you have access to FTP and phpMyAdmin before you get started.
    • Step 1: Setting Up the Flag Sprites
      • Download the attached file "flag-sprites.zip" and upload the "styles" directory into your root XenForo directory.
      • Login to the Admin CP and within the admin search find "Extra.css". Paste the contents of flags.css into that template and save.
    • Step 2: Setting Up the Custom Field
      • Login to the Admin CP and head to "Custom Fields" under the "User" tab.
      • Click on "Create New Field" and enter the following information in.
      • Under "Basic Information" add the following:
        Field ID: country
        Title: Country
        Description: *Anything you want*
        Display Location: Personal Details
        Display Order: 100
        Field Type: Drop Down Selection
      • Under "Options for Choice Fields" add the following:
        Value: test
        Text: Test
      • Under "General Options" do the following:
        Check off any options you want to set for this field.

        In Value Display, add the following:
        HTML:
        <img src="/styles/default/xenforo/clear.png" class="flag flag-{$choice}" alt="{$value}" /> {$value}
      • Save this field.
    • Step 3: Import the Countries via phpMyAdmin
      • Login to phpMyAdmin and find your XenForo database.
      • Insert the SQL code attached in "countries.txt" and run.
      • Check your Country Field to see if the countries have been successfully added.
      • Remove the "Test" option if it is still there.
    • Step 4: Enjoy! Let me know of your success.
    Copyrights
    The flag icons are the property of famfamfam.com and I did not create them. The sprite image was provided by flag-sprites.com.
     

    Attached Files:

    schwert, MichaelDance, Alien and 8 others like this.
  2. Ranger375

    Ranger375 Well-Known Member

    Awesome man!
     
  3. Andrej

    Andrej Well-Known Member

    22-10-2011 22-40-55.png
    The flag does not appear properly. Everything is done according to the guide.

    EDIT:
    Code:
    <img src="/styles/default/xenforo/clear.png" class="flag.flag-{$choice}" alt="{$value}" /> {$value}
    There was a dot missing between flag.flag , but that didn't solve the problem.
     
  4. John L.

    John L. Well-Known Member

    Show me your Extra.css contents and double check the flag sprite file has been added to the proper location.
     
  5. Andrej

    Andrej Well-Known Member


    The only Extra.css content i have, is what is in the countries.txt file. And I checked the flag sprite file, and it's at the right location. I guess this is happening because of that missing dot between flag.flag in Value Display HTML.

    Unable to save the changes due to a annoying "The server did not respond in time. Please try again." error, so I respond later when I get around to check this. I can't get past this error right now.
     
  6. John L.

    John L. Well-Known Member

    That doesn't seem right:

    According to my instructions the Extra.css file should contain whats in flags.css, not countries.txt. That code is meant for phpMyAdmin.
     
  7. Andrej

    Andrej Well-Known Member

    Sorry, I meant flags.css...
     
  8. John L.

    John L. Well-Known Member

    That dot is not necessary. Remove the dot so it looks like my original instructions. Please post the contents of your Extra.css file and also the link to your forum.
     
  9. Andrej

    Andrej Well-Known Member

  10. John L.

    John L. Well-Known Member

    Okay, I would take the path in Extra.css to the flags.png file and make sure that your local installation can read that image. Maybe it's possible it's in the wrong location?
     
  11. Andrej

    Andrej Well-Known Member

    Okay, this seems to be resolved now. I forgot that /f/ is missing from .flag{background:url(/f/styles/default/xenforo/flags/flags.png since this is where the xenforo installed at.

    I have learned that I should not be up at night... Apologize for my stupidity.
     
  12. John L.

    John L. Well-Known Member

    :) No worries. I have done things many times that leave me scratching my head.
     
    Andrej likes this.
  13. Ranger375

    Ranger375 Well-Known Member

    Is there an easier way to do this with 1.1?
     
  14. Morgain

    Morgain Well-Known Member

    Look great if I can dare to do the SQL bit.

    Is the Welsh flag there? ddraig.png
     
  15. Ranger375

    Ranger375 Well-Known Member

  16. Andrej

    Andrej Well-Known Member

    It's a tutorial for 1.1 since it's using the custom user fields. :p
     
  17. Ranger375

    Ranger375 Well-Known Member

    Was anyone with 1.1.1 able to get this to work? For whatever reason the flags don't display correctly for me.

    iissue.png
     
  18. Pro

    Pro Active Member

    Couldn't get it working either. Uninstalled everything, but now the flag is stuck on my postbit :(
     
  19. Andrej

    Andrej Well-Known Member

    Did you change the
    Code:
    .flag{background:url(/styles/default/xenforo/flags/flags.png) no-repeat;height:11px;width:16px;}
    to the directory the flags sprite is in at your site?
     
  20. Ranger375

    Ranger375 Well-Known Member

Share This Page