[Tutorial] Custom HTML module - Some tricks you should know

Firstly, same as another plugins, you must create Custom HTML module from Joomla! back-end. In admin UI, access to Extensions > Modules > Add > Custom

1. Adding CSS & Javascript

By default, the Joomla editor will strip all tag contain CSS and Javascript content. So, you need turn off it first. If you site is using TinyMCE, access to Plugin manager > Editor - TinyMCE > Use Joomla text filter > Yes > Save.
In Global Joomla setting, the administrator can use these special tags(style, script, iframe...). If you're not using any editor (textarea), you can skip this step.

Now, refresh your module and enter your code to here. For stylesheet is:

    <style>
        // Your code here
    </style>

For javascript:

    <script type="text/javascript">
        // Your code here
    </script>

For iframe (Youtube example):

<iframe width="560" height="315" src="https://www.youtube.com/embed/xxxxxx" frameborder="0" allowfullscreen></iframe>

2. Using Joomla! Content plugin

In order using Joomla Content plugin, you need enable Prepare Content firstly:

Access to Plugin manager < Set Type is Content to see list plugin support.

Noticed that some plugin is restric for Article type, so you couldn't use it. Normally, you should choose a module has feature support insert something (image, video, code...). You can find these modules in JED

In this example, I will use Content - Load Modules plugin:
Okay, now I will use syntax {loadmodule mod_login} to insert login module. Then, I will add some CSS to markup for this module :)