Hướng dẫn sử dụng tiện ích LinkList tạo Menu đa cấp cho blogspot

<b:section id='main-menu' maxwidgets='1' name='Menu' showaddelement='yes'>

</b:section>

<script>

    //<![CDATA[

    $('#main-menu').each(function() {

        var iTms = $(this).find('.LinkList ul > li').children('a'),

            iLen = iTms.length;

        $('#main-menu ul').addClass('menu');

        for (var i = 0; i < iLen; i++) {

            var i1 = iTms.eq(i),

                t1 = i1.text();

            if (t1.charAt(0) !== '_') {

                var i2 = iTms.eq(i + 1),

                    t2 = i2.text();

                if (t2.charAt(0) === '_') {

                    var l1 = i1.parent();

                    l1.append('<ul class="sub-menu m-sub"/>');

                }

            }

            if (t1.charAt(0) === '_') {

                i1.text(t1.replace('_', ''));

                i1.parent().appendTo(l1.children('.sub-menu'));

            }

        }

        for (var i = 0; i < iLen; i++) {

            var i3 = iTms.eq(i),

                t3 = i3.text();

            if (t3.charAt(0) !== '_') {

                var i4 = iTms.eq(i + 1),

                    t4 = i4.text();

                if (t4.charAt(0) === '_') {

                    var l2 = i3.parent();

                    l2.append('<ul class="sub-menu2 m-sub"/>');

                }

            }

            if (t3.charAt(0) === '_') {

                i3.text(t3.replace('_', ''));

                i3.parent().appendTo(l2.children('.sub-menu2'));

            }

        }

        $('#main-menu ul li ul').parent('li').addClass('has-sub');

    })

    //]]>

</script>

<link crossorigin='anonymous' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css' integrity='sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==' rel='stylesheet'/>

.menu a{width:100%}

.menu::after{content:'';clear:both;display:block}

.menu a{display:block;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box;text-decoration:none;font-size:20px}

.menu li{position:relative}

.menu > li{float:left}

.menu,.menu ul{display:inline-block;padding:0;margin:0;list-style-type:none;background:gold}

.menu ul li+li{border-top:1px solid #fff}

.menu ul{position:absolute;box-shadow:5px 5px 10px 0 rgba(0,0,0,0.5)}

.menu > li ul,.menu ul ul{opacity:0;-webkit-transition:all 0.2s ease-in;-moz-transition:all 0.2s ease-in;transition:all 0.2s ease-in;z-index:-1;visibility:hidden}

.menu > li ul{top:130%;left:0}

.menu ul ul{left:130%;top:0}

.menu ul a{width:250px}

.menu > li:hover > ul{top:100%;opacity:1;z-index:1;visibility:visible}

.menu ul > li:hover > ul{left:100%;opacity:1;z-index:1;visibility:visible}

.menu-gold,.menu-gold a{color:#000}

.menu-gold a:hover{background-color:#e6c300;color:#000}

#main-menu ul > li.has-sub > a:after{content:'\f078';float:right;font-family:'Font Awesome 5 Free';font-size:9px;font-weight:900;margin:8px 0 0 5px}