Creating GUI configuration options Making a GUI Config / Options dialog for your addon is always a bit tricky , however this HOWTO will hopefully help you in such an endeavor . Since a config dialog is usually added to an existing addon , this HOWTO will use an existing addon as an example , but we encourage you to use your own addon while following this HOWTO . This HOWTO is not meant to reproduce myClock in any shape or form , and you ' ll notice that the code has been changed in a number of places . Nevertheless this HOWTO is based on it , and if you filled in the gaps would give you a nice basic myClock like addon . In the TOC file we need to add your config dialog ' s . xml file . Also to have a config dialog that remembers it ' s settings between game sessions , you will need to use the SavedVariables directive . The TOC file . myClock . toc : Before changes We need to : This HOWTO uses myAddOns to show the config dialog because it is much simpler then creating a slash command . If you wish to use a slash command , it is recommended you read as it is not covered in this HOWTO . myClock . toc : After changes Load config from SavedVariables . Using the SavedVariable ' myClockConfig ' we declared in the . toc file , we can now load and save our addon ' s configuration between game sessions . Remember that SavedVariable is per - account , not per - realm and not per - character , so we will need to use tables to store individual settings . Main frame : . xml . We will be modifying the main addon frame , in this case ' myClockIndicatorFrame . xml ' which is used to display the current time . We need to : The OnLoad is needed to start watching the ' VARIABLES _ LOADED ' event ( when myClockConfig will have its saved values set ) . Next , we use OnEvent to actually do something when the event fires . myClockIndicatorFrame . xml Main frame : . lua . Globals . We need to : myClockIndicatorFrame . lua Registering Events . Since we will use the VARIABLES _ LOADED event to know when it is safe to use our SavedVariable , We need to : myClockIndicatorFrame . lua : anywhere inside myClockIndicatorFrame . lua : anywhere inside Custom Update Functions . We now have a function that will be called when our variables are loaded . It will need to : within myClockIndicatorFrame . lua So this function is very simple , it created a new table for storing our configuration on a addon - wide , realm - wide and character basis , then checked for every config option and made sure it was loaded , if not then set it to the default . We added myAddons support , telling myAddons what our mod ' s name , main frame , and config frame was using a table declared in our globals . The last line is interesting , we make a call to myClock _ ConfigChange ( ) . This is the function that will actually change our mod based on our settings . In the case of a clock most of those options ( ' time24 ' , ' offset ' ) are actually in OnUpdate , but we would handle the ' on ' in this function . Our config change should : within myClockIndicatorFrame . lua It can also be useful to have a function to set everything back to defaults . . . here is one you might use in this case within myClockIndicatorFrame . lua Making your config frame . Now that your mod is using your SavedVariable , and is both loading it ' s settings from it ( or using the defaults ) , you need a configuration frame to allow users to modify their settings ! There are many popular ways of doing this , you can create slash commands ( learn more at ) , a right click menu , but for now we will stay simple , and just have a frame popup when you use myAddons to display the options . From inside the game , you can hit the ' ESCAPE ' key and chose the ' Addons ' item to have myAddons open . From there you can click on the name for your addon , and then click the ' Options ' button on the bottom right . But it won ' t open your options right now , because you haven ' t made the frame yet ! config frame . xml . Basic Frame with Backdrop . Let ' s flesh out a basic config frame : myClockConfigFrame . xml We now have a config frame , and if you go in - game you can see it in all it ' s splendor . Feel free to make it any size , and the ANCHOR point = " CENTER " will make sure it is dead center on the screen no matter the resolution . You ' ll probably want some kind of title on it to say what mod ' s options it is , so here ' s some Layers info to do that : within myClockConfigFrame . xml Adding Close and Default Buttons . That should make a small title box appear , and you ' ll notice the FontString ' s text attribute is set to " Clock Config " - - you can change this to anything you want . If you ' re doing localization ( ui ) , maybe even a constant ! You might notice that once you display your config frame , there ' s no way to get rid of it ! Let ' s fix that right away by adding a ` Close ' button : within myClockConfigFrame . xml This button , which you ' ll notice is anchored at the bottom right of the config frame , simply tells our configuration frame to hide . While we ' re at it , let ' s add a defaults button in the bottom left of the frame . within myClockConfigFrame . xml You ' ll notice all we really had to do here was call our ConfigToDefault function we made in ' myClockIndicatorFrame . lua ' - - it will take care of updating our addon for us ! Now we should be able to undo any damage should we mess around with our mod ' s config settings . Checkboxes and Sliders . With most of the graphical frame stuff out of the way , it ' s time to add our checkboxes , and a slider for the offset ( Dropdown menus are a lot more complicated , so this HOWTO won ' t be covering that ) . Your basic checkbox config will look like : within myClockConfigFrame . xml You ' ll notice I ' m using the ' $ parent ' and ' this ' variables here to make this code generic , able to be used anywhere . If this was the 2nd checkbox , my Anchor relativeTo would be ' $ parentCheckButtonOn ' , and so forth , so that each item in the config dialog was just a bit bellow the others . Of course you could use absolute positioning by just getting rid of the ' relativeTo ' altogether . You should also see that the CheckButton has a OnLoad to set its text , since this will be an automatically created FontString . Again I use ' this : GetName ( ) . . " Text " ' to make this code generic . I ' ve set the text to " On " in this case , but you can change this to whatever you want , even a localized ( ui ) variable ! The OnClick simply loads a lua function , but it is important to note that we will use this function for ALL our CheckButtons . That ' s right , we can use the same function for all our CheckButton ' s ! In our case we ' ll need to repeat this CheckButton xml code twice , once for ' on ' and again for ' time24 ' . So go ahead and try to create another checkbox . Watch out for the offset ! Look at the slider example bellow for how the offset should look after the 1rst item . Here ' s what our slider code might look like : within myClockConfigFrame . xml You ' ll again notice that we ' re using the Anchor relativeTo on the last checkbox , which will be $ parentCheckButtonTime24 . We ' re again dynamically getting the FontStrings that WoW will create for us , like the ' Text ' one set to " Offset " . As well , because this is a slider , we have " High " and " Low " FontStrings , have to set the minimum and maximum values the slider has , and how many values are added or subtracted when you move the slider . What will most surprise you is that . . yes . . . we can still use that option function for our slider too ! One function for all the basic config options ! Frame Scripts . It ' s also important that all our current settings are loaded into our config frame , and since they might change when we use a slash command or something , the best way would be to use a OnShow event . within myClockConfigFrame . xml config frame . lua . Our lua file for the config frame then breaks down into just 2 functions , one for when the frame is shown , the other for when an option in the config frame ( like a checkbox , or a slider is moved ) changes . within myClockConfigFrame . lua You ' ll notice again that we have to make sure that the profile is there ( or variables loaded ) . The code also uses the getglobal ( ) function to construct the names of the controls , so it doesn ' t matter what we called our frame . After that it ' s a simple matter of using SetChecked ( ) or SetValue ( ) with our profile settings to make our config dialog look right . The last part is making sure that when they change something in the config dialog , it changes the profile . Here ' s what that would look like : within myClockConfigFrame . lua Again we have a check to make sure our profile is loaded , and then a mock switch / case statement to determine which CheckButton was pressed . Once we know , it ' s a simple issue of using this : GetChecked ( ) or this : GetValue ( ) to set our profile config ! At the end we make sure our main addon knows that something was changed . Alternatively you could leave out the ' myClock _ ConfigChange ( ) ; ' of this function , and add it to the Done button OnClick event to make a Save / Cancel dialog . Generally speaking for a config people want to see the changes happen live so they can tweak them . You ' re done ! Hopefully this provided some concrete examples on how to make a config dialog , and much thanks to Scheid for being the ginipig ! You could easily go from here to make a more complex configuration pane , using tabs , multiple pages , or even using Cosmos ' Khaos ( another howto someday ) .