How to Add Steam Multiplayer in Unreal Engine 5 - Tutorial

in this tutorial we are going to take a look at how to add steam multiplayer in Unreal Engine 5 before we get started and jump into the engine you have to download a couple of things and the first thing you have to download if you search on google. netcore and you click on the first link from Microsoft because we need it uh for the project in Unreal Engine so go ahead and click on the latest one that you see on your uh on your screen you might see this in the future and the next thing you want to download is the NET Framework and if you again click on the first link from Microsoft and you install the latest framework that you see on your screen and then the next thing you want to download is direct X and again Microsoft's website the first one here you select the language and hit download and the final thing you have to download is Visual Studio 2022 so go ahead and select the first one and and here when you hit download you have to download the community 2022 now when you install Visual Studio it is important that you install the correct things during the installer so here I have my own visual studio and I'm going to click on modify so you can see what I have installed for my visual studio and you have to select the net desktop development and you have to select the universal windows platform development and the desktop development with C++ and also the mobile development with C++ and down here you have to select the game development with C++ and I also have this I don't think it's needed but selecting the Linux and embedded development with C++ as well now over here in the individual components you have to click here and then you have to scroll all the way down where you see on your screen the windows SD K just make sure that you are installing Windows 10 SDK as well as Windows 11 SDK now you can install my version here as you see it on the screen if it is clear for you but go ahead and install Windows 10 SDK as well as Windows 11 SDK and just go ahead and hit install and wait for it to finish now I'm just going to close everything down and I'm going to jump into the engine if you're interested in Unreal Engine 5 game development courses you can visit my website caminstructor here I make both single player and multiplayer courses with videos being released daily in 4K resolution there's also a section for purchasing game ready assets and another tab for hiring me for private tutoring sessions I'm available 24/7 on my Discord server to help you out and all of the links are in the description below uh go ahead and launch the engine or you can launch a project that you're already working on now for this tutorial I'm just going to create a new project so I'm going to launch the engine and when I launch the engine I'm just going to create a new project so selecting games just simply selecting the third person project here template and choose a location to save it and then give it a name for example for this one I'm just going to call it steam sessions and before I hit create I'm just going to take this one start start a Content enabled so I have something to work with and I'm going to hit create and here we are inside of the engine and if I click on play you can see I am in the game and everything is working and also if I click up here and I select number of players is two so remember you can click up here to select uh two player and also over here as the net mode you have to select play as listen server so selecting that as well and I'm going to click up here and play it in a new editor window so now if I do do that it pops up on my second screen but as you can see it is working as multiplayer however this is only inside of the engine the purpose for this tutorial is uh to take it to steam so we can actually uh connect with each other we have a server browser we can host games and so on I'm just going to close all of this for now and before we can add steam multiplayer to it we have to convert this project to a C++ project now we are not working with C++ we're only going to work with blueprints but we have to convert it into a C++ project before the files from the steam plugin can work so to do this go ahead and hit tools and click on new C++ class just go ahead and click on next hit uh create class and it's going to create a new C++ class and it's also going to convert your project into a C++ project so now you can see it says project now includes source and so on so I'm going to close this and it says would you like to edit the code now I'm just going to hit no and now it is a C++ project so what we can do now is we can close this down and now it is time to add the steam plugin now if you just Google recency steam this is uh the steam plugin that was that is working currently in Unreal Engine 5.3 and probably also the future versions uh depending on when you're seeing this tutorial so just go ahead and search for recency steam and go ahead and click on the first link recency Steam on GitHub so clicking on that one and inside of here you can also write the link if you wish I'm going to include this in the description below so go ahead and get in here click on code and click on download zip file and it's going to download the plugin for you and when you have downloaded the file go ahead and click in here go to the downloads folder and open up the newly downloaded file inside of here I'm just going to go in here and clicking on the plugins folder and inside of the plugins folder you see the advanced sessions plugin go ahead and click on that file and these are the two folders that we need the advanced sessions and advanced steam sessions what I want you to do now is I want you to find your project that you are working with currently now this here is my newly created project in unreal engine and usually they are in documents unreal projects and this is the steam sessions project I just created but remember if you're using your own project go to your own projects file and go inside of here and let us now make a new folder called plugins so let me right click here make a new folder called plugins double click here and now drag the first one into here and also drag the second one inside of here so now you have both folders the advanced sessions and advanced team sessions inside of the plugins folder so what what I want you to do now is I want you to delete some of the some of the folders here so delete the vs folder and derived data cache folder the intermediate folder the saved folder and the vs config and steam sessions. sln so not not this one but the this one go ahead and hit delete on your keyboard so these are the folders We have left now right click on your Unreal Engine project file go to show more and here go ahead and generate Visual Studio project files go ahead and click that and the reason why we needed to download the first things from the beginning the net core NET Framework and so on this is because we need to do this we need to generate Visual Studio project files so go ahead and do that sometimes you get errors if this is the first time you do it please read the error here on the screen if you get one and try to see what it needs sometimes it is a specific file that you're missing on your PC and so on so go ahead and do that and you can also write in the comments below if you need me uh to help you out as well here you see uh an sln file has been generated go ahead and double click this file and when Visual Studio opens up go ahead and click on this Arrow beside the games folder so you can see your your game name here steam sessions is my game right click this one and hit build so when you do that you can see it starts building down here and I'm just going to wait for it to finish sometimes it takes uh 10 seconds sometimes it takes 5 minutes so I'm just going to skip ahead until this one is finished all right so now it finished the build and it says that it succeeded and z zero failed so very important to take a look at this message down here to see that you don't have any errors and when this is finished let's close down Visual Studio because now we can go into the project and test if we actually have steam so go ahead and double click on your onreal engine project and now inside of here let's go to edit and go to plugins now inside of plugins let's check if we have the plugin so if you click on the advanced sessions plugin here that we installed you can see they are both enabled also if you scroll down and you find this one called online platform make sure that the online subsystem is also enabled very important let's close now this plugins tab so now that we have ensured that the plugins are enabled I want you to go to Google and search for online subsystem Steam and inside of here in unreal engines uh documentation this one online subsystem steam you have to go inside of here I will also post this in the uh in the description down below but just make sure that this is updated so down here if you scroll down you see this one finished settings for the default engine.ini go ahead and copy all of this here you don't really have to understand what this means unless you want to improve this plugin so just right click copy now let's go back to the folder for the Unreal Engine project and this is the steam sessions that I'm working on and inside of here I want you to go to config and open up the default engine.ini and paste this newly copied code if you are working with a game if you already have a game on Steam you have to change this steam development ID so you have to change it to your own ID however right now we can test without uploading anything to steam so we can just use this test ID which steam has created for us so go ahead and hit save for this file and now I want you to close your Steam sessions project if you have it open and then open it once again now inside of here just click on these three dots and just make sure you are running the game through a standalone game now make sure that you have steam open because if you don't have steam open on your computer your steam plugin is not going to work so every time you want to work with steam sessions you have to have steam open and you have to be logged into your account go ahead and click on Standalone game and let's play the game and see if the plugin is working so if it is working it should pop up with steam and you can see it popped up on my second monitor but you can see down here to the to the right below that steam is running and the plugin is working so now we are ready to work with the plugin all right so let's start doing the main menu first so let's do that here in the content draw I'm going to click down here and duck in layout so you can better see this up all the time and I'm also going to hit window and going to H hit the debug if I can find it here in the tools debug widget reflector and I'm going to set the UI to 1.25 because I'm I'm recording on a 4k monitor and the UI is small for you so now it is a larger size now inside of here what I want you to do is I want you to create a new map because we need to make the main menu now so here in the content I'm actually going to make a new folder called Dash my content so I can see this up all the time so inside of here let's right click make a new folder called maps and in here let's make a new level called map main menu insert VI let's double click open up the new level that we created and let's save it and now inside of here let's make this main menu map the main map that opens when you open up your game so let's click on edit go to Project settings and inside of maps and modes here here you can change the editors startup map to be your your main menu map that you just created and also the same thing for the game default map we want to start the player in the main menu next we want a player controller and a game mode for the main menu so let's get out of the maps folder let's make a new folder called Blueprints and inside of here let's right click make a new blueprint class and let's make the game mode and call it GM I usually call it GM as a prefix and let's call it main menu let's right click again make a new blueprint class uh make a player controller and call it PC main menu so player controller main menu Now open up the game mode and inside of the game mode let's find here in the class defaults the player controller class and let's change this one from the default Unreal Engine to this one the player controller we just created called PC main menu go ahead and compile save everything file save all let's close it down and also here in the world settings now if you don't have the world settings open you can click on window and select World settings and inside of here for the game mode override you have to select your own game mode that you just created the GM main menu so go ahead and select it and also make make sure in in edits and project settings if you click on maps and modes where we just changed the map here in the default game mode let's change it to be the main menu because again we want the player to start in the main menu with the main menu game mode that we just created and here if you click on the selected game mode you click down just make sure that the player controller is PC main menu uh which we changed inside of the game mode now everything is uh is looking correct so let's close it down and now if you hit play and instead of doing it here now we are inside of the engine to test because the um the only thing we did here when we played as a standalone game was to test if steam was running and it is running so from this point I'm just going to play in a new editor window instead it opens a lot faster for me so let's now close this down and let's begin creating the main UI so go ahead inside of here right click make a new folder and I'm going to call this one UI and the first thing we want to do is design the main menu I'm going to right click uh go to user interface widget Blueprints and let's select user widgets inside of here let's call it WB main menu so this is a widget is basically a menu in unal engine so inside of here when we design widgets uh we first start with a canvas so let's search for canvas over here always start with a canvas whatever you're doing so go ahead and drop the canvas in and here you have it now just a tip to make your UI scale with all computers and mobile click on the screen size up here select laptop and select generic 14 to 15.6 in Notebook now what this is doing is you're actually designing this UI for a laptop size and then over here in the DPI scale if you click it down here now you can change how much much it is scaling on laa monitas and usually what I do is I click on this one over here for the scale eight and I usually find it to be 2.5 which is a a nice size to scale in so now I have a 4k monitor it's actually going to scale over here for me it's going to scale the UI 1.6 times uh from what you're designing here here it's really nice method you can design it for a for a for a laptop small screen laptop and it's also going to work for my 4k monitor as well so very nice tip to have also pay attention to the zoom up here when you work and zoom out and zoom in because one one is actually what it will look like inside of here so let me just close the animations tab I don't need it and I'm also going to drag this bit to this to the side so we can see here so the first thing uh we want to do is design the menu and here is this one from my other project I like to show you what we are going to design so you can see here beforehand what we are doing again we can design it a lot better visually uh but you can take a look at my website again on ginstr I have made a more in-depth course on how to add steam multiplayer including a lot more functionality than what is in this tutorial so just make sure to check out the ginstr it is a free course so everyone one can enroll in and take it okay so this is what we're going to design so I'm just going to hide this for now and the first thing we want to do since the buttons are on top of each other we need a horizontal box uh or vertical box so if you search for a vertical box we can click and drag it into the canvas panel so here it is if we click on it I'm just going to resize it drag it down let's change the Anchor Point to be in the middle because I want this UI to be in the middle and let me make the alignment so if you write 0 0 here in the position right now you can see it aligns to this corner so you have to change the alignment here and it is 0.5 to 0.5 in the Y so X and Y 0.5 and here we have now this vertical box so let's add some buttons to it now the buttons here for the UI they have text and a button behind it so we actually need something called an overlay because we are overlaying the text on the button so let's drag the overlay and let's drag it to the vertical box and inside of here let's search for button and inside of the overlay we're going to drop the button and we're also going to drop the text so text and button inside of the overlay now for the button I'm going to click here and make it fill horizontally and vertically as well so it fills all the way and also make sure again to check your Zoom if your Zoom didn't like this and you think maybe this text is too large this is because you're zoomed in plus three this is what it actually looks like okay so clicking on the button uh or on the text I can align the text in the middle of the button and clicking on the button I want to make it a bit larger so clicking on style normal image size and in the Y I'm just going to make it a bit larger maybe 65 and remember to also change it for the hover State and pressed State and easy way to do it is shift right click here or you can simply just right click and hit copy and then shift and left click on this one and on this one so now we pasted the same size here as here and here and for the text I'm going to give it a shadow just so you can see it a bit better for this tutorial so here in the shadow color I'm going to increase the alpha to maybe 0.5 and I'm also going to give it an offset by 2x two so you can see it a bit better here okay so for this one I'm going to hit contrl D to duplicate and contrl D again to duplicate this and the first one I'm going to call here in the text let's say create server and the second one let's say search server and the third one we can call quit Okay so for this one uh what we can do is uh we can give it a bit of uh space here but what we also can do is just click up here and hold control click on the second overlay the third overlay and we can hit fill now it fills uh the whole Space now let's give it a bit of space between each other and we can do that for the padding here so the top padding we can give it for example 15 and the bottom padding we can give it 15 as well like this and to make it smaller click on the vertical box and we can just make it as large as we want to here if you want to visual visualize it without the dash lines you can always click up here and let's click on the vertical box going to resize it like this and actually since we made it fill this doesn't really matter so if you click on the image size it's actually not going to matter so that is fine for now also remember to select all the text so click on the first one hold control select on the second and the third and now go down here and in the visibility you have to select not hit testable what that means is you can now hit the button behind this text because if the visibility is set to visible this text is going to block the mouse cursor and if you try to press the button on this text it's going to block you and you're not able to press the button so this is why we said the visibility to not hit testable meaning that the mouse will not hit this text and it will uh still click this button even though you're clicking on the text so now we are finished with this one everything is centered make sure that in the vertical box you Center the position of the X and Y to 0 0 and now let us click on compile and save everything and let's close this one down now let's go to the next menu let's right click go to user interface create a widget blueprint and for this one uh let's select here this one we're going to call it uh create server so we're going to create the host menu I'd like to show you what we are creating before we created so we are creating this one where we have the server name and we can create the amount of slots for the server and then we can hit create or go back to the main menu now if you want a better design and a lot more functionality for example if you want to change game mode change Maps change land mode and a lot more uh or for example make the server private and public you can always uh see my free course on ginstr again it is free you can always visit there and take a look uh alongside my other courses but we're going to do this for now so let's create all of this and let's start by adding again a canvas panel drag it in and in here let's start by adding a vertical box now this vertical box here let's resize it drag it into here also make sure again to click on screen size laptops and make sure we are designing it for the laptop here now for this one again change the Anchor Point to be in the middle the alignment to be 0.5 by 0.5 and the position 0 to 0 now it is aligned once again so the first thing we need is a text because we need it to say server name and here let's uh horizontally align it to the middle and let's say server name so now we have this and now we need a text box we can write in and this is the text box here so let's click and drag this into the vertical box and for this text box let's change the foreground color I don't know why the color is like this so let's uh click on inherit so you remove it and let's make this one a dark color so just black here and you can hold shift and right click to copy and hold shift and left click on those two to paste them in and you can also just right click and copy and paste and so on so now we have this and I'm going to add a default value because I don't want the player to create an empty named server so I'm just going to say my server as the default value and let's give it some space over here so clicking on the name uh you can actually just go up here search for spacer and you can drag it in here between the text and the editable box and clicking on the spacer you can increase the Y value and choose how much you want to space it so maybe 10 for example so let's drag in another text and drag it into the vertical box let's let's again align it to the middle and here we can call it amount of slots and let's give it some space again so I'm going to click on contrl D for the spacer to duplicate it you can also just right click and duplicate and go ahead and drag it beneath here now for the spacer let's increase the Y so it spaces a lot more maybe 50 and now let's go ahead and add the amount of slots so this is a drop menu so if you just search for combo it's called a combo box in Unreal Engine and it's the one called string this means text so let's drag this down here to the vertical box and here we have it so click on it and now for the default options so here we give it some options here are the options that the player can choose so the player can choose to have a server with two slots four slots let's say eight slots and 16 for example and the default selected option would be just two slots and go ahead and hit compile and here you see it is working again I'm just going to duplicate the spacer and give it some space between those and now it is working let's compile and save everything now we need a create server button and a back button and I'm just going to go to my main menu here and here we can just copy paste them so I'm going to copy this overlay the first one for example and going back hitting the vertical box and clicking crl V to paste and I'm going to again click on the vertical Box contrl + V to paste the second button the first one let's just call it create and the second one let's call it back so now for this overlays uh I'm just going to set the padding to zero so they are full here and I'm just going to add spacers once again so duplicate the spacer paste it down here uh give it the amount of space you need and and now also between them so duplicate this add it down here and just like this whatever you like okay so now uh this is finished so for the vertical box I'm just going to resize it so the buttons are like this I'm actually going to give it a bit more space over here something like 50 and again resize the vertical box so the buttons become a bit larger something like this everything's looking good and you can also decide the width of it and here we go so for the vertical box make sure again the position is 0 by 0 and let us close this down now the the almost last one is user interfaces let's go down and create the server browser so creating the server browser go ahead and open it up now for the server browser we are going to make it look like this one so having a back button a refresh button and also having this info and the servers themselves inside of a scroll box so now again when you design a menu it's always nice to imagine what you want to design before you design it and you can also write it on paper what you want to design so go ahead again we need a canvas panel first searching for canvas panel and let us add a vertical box and inside of the vertical box remember we have buttons horizontally aligned so we have to search for a horizontal box and inside of this horizontal box remember it needs to be inside of the vertical box so now let's drag this again into the middle see what we are doing the Anchor Point is aligned to the middle the alignment is 0.5 to 0.5 and the position is 0 0 so now it is in the middle now in the horizontal box let me just copy the main menu buttons once again I'm going to copy this overlay button contrl C go here click on the horizontal Al box contrl V and I'm just going to contrl V on the horizontal box again now for the first button let's say over here let's say back and for the second button here let's say refresh and again I'm going to select both of those overlays and for the padding I'm going to hit zero and let's hit the first button let's change the Y size to something we like maybe 65 and remember remember to hold shift again and right click to copy and paste it into the hover State and the Pressed State as well so doing that with the other button as well setting it to 65 in the Y holding shift to copy shift right click and then shift left click on those two states as well so now this is finished let's add a spacer between them here and for this spacer something like 25 and let me just make the vertical box bit larger so I can see what I'm doing and Center it again so what we need here again is a horizontal box let's add it to the vertical box now what we're doing is we're adding this text up here so let us do that let us click on the second vertical box add some text drag that in and let me just copy it three times so contrl D to duplicate it here the first text is going to say server name second second text is going to say players and the third one is going to say ping and now adding a spacer between them so searching for spacer adding a spacer here and let's add space in the X let's add for example 100 and let me click contr D to duplicate paste it down here and here we have it now for the horizontal box I'm just going to align it to the middle uh just so we have something simple and again I'm going to add a spacer between these two horizontal boxes so they have some space something like this again you can click up here to remove the dash lines so we can see what it looks like everything's looking great now down here we have the server list and the server list is inside of a scroll box so go ahead and drag that into the vertical box so it is down here and now we need a vertical box because the servers are aligned vertically so add a vertical box inside side of the scroll box and now what we can do now here uh for the vertical box let's actually change the name because we need it later I'm going to call it VB for vertical box and call it server list and let us compile okay so here we have the whole thing now we don't want to uh design these servers inside of here because they are not static UI elements every player is going to create their own server so what we actually need to do instead of creating it inside of here let's just save this poose this down and the last UI very very simple let's create another widget blueprint and let's call this one server Cod and it's actually the same thing so imagine uh in another game if you have a in-game shop or you sell items uh the shop itself is the UI the static UI that you create and every single item is uh this card here so every single item inside of the shop is actually a Cod by itself because they have custom information so we are doing the same thing here so for the server card let's open it up and again let's add a canvas now instead of just having uh a full screen canvas let's click up here on the fill screen and let's select desired so it's going to be here and it's only going to take the space of what we add here so let's get started now what we need for the server card this is what we need to design here so a button and some text on top of it you can try to design it yourself uh if you want some practice and let's get started so here in the uh in the beginning we need an overlay and let's drag that in for this overlay I am going to Anchor it to the middle and again alignment 0.5 0.5 and position 0 0 so now it is in the middle so for this one let's first add a button search for button drag that into the overlay and for the button let's fill it horizontally and vertically and let's now add some text on top of it so if I search for text add it on the overlay and actually we need a we need a horizontal box first so let's search for a horizontal box add it into the overlay and now we can add the text inside of the horizontal box okay now for the overlay over here you can see uh we can make it smaller and larger but instead I'm actually going to say size to cont so it's going to size to whatever I add inside of here okay so for the first one the text block this one is going to be the server name it doesn't really matter what you write here because you're going to change it dynamically in the game but I'm just going to call it server name or you can even uh call it for example Jinx server or whatever you can write wherever you want here okay so give it a spacer and spacer I'm going to to add it to the horizontal box maybe the spacer is 100 and then duplicate the text now we need the amount of players so for the amount players maybe one out of four total slots and let's add a new spacer duplicate this text down here and now for the last one I'm just going to say ping um or not ping we can just write something we can write 99 Ms for example okay so here we have it and you can also give some space to the top and bottom and you can do that by increasing this y here something like 50 and now for this uh overlay uh this is let's say the position is zero here and here for the horizontal box let me fill it vertically as well and fill it horizontally and now for this text we can align it here in the middle so align it vertically to the middle this one as well and this one as well now for the left left and right what you can do is you can give it some space as well so this text I'm just going to give it some padding to the left so I'm just going to give it 15 maybe 20 and also for the MS I'm going to give it 20 padding to the right so it has some space and now let's compile and save everything and let's see what it looks like so if I minimize this and I go to the server browser and inside of here I click on my server list vertical box and I search for WB server Cod this is remember this is what I called it here so you can also search for them up here and you can click and drag it into the server list and here you see it okay very awesome now you can also click control D to duplicate it and see what it looks like remove the dashed lines you can see we need some space between them so if I go back to the server Cod and what you can do here is this overlay or actually this button here you can click on the button and you can give it some padding to all sides maybe 10 and now you can go back and now you see we have some spacing between them maybe a bit less like eight instead compile and here we have it okay so these are the servers again the design is not the best but you can always visit my course if you're interested in making good designs as well and more functionalities but this is very very basic and everything is working now let us see if the scroll box is working so if I control and if I hit contr D to duplicate a lot you can see uh the the scroll box keeps going down and it's actually almost out of the screen so to make the scroll box work we have to click on fill and now you see when I click on fill it now uh works now I can scroll if I click on the last one here you can see it Scrolls and if you want to make it bigger again this is the vertical box you can always make the vertical box larger or smaller and you can also design it this way as well you if you want this to make it uh if you want to make this larer again you can make it more wide here okay so everything's looking great I'm going to make it something like this so it looks better and for the vertical box let us Center it to 0 0 now for all of this I'm going to delete all of these and just having the server list uh server list left so go ahead and compile save everything close this down and now we have created all of the UI now before I forget let me open up the server card and clicking on all of those here so holding control click on all of the text remember down here we have to change the visibility to not hit testable I'm also going to give them a shadow so we can see them better so 0.5 here in the shadow and with the offset of 2x two so we can see them a bit better so let's compile and save and close this down again so now we are ready to code the main menu so we need to code these buttons so when you click on create server it needs to take you to the server creation menu here so let us do that let's open up the main menu and in the graph where we code things let's just delete all of this and here we need the buttons so the first button is create server click on the button and let's rename it up here to button create server and make sure it is variable so you can see it over here else you can't see it if it is not and the second one let's call it button search uh search server you can also call it server browser and the third one let's call it button quit Okay so for the first one the button create server let's click on the plus here for the unclick so what happens when you click on the button and what needs to happen is it needs to open up this menu now we haven't really created these uis through code uh so far so let us do that and usually we create UI inside of the player controller so let's go back to my content let's go to blueprints let's open up the Play controller for the main menu and here let's go to the event graph and now let's delete this one now in the event begin play Let's go ahead and add some code so let's drag and say create widget and now let's click here and search for the widget we want to create let's first create the main menu because we need that as well so let's create the main menu let's right click and promote this to a variable so we have it inside of a variable and let's call this one main menu remember we all uh we also need to add this to the viewport because right now uh inside the main menu when you hit play you can see you can't see anything and this is because we haven't added this to the to the viewport so if you direct from the variable and say add to viewport and you hit that one so now you add it to the viewport now if you hit play you can see you can now see the main menu in the viewport so when you click on this button nothing happens as you can see because we haven't coded it yet so let us do that uh let's drke from here and again say create widget go ahead and select that again and for the next one we want to create if you go back to the UI the server or create server one so let's search for create server choose that promote this to a variable call it create server now we don't really need to add it to the viewport because the main menu is in the viewport and this only needs to show when we press the button so only doing this uh let me just copy this one paste it in and the next thing is the server browser add it in right click promote it to a variable call it WB server browser and the last one is the server Cod but we don't need to create it here because we're going to created another place so everything is looking great here so now let us do the code inside of the main menu inside of here when we create or when we press on the create server button we want to display the create server UI here so we need to communicate with the player controller so what we need to do is right click and say get player controller because the code for this one here is inside of the player controller so what you need to do here get play controller and then say cast to PC because now we're saying we need to the code specifically to our custom player controller which is called PC main menu this is what casting is so we're getting the default player controller then we get the custom player controller we have so cost to our own player controller and from here we can now access this variable we created called create server if I drag from here and say I create server I can see the variable so get this variable and now what we can do is add to viewports so now we can add it to the viewport when we press the button so pressing here you're adding it to the viewport but you also have to remember to remove the old one from the viewport so what we can do is we can before we add this to the viewport if I hold alt and click here to disconnect it and let's remove the main menu first so dragging here taking the main menu one and with this one we can say remove from parents and select this one just like this and go ahead and connect this one now so we're removing the main menu and we're adding the create server let's go ahead and try that clicking on so now my mouse disappears and I have to enable it first so going to the player controller hitting the class defaults and hitting this one show mouse cursor go ahead and compile save everything let's play again and now I can see my cursor all the time clicking on create server now it is working okay everything is looking good now for the next one it is the search server which gives us the server browser so clicking on the button go down and hit the unclick event to create another one or you can simply create it through here as well you can see them here we get the player controller let's just do this again remove the main menu I'm just going to copy this code remove the main menu and we're going to add here the server browser selecting it here add to viewport and now that is working so the last button is quit clicking on this one going down selecting onclick and for this one very very easy just search for quit and select this one quit game so now this is working the server browser is working as well and for the quit button that one is working this Clos as the game so now the main menu is finished let's close it down let's go to the create server now for the back button again click on here you can go to the graph now for the button let's actually change the name first call it button back go to the graph let's delete all of this and let me just go back to the main menu so I can copy the code like this here just copy this this part here and for the button back let's click onclicked paste this again and now let's get the now we are in the create server so let's get the create server and let's remove from parent to remove it from the viewports go connect it and we need to add the main menu now because we're going back to the main menu search for the main menu go ahead and add to viewport select it and now it's working okay so uh what we need to do now is we also need to get the information for the server so if a player writes something we need to get it so for the editable box I usually just write input as a prefix and let's call it server name and for this one the drop box here let's call it CB for combo box and let's call this one amount of slots and let's compile let's over to the graph now and now for the first one for the server name let's choose this one unext changed so whatever the player writes inside of here we need to store this as a variable so I want to store it as a string variable because I need it as a string so to do that uh directag from here and say to string and by the way if you're not used to variables text and string is almost the same they are both text variables so changing it to a string and you can do a lot with a string and I can show you in my in my in-depth course for example a string you can modify it if you just search for string you can see all the things you can do with a string you can trim the name you can also uh replace things so if they write bad words in the server name you can actually replace it and you can chop the words and so on but with a text uh you can't really change it as you can with a string so very very cool so here for this one let's right click and promote this to a variable and call it server name and now let us connect this so whatever the player writes it's going to store that inside of a variable the same thing for the amount of slots let's click on the UN selection changed and here the selected item I'm going to say to int because I want it as a number amount of slots to integer and let's right click promote this to a a variable and call this amount of slots okay let's connect this one like this so now we have those working now for the last button this one let's click on it and call it button create now for this one we need to host the server and now we get into the steam sessions so usually when you create steam sessions you create it inside of something called a game instance so if you open up the blueprints right click here make a new blue print class and inside of here you can't see it here so you have to go down here and you have to search for game instance and here you find it now the reason why we make it in a game instance is the game instance you have one instance of this running all the time when you open up the game and the game instance never shuts down so even though you go into a server you leave a server you go to your shop and so on the game instance is always running so it's more safe to run the server hosting and so on on the game instance so I usually call it GI for game instance and uh call it the name of the game because there's only one game instance in a game so uh steam sessions that's what I'm going to call it and let's enter the uh game instance and before we forget let's also go to edit project settings inside of here let's go to maps and modes and let's change the game instance Def One to the one we just created so GI uh steam sessions now let's close it down and let's save everything and let's go back to the game instance now inside of here let's make a custom event let's right click and search for custom event and this one I'm going to call it host session this is what we're trying to do so not sessions but just session poost session and what we want to use is if you right click and search for create Advanced session this is the steam one if you hit it it's a very long one very confusing maybe if you haven't seen it before but it's super easy to use so let us just go ahead and connect it so we're trying to create this session here now for the extra settings I want you to drag from here and say make array so we when you do make array you simply break down this array so you can see what is inside of it and here again you can drag and say make and I want to say make literal session property string so this is because I want to give it a server name so here in the key let's say server name in The Host session we're going to run it from the create server over here when on the player so if you click on the create button and you go down again hit the unclick so when the uh player hits the create button it runs this host session so now it needs to take this information server name the player has chosen the server name so what I'm going to do here I'm going to drag this into the event and call it server name and let me just compile and go back to the create server so you can see what it looks like now here again we are communicating with the steam sessions game instance so what I can do here now uh let's go down and say get game instance and not this one again get game instance and it's this one for the game and let's drag again and say cast two because I need to use this one now uh if you have taken my previous courses before uh you know that casting is not always good to use all the time because it creates hard references uh and hard references usually loads in Unreal Engine as the first thing when you open up a game so sometimes you see a main menu that takes like 20 seconds to load before the game starts and this is because one of the reason is you use too many hard references casting and again you can take a look at my other courses where I use something called blueprint interfaces a lot better to use but for now s not to make it too advanced let's do this so casting to my game instance I can now use everything inside of this including this event so if I just drag from here and say post session so now I can use this and here you can see I have the server name option and this is because I added this variable to my event so now I can set the server name from there I also need to set the amount of players so let's drag the public connections into here call this one amount of slots and you can always make it cleaner like this and you can double click on the line like here double click and for the player controller just say get player controller and use it here and the reason why we use the single player controller and not the multiplayer is because in the main menu you are still in single player so you are not in multiplayer when you are in the main menu even though you are in a multiplayer game the the the multiplayer part starts when you join the server so here we host the session server name is just the variable we created before up here and the amount of slots is over here as well so let's drag this into here and let's drag this one as well into here so now we are hosting a session and let me take a look if we forgot anything so when you host a session now on success let's drag here and let's open level so when we finish hosting our game let's join the level and for this one uh I think it's the third person map I'm not sure let's just take a look here if I go to third person Maps yeah I think it's the the third person map so let's use that one third person map and remember you have to click on the arrow down here and for the option you have to write listen so remember to do that go ahead and compile and save everything so now we can try to test it out if you hit uh play and you can click on create server you can choose whatever your name is here and amount of slots and you can hit create and now this should take you into the game and and you are in multiplayer now we have to uh make the server browser as well before the other player can see it let's open up the server browser now and let's open up the graph and here let's just remove all of this now when we hit the back button just like before call it button back and let's go back to actually let's change the name as well for this one and now button refresh and let's go back to the graph and inside of here for the back button let's click it and just like before I'm going back to the main menu I'm going to the graph copying this code here uh where we this code here let's paste it and let us connect it and I'm going to drag here and now we are in the server browser so we need when we click on back we need to close the server browser so if you search for Server uh server browser and remove from parent now you need to add the main menu once again so main menu and you need to add to parent or add to viewport we adding this to viewport so now this works the next thing is the refresh button so hitting onclicked again so when you click on the refresh button now we need to use the note called uh if you search for find sessions and it's not this one so it's not this one here but it is if you a session so it's this one uh from Steam called find sessions Advanced selecting it here this one is from Steam and let's go ahead and connect it now before you do this you have to remove the old servers as you refresh it first time you add a server but when you refresh it the second time you have to remove the old servers so to do this we have to use the server list as a variable so clicking the server list selecting is variable so you can see it in the gra so here let's take this variable drke from here and say clear children so we're going to clear all of the children child components that is inside of here let's go ahead and connect it for the player controller I'm going to say get player controller go ahead and select it and for the Max results amount of servers I'm just going to write 999 and everything is good now un success when we find a session I want to Loop through the sessions that I found and add them to the list so let's direct from here and say for each Loop s like this one for each Loop and for each what for each session so these are the sessions so let's go ahead and connect them so this is the result the that we found so now for each session I want to create a widget which is remember we created this server Cod so I want to create a server card for each session I find and I want to add this session to the server card so we actually need to do something now in the server card so let's open up the server card inside of the graph let's click on this variable and say found session and let's search as a as a variable type search for blueprint session result go ahead and select this compile and remember to hit instance editable expose on spawn what that does is if you go back to the server browser now and you hit file uh let's see here file refresh all notes you will now see this one here because you pressed instance editable Expose and spawn so now you can connect this session you found and store it into a variable inside of here because we need it later to join the server when you press uh when you press the button here you you need to join the server so now we store it inside of here so when we find sessions for each of the session we find we create a server Cod and remember we need to add this server card to the vertical box you drag this vertical box and say add child and then you connect it here and the content is just this one so now it is going to add all of the found sessions here okay let's compile compile and save everything let's actually see if it works before we continue so I need to run multiplayer I need to click up here number of players is two and net mode net mode is play as listen server and so now it opens up to if I click up here the second one is on my second monitor so let me just minimize this one here and maximize this a bit so the first one is going to create a server it's called going to be called hello now it's not going to display the correct name because we haven't done that yet so let's do this and say create now on the second one if I say search server and I click on refresh I'm going to Ed a bit because it takes some time sometimes to find servers and once it finds a server it should display it down here and here you can see in the server I can see the server here I need to fix the UI because it's bugging I haven't set the resize or the size for the pressed and hovered button state but here you can see now we need to fix the server name to be displayed correctly the players and the Ping as well so let's close this down and let us continue now for this era it says that only local player controllers can be assigned to widgets so let's go back to the player controller main menu and here in the begin play when we create all of these widgets now you can do this by creating it through a client sided event however for this example I can just right click here and say is local player controller go ahead and select this one and just making sure it's a local player controller that creates all of those uh make a branch and go ahead and connect it so if it is a local player controller go ahead and create the UI for your own game here and it's only bugging out because I'm running multiple instances of the game it's not going to bug if you're running the game and I'm running the game it's going to run just fine but now the errors will be gone when you have added those here so let's close all of this down and let's open up the server card so now inside of here we want to dynamically change these values so the first one is the server name and I'm going to hit here call it text uh server name it is variable so I can see it over in the graph and let's click on the second one call it text amount of we can just call it amount of players and hit is variable and the last one is called ping and hit is variable and the button behind all of it here if you hit this button we can call this button join server so now we have it all here and we're making sure that it is the visibility is not visible it is non hit testable for all of these text and let's go go back to the graph now let's delete all of this okay so what we need to do here is we first need to get the server name and how do we do this remember inside of the game instance if I go back to blueprints open up my game instance here remember we made this one called extra settings so this is what we're going to use let's make a new function first so here in functions click on the plus let's call this one get extra settings we're going to get the settings here get extra settings so inside of here let's take this found session let's direct from here and say get extra settings and now from these settings we can say get session and now you can get all of the values you create over here remember it is not only a string that you can create but you could have clicked on the plus and you could say make literal and choose choose for example a number of load and so on uh but we only have the server name so I'm going to go back to my server card drag here and say get session property string it is a string it is a server name and you have to name it the same as what you called it over here in this key I'm going to copy this going back to the server Cod and pasting it here I'm going to make a return node for my function add return node and drag this into here and call call it the server name so if I go back to the event graph here I want to use the event construct event and this is just the same as uh event begin play in all of the other blueprints but in UI it is called event construct so whenever uh we create the server Cod remember we did that I go back to the UI and I open up the server browser whenever I click refresh I create a server Cod for every session I find so whenever I create a server card it's going to run my event construct and every time I see a session I want to get the extra extra settings here that I got here and here we can now set the text name or or the server name so if you click on this text we already called it server name so over here server name I'm going to drag it and say set text and go ahead and choose set text and now we can just set it to this value here okay so that text name is finished so the next one is the amount of players so let's take this text here and let's drag and say set text go ahead and select it now the amount of players we have to use this found session again so if you drag it out we can say get current players so how many is in the server and get max players how many can be in this server now uh you can see here that these are two Dynamic values when you have two Dynamic values inside of one text node here what you can do is you can use something called format text you can use this one and now for this format text uh how you write it is you write it as a curly curly bracket and let's just call this one current players and now you close the curly brackets and now we need a slash because we have this here in the name we have the slash here and here after the slash let's make curly brackets again and let's call This One Max uh max amount of players and let's remember to finish it with a curly bracket so close it up and now you see whenever you make curly brackets you get new entry points and you can plug in the variables here current players and the maximum amount of players for the other one want now is the MS so the Ping go ahead and click on it h drag this ping set text just like before go ahead and set text now for the Ping let's use the found sessions again copy and paste it here and get ping in Ms now again I have to use format text because I need the number and the MS text behind it so let's drag from here and say format text and just like before let me make a curly bracket and this is the Ping variable that's going to be in there and I'm just going to write Ms at the end because I need that text and plug it in here organize it like this okay so now you have all of this done the final thing we have to do is click on this button join server and click on unlicked so when you click on the join server we need to use this one called join session so search search for join session the player controller is just the get player controller so just the local player controller go ahead and select it and now for the search results is just this the found session here go ahead and connect this compile and save everything I have to go back to create server because we actually need to have default values for these because these are never set if the player Just Hits create server and then creates here they have never entered anything here and if they don't do anything this will be empty and your game will bug so we actually have to do something in the event construct so when you begin playing the game let's just take this input server name here and let's say get text and go ahead and select get text and let's take the server name here and hold alt and drag to set it go ahead and do this so whenever uh the player enters the menu you have this my server so if I go over you have this my server stored inside of this variable so let's do the same thing with this the amount of slots so drag this combo box and selected option search for that get selected options or option and let's drag this amount of slots in here and set it as well so now it is not going to Buck also uh if you want to refresh so if you want to refresh the server browser right when you enter uh the first time instead of pressing refresh the first time uh you can do that as well so let's go to the server browser and we have this one called button refresh but you can also make a custom one and right click and say custom event custom event and you can call it refresh server so you can actually run it like this as well so let us do that let me right click event construct so whenever we open up the server browser we automatically uh refresh the server here just like this okay so let us compile now and let's click on play and let's test everything out so if I create server here I call it for example uh haha uh 1 12 three and the amount of slots is 16 let me hit create now I am in the game so now I'm waiting for my friend and the friend is going to say search server and it's going to automatically refresh it's going to take a bit of time to find the server but once it finds the server it should have the correct name which is Haha one 12 three one player is connected out of 16 and the MS is 37 Ms now when I click on it I should join the server and I do I can see the other player over there and the other player can see me as well so now we are connected in multiplayer and steam has connected so now that everything is working let's go ahead and package the project so you can send it to your friend so here clicking on platforms go to Windows and here you can package the content so go ahead and package the project and select where you want to package it I'm just going to package it to my desktop so here I'm going to make a new folder called packages and let's enter this folder and click select folder now it's good to show the log so if you press show output log I like to have it up so instead of doing this I'm going to click on window and output logs so I have it up all the time like this and I usually what I look for is here you can see when it is finished sometimes it does take some time so I'm actually going to pause this video and wait until this is finished right so now you can see the package is complete and everything is finished and if I go into the packages folder uh in my desktop Windows here you can see the steam sessions my game that I've created and steam is working inside of here now to send it to your friend go ahead and select everything right click and in WinRAR if you don't have it go ahead and download it but simply add it to Archive make it into a zp folder and I can just call it my game for example Le go ahead and click okay now this zip folder that you have created go ahead and upload it to for example Google drive or on a USB give it to your friend and your friend can now open this up you can open it up and you can connect together again just make sure that you have steam running when you're are doing this because if you don't have steam running it's not going to work that was it uh for now this is how you connect Ste multiplayer and again make sure to check out my website ginstr I create a lot of courses including a more in-depth on how you can Implement More Steam features such as adding Lan adding multiple game modes adding maps and all of these cool features a friend list I'll probably add that as well in the future if I haven't done so already the time you're watching this video and thank you so much for watching Remember to comment down below if you need any help and hit like on this video subscribe uh to support me and to view more of these courses and I hope to see you in the next one

Channel: Pixel Helmet

Views: 15,222

Keywords: unreal engine 5 steam multiplayer, steam advanced sessions ue5, steam advanced sessions, unreal engine 5 steam multiplayer tutorial, unreal engine 5 multiplayer, steam advanced session, advanced session steam, seamless travel, steam integration, ue5 multiplayer, steam multiplayer unreal engine 5, unreal engine 5 steam subsystem, unreal engine 5, niceshadow, ue5 steam multiplayer, ue5 multiplayer lobby, steam ue5, ue5 steam advanced sessions, ue5 steam multiplayer tutorial

Id: E2okoXqsXNc

Length: 72min 30sec (4350 seconds)

Published: Sun Nov 12 2023