Latest

Widget and Settings in Lantro UI v2.0

Explore widgets and settings in Lantro UI v2.0, including customization options, theme features, Firebase setup to personalize your Blogger.
Thumbnail

Blogger templates have evolved beyond simple layouts, and Lantro UI v2.0 introduces powerful widgets and flexible settings to improve both design and functionality. Whether you want better customisation, enhanced user experience, or more control over your blog’s appearance, Lantro UI v2.0 offers a range of built-in options to explore. In this article, we’ll take a look at the widgets and settings in Lantro UI v2.0 and how they help you customise your Blogger website with ease.

Table of Contents

(Header) widget

From this widget, you can edit your site header logo, site description, etc. Replace https://cdn.coshix.in/Icons/lantro-ui-logo.webp with your website logo URL or choose "Upload image from computer". Change Blog description to set sub text near header title, e.g.: .in

After all changes have been made, click "Save"

Mobile Extra Menus widget

This helps you to change the mobile menu's bottom sub-links. Edit the link lists in it with your links.

After all changes have been made, click "Save"

Social Media Links widget

This helps you to add social media links to the mobile menu's bottom. Always add the social media name in the first capital letter form (e.g., GitHub) to detect the icon; otherwise, it shows a round circle.

After all changes have been made, click "Save"

Navigation Menu widget

This is for editing the navigation menu of the theme. The default "Navigation Menu" widget is only editable from HTML, so edit it from Edit HTML, or disable it and use "Navigation Menu (Layout)" and add your links.

After all changes have been made, click "Save"

Header Icons widget

This widget helps you to remove or change the order of viewing header icons. Arrange the text list as you like.

After all changes have been made, click "Save"

Latest or ticker widget

From this widget, you can control the number of posts shown in the ticker and the badge name in the ticker. Change "Title" Latest With your text to change the ticker badge text. Change 8 in the "Content" section with the number of posts you want to display in the news ticker.

After all changes have been made, click "Save"

Hero Posts widget

From this widget, you can control the number of hero posts you want to show on the homepage. Change 7 In the "Content" section, change the number of posts shown in the hero post section at the top.

After all changes have been made, click "Save"

Follow by email widget

From this widget, you can change the follow by email widget texts and action link. Click pencil_icon near the first link list. Now you can edit the Follow by email text in the widget, changing the Site name Follow by email with your text, and you can change the default description by replacing the Site URL section's Get latest posts directly in your inbox. No spam, only useful content. text with yours.

After all changes have been made, click "Save"

Click pencil_icon near the second link list. Now you can edit the Subscribe button text by changing Subscribe, then change Site URL

https://api.follow.it/subscription-form/QXNrblVINVp5QzgvZ1pNNnIzc0FtMWErU1JDWHhmdithdUhDdjRXOUp2MitQTkowaUR6eUJ5Y3lTZjZxeFZmYWhxbWFIWUdGWFZJZitYbURTZ0gzSEt1aFZ0aDJiKzZ2cGJxM0dJeFhjcVZ5cjA0ck1ObEVWZzVYMDZiTVVqRHB8MUlrWWtQV24yWFAxd1JtMm5MSTB6aWw5RkYzMFpqK1RvYjZ1L3FYMCsybz0=/8
with yours.

After all changes have been made, click "Save"

How to get action URL

  1. Visit follow.it
  2. Click "Set up your feed"
  3. Click "From my website or RSS feed (automatically" button
  4. Type your blog URL, e.g.:https://yourblog.blogspot.com
  5. Click the "Continue" button
  6. Choose the "Already have a form?" tab
  7. You get something like this below
  8. <form action="https://api.follow.it/subscription-form/your_id_come_here=/8" method="post">
  9. The marked position is your ID. Copy it

This is your action URL.

Categorised Post widget

This widget helps you to change the categorised posts shown on the homepage. Change Number of items show in list 2 to the number of categories you need to show. Add the exact same label name to the text list to show posts of that label.

After all changes have been made, click "Save"

footer-widget-1,2,3,4,5

Using these widget sections, you can add links to your website footer. In the Made with ❤️ in India widget, replace Made with ❤️ in India With your text to replace the top footer sub text, Change Coshix with your blog name or other, as you like, change Lantro UI is a performance and UI focused template for Blogger platform. to replace the footer description.

Custom Credit widget

This widget helps you add a custom footer credit to the theme and add your custom footer credit text to replace the default one.

Warning: Don't use this widget in the free version of this theme, or it creates a redirection.

Back to Top widget

This widget helps you to choose the style of the back to top button in Lantro UI by default, "Top" is set as first, so it shows a normal footer attached to the back to top button. Make "Top Sticky" the first to show the floating back to top button.

After all changes have been made, click "Save"

Cookie Consent widget

This widget helps you to change cookie consent text, link, etc. First, click pencil_icon near the Text link list, then replace it We use cookies to enhance your experience, serve personalized content, and analyze traffic. with your cookie consent text, then click Save. Now click pencil_icon near Cookie Policy, then edit Cookie Policy with your policy link text, then change /p/cookie-policy.html with your link to edit policy link, then click Save. Now click pencil_icon near Accept, then edit the Accept text to change the accept button text, then click Save.

After all changes have been made, click "Save"

Firebase Configuration widget (Premium)

Currently, this widget is only for the like and dislike feature on posts. Edit this only if the " like and dislike feature is enabled from the Blogger Customizer; otherwise, ignore it. By default, you get code something like below given. Replace it with your Firebase config info.

apiKey:"replace_with_your_api_key",
authDomain:"replace_with_your_auth_domain",
projectId:"replace_with_your_id",
messagingSenderId:"replace_with_your_sender_id",
appId:"replace_with_your_app_id"

After all changes have been made, click "Save"

How to get this Firebase config info and configure it properly in Firebase?

  1. Go to Firebase Console and create a new project.
  2. Click the Web (</>) icon, register your website, and create a web app.
  3. After registration, copy these values from the Firebase config:
    apiKey
    authDomain
    projectId
    messagingSenderId
    appId
    
  4. Paste these values inside the template’s Firebase Configuration widget.
  5. If you need the details later, open Project Settings → General to find your config again.
  6. Open the Firestore Database from the Firebase sidebar and click Create database.
  7. Select Start in test mode, choose a database region and create the database.
  8. Open the Rules tab in Firestore and replace the default rules with:
  9. rules_version = '2';
    service cloud.firestore {
      match /databases/{database}/documents {
    
        match /postLikes/{postId} {
          allow read, write: if true;
        }
    
        match /postViews/{postId} {
          allow read, write: if true;
        }
    
      }
    }
  10. Click Publish to save the Firestore rules.

Back to Home (error page) widget

This widget is for editing texts in the error page. Chang Title Back to Home To change the homepage button text in the error page, change Something Wrong! With your text to change the 404 page's large title, change The page you've requested can't be found. Why don't you browse around? to change the description of the error page.

After all changes have been made, click "Save"

Hi, I’m Shiva E S — the creator of Coshix. I enjoy building websites, and sharing simple tutorials that help people solve real problems easily.

Instagram · GitHub