Create Category Widget
Let's Do a Demo Here...!
Step 1. Firstly Go to Your Blogger Dashboard And Click on "Layout" Section.
Step 2. In The Layout Sidebar, Click on Add a "HTML/Javascript" Gadget. (Add the gadget of the top section)
Step 3. After adding the gadget add the below provided widget code in the content box.
Step 4. After paste the code, Save it.
When you are finished customizing your top category widget, Click Save.
You may want to read this post :
Category Widget Style 1
<!--- Category Style 1 By abdullahcoded.blogspot.com ---> <div class="tags-wrapper"> <div class="menu-cat" id="menu-cat"> <div id="header-social"> <a href="/" rel="noopener"><span class="headbt bollywood"> Bollywood Movies </span></a> <a href="/" rel="noopener" target="_blank"><span class="headbt Abdullahcoded"> Hollywood Movies </span></a> <br/> <a href="https://t.me/Freemium_Tech"><span class="headbt buttontg"><i class="fa fa-telegram"></i> Join Telegram </span></a> <a href="/how-to-download/"><span class="headbt howtodl"> How To Download <i class="fa fa-eye"></i> </span></a> </div> <a href="#"><span class="headbt Abdullahcoded">720P HEVC MOVIES</span></a> <a href="#"><span class="headbt Abdullahcoded">DUAL AUDIO</span></a> <a href="#"><span class="headbt Abdullahcoded">HINDI DUBBED</span></a> <a href="#"><span class="headbt Abdullahcoded">BANGLA MOVIES</span></a> <a href="#"><span class="headbt Abdullahcoded">WEB SERIES</span></a> <a href="#"><span class="headbt Abdullahcoded">TAMIL MOVIES</span></a> <a href="#"><span class="headbt Abdullahcoded">MALAYALAM MOVIES</span></a> <a href="#"><span class="headbt Abdullahcoded">TELUGU MOVIES</span></a> <a href="#"><span class="headbt Abdullahcoded">ENGLISH SUBTITLE MOVIES</span></a></div></div> <style>.tags-wrapper{margin:0 auto;}.tags-wrapper .widget-content{position:relative;margin:15px auto 0;}.tags-wrapper .menu-cat{text-align:center;}.tags-wrapper .menu-cat li{position:relative;display:inline-block;margin:0;}.tags-wrapper .menu-cat li a{background-color:#df133c;text-transform:uppercase;border-radius:15%;color:#fff;padding:5px 5px;text-align:center;text-decoration:none;display:inline-block;font-size:14px;margin:4px 2px;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;min-width:70px;box-shadow:0 0 32px -10px #fe0000;}.tags-wrapper .menu-cat li a:hover{}.headbt{font-family:poppins,sans-serif;color:#fff;padding:10px 15px;text-align:center;text-decoration:none;display:inline-block;font-size:14px;margin:5px 1px;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;box-shadow:0 0 32px -10px #fe0000;}.bollywood{background-color:#44b81a;text-transform:uppercase;border-radius:15%;font-weight:500;}.Abdullahcoded{background-color:red;text-transform:uppercase;border-radius:15%;font-weight:500;}.buttontg{background-color:#009DE1;text-transform:uppercase;border-radius:15%;}.howtodl{background-color:#DF9A17;text-transform:uppercase;border-radius:15%;}</style>
Category Widget Style 2
<!--- Category Style 2 By abdullahcoded.blogspot.com ---> <div class="s2"> <div class="tags-wrapper"> <div class="menu-cat" id="menu-cat"> <ul><li><a href="/search/label/720p?&max-results=18">720p HEVC Movies</a></li> <li><a href="/">Dual Audio</a></li> <li><a href="/search/label/Hindi%20Dubbed?&max-results=18">Hindi Dubbed</a></li> <li><a href="/search/label/Tv%20Series?&max-results=18">Hindi TV Shows</a></li> <li><a href="/search/label/Tv%20Series?&max-results=18">WEB Series</a></li> <li><a href="/search/label/WWE?&max-results=18">WWE</a></li> <li><a href="/search/label/Tv%20Series?&max-results=18">WEB Series</a></li> <li><a href="#">Hindi Dubbed</a></li> <li><a href="#">Hindi TV Shows</a></li> <li><a href="#">Hollywood Movies</a></li> <li><a href="#">Malayalam Movies</a></li> <li><a href="#">Multi Audio</a></li> <li><a href="#">Pre Release</a></li> <li><a href="#">Tamil Movies</a></li> <li><a href="#">Telugu Movies</a></li> <li><a href="#">Bollywood Movies</a></li> <li><a href="#">WEB Series</a></li></ul></div></div></div> <style>.s2 .tags-wrapper .widget>.widget-title{display:none}.s2 .tags-wrapper{margin:0 auto;}.s2 .tags-wrapper .widget-content{position:relative;margin:15px auto 0;}.s2 .tags-wrapper .menu-cat{text-align:center;}.s2 .tags-wrapper .menu-cat li{position:relative;display:inline-block;margin:0 2px 4px 0;}.s2 .tags-wrapper .menu-cat li a{display:block;height:35px;background-color:#ff8428;color:#ffffff;font-size:15px;line-height:35px;font-weight:500;padding:0 15px;border-radius:0px;transition:all .17s ease;box-shadow:0 1px 1px rgba(204,197,185,.5);}.s2 .tags-wrapper .menu-cat li a:hover{backgroulnd-color:#383838;color:#ffffff;box-shadow:5px 5px #009d51;-ms-transform:scale(1.1);-webkit-transform:scale(1.1);transform:scale(1.1);transition:all .17s ease;}</style>
Category Widget Style 3
<!--- Category Style 3 By abdullahcoded.blogspot.com ---> <div class="s3"> <div class="tags-wrapper"> <div class="menu-cat" id="menu-cat"> <ul> <li><a href="/">720p HEVC Movies</a></li> <li><a href="/">Dual Audio</a></li> <li><a href="/">Hindi Dubbed</a></li> <li><a href="/">Hindi TV Shows</a></li> <li><a href="/">WEB Series</a></li> <li><a href="/">Bollywood Movies</a></li> <li><a href="/">WEB Series</a></li> <li><a href="#">Hindi Dubbed</a></li> <li><a href="#">Hindi TV Shows</a></li> <li><a href="#">Hollywood Movies</a></li> <li><a href="#">Malayalam Movies</a></li> <li><a href="#">Marathi Movies</a></li> <li><a href="#">Mobile Movies</a></li> <li><a href="#">Multi Audio</a></li> <li><a href="#">Pakistani Movies</a></li> <li><a href="#">Mobile Games</a></li> <li><a href="#">Pre Release</a></li> <li><a href="#">Punjabi Movies</a></li> <li><a href="#">Tamil Movies</a></li> <li><a href="#">Telugu Movies</a></li></ul></div></div></div> <style>.s3 .tags-wrapper .widget>.widget-title{display:none}.s3 .tags-wrapper{margin:0 auto;}.s3 .tags-wrapper .widget-content{position:relative;margin:15px auto 0;}.s3 .tags-wrapper .menu-cat{text-align:center;}.s3 .tags-wrapper .menu-cat li{position:relative;display:inline-block;margin:1px 1px;}.s3 .tags-wrapper .menu-cat li a{display:inline-block;padding:6px 18px;line-height:1;border:1px solid white;background-color:teal;color:white;font-weight:500!important;margin-bottom:3px;margin-top:3px;border-radius:5px;}.s3 .tags-wrapper .menu-cat li a:hover{transition:all .50s ease;border-radius:50px;background:none;border:1px solid red;color:red;}</style>
That's done. 👍🏻 Your top category widget will now be displayed on your blogger.
Conclusion
This is all about making a Contact Form using Telegram Bot API. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in .
Copyright ©