In the menu bar in the upper menu, click on Extensions, then on Module Manager. This will open a window that will show you all your modules. If some are missing, go to the bottom of the page, and make sure the Show ___to a page is set to show All. This will bring them all up for you to view.
Manager page, scroll right and click on New. From the list of available new modules, select Custom HTML. Scroll right, and click on Next. On the Module edit form, start by entering a title for your new Module. The next option is Show Title. If this is set to Yes, the module name will be displayed on the front-end. Scroll down to the text box. In the icons for the editor, you will see a small HTML icon. Click on this icon. This gives you an HTML Source Editor box. Enter your HTML code here. When you are done, click update in the lower left corner. Scroll up, and in the right hand column you will see a section called Parameters. Where it says Module Class Suffix, enter the suffix for the CSS class of this module, such as -html. For example, the CSS class name of this module could be .example-html. Click the save button in the upper right corner, and the custom HTML module will now appear on the front-end.
That is the end of this tutorial. You now know how to add custom HTML to your Joomla site.