How to Use it

 

Nexus Pro — Complete Theme Configuration Guide

Welcome to Nexus Pro, a feature-rich Blogger theme designed for modern content websites, magazines, blogs, and editorial sites.

This guide explains how to configure the navigation menu, dynamic homepage sections, post features, comments, system settings, footer, and category feeds — all directly from the Blogger Layout panel.


1. Mastering the Navigation Bar

The main navigation bar is controlled by the Main Menu (LinkList1) widget in Blogger's Layout editor.

Navigation Structure

┌─────────────────────────────────────────────────────────────────────────────┐
│ Logo   Home   Symbols   Know My Age   AI Fancy Text   AI ▼   Search   Theme │
└─────────────────────────────────────────────────────────────────────────────┘

Adding or Reordering Menu Items

To add a normal navigation link:

  1. Open Blogger Dashboard → Layout.

  2. Find the Main Menu widget (LinkList1) inside the Header_Nav section.

  3. Click the Edit ✎ icon.

  4. Add a new menu item.

  5. Enter the following:

Site Name / Link Name:
The text visitors will see in the menu.

Example:

Symbols

Site URL:
The destination URL.

Example:

https://www.symbolstocopyandpaste.com/
  1. Drag the items to change their order.

  2. Click Save.


Creating Dynamic Mega Menus

Nexus Pro includes an automatic Mega Menu Engine. You don't need to write HTML, JavaScript, or shortcode code to create a post-based dropdown menu.

Simply add _mega to the menu item name.

Example

Menu ItemURLResult
AI_mega# or /search/label/AIDisplays a 4-post AI grid
Story_mega# or /search/label/StoryDisplays a 4-post Story grid
Psychology_mega# or /search/label/PsychologyDisplays a 4-post Psychology grid

What Happens Automatically?

Automatic Title Cleanup
The _mega suffix is hidden from visitors.

For example:

AI_mega

is displayed as:

AI

Live Post Fetching
When the visitor opens the menu, Nexus Pro retrieves the latest published posts from the corresponding Blogger label and displays:

  • Post thumbnail

  • Post title

  • Publication date

The menu is populated automatically using the Blogger JSON feed.

Important

Make sure the label used in the menu exactly matches the Blogger label.

For example:

AI_mega

should correspond to the Blogger label:

AI

2. Mobile Navigation

Nexus Pro automatically converts the desktop navigation into a mobile-friendly off-canvas navigation drawer on smaller screens.

Mobile Features

☰ Hamburger Menu
Opens and closes the navigation drawer with a smooth animation.

Overlay Close
Tapping outside the drawer closes it.

Escape Key Support
Pressing Esc closes the navigation drawer on supported devices.

Focus Management
Keyboard focus is returned to the menu trigger when the drawer closes.

Mobile Mega Menu Behavior
Mega-menu items become direct category links on mobile.

For example:

AI_mega

becomes a direct link to:

/search/label/AI

This gives mobile visitors a simple way to access the category without loading a large desktop-style post grid.


3. Dark Mode & Live Search

Dark / Light Mode

The theme includes a built-in dark/light mode switch.

The theme changes its color system using CSS Custom Properties such as:

--bg-primary
--text-primary
--border-color

The visitor's preference is saved using localStorage, allowing the selected appearance to persist between visits.


Live Search

Clicking the search icon expands the search interface.

Visitors can then enter a search query to find content on the blog without leaving the current page.


4. Configuring the Dynamic Homepage Builder

Nexus Pro includes a Dynamic Homepage Builder that allows you to create different homepage sections directly from Blogger's Layout editor.

You can change the content source, layout style, and number of posts without modifying the theme code.

Available Homepage Layouts

1. HERO

┌─────────────────────────────┬───────────────────┐
│                             │ Side Post 1       │
│     Featured Main Post      ├───────────────────┤
│                             │ Side Post 2       │
└─────────────────────────────┴───────────────────┘

Best for highlighting important or featured content.


2. FULLWIDTH

┌───────────────────────────────────────────────────┐
│                                                   │
│       Full-width Featured Post / Carousel        │
│                                                   │
└───────────────────────────────────────────────────┘

Best for creating an immersive featured-content section.


3. HIGHLIGHT

┌──────────────────────────┬────────────────────────┐
│                          │ • Post item 1          │
│      Large Feature       │ • Post item 2          │
│         Card             │ • Post item 3          │
└──────────────────────────┴────────────────────────┘

Best for combining one large featured article with smaller articles.


4. GRID

┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
│ Card 1   │ │ Card 2   │ │ Card 3   │ │ Card 4   │
└──────────┘ └──────────┘ └──────────┘ └──────────┘

Best for category-based article collections.


5. LIST

┌────────┐  Article Title
│ Thumb  │  Publication Date
└────────┘

┌────────┐  Article Title
│ Thumb  │  Publication Date
└────────┘

Best for compact article lists and secondary sections.


5. Homepage Section Configuration

Each dynamic section is controlled through a LinkList gadget.

SectionWidgetRecommended StyleRecommended Count
Home_HeroLinkList101hero3
Home_FullWidthLinkList102fullwidth4
Home_CategoriesLinkList103highlight5
Home_VideosLinkList104grid4
Home_Dual_LeftLinkList105list3
Home_Dual_RightLinkList106list3
Home_CurrencyLinkList107grid4

6. How to Configure a Homepage Section

For each dynamic homepage widget:

  1. Go to Blogger Dashboard → Layout.

  2. Locate the desired homepage section.

  3. Click Edit.

  4. Set the Gadget Title.

For example:

Latest in AI

or:

Trending Stories
  1. Add these three configuration items to the LinkList.

Item 1 — Content Label

Name: label
URL: AI

The URL value must match your Blogger label.

Examples:

AI
Psychology
Self Help
Story
India
Currency

Item 2 — Layout Style

Name: style
URL: hero

Available styles:

hero
fullwidth
highlight
grid
list

Item 3 — Post Count

Name: count
URL: 4

This determines how many posts the section displays.

For example:

3
4
5
6
  1. Click Save.

Nexus Pro will automatically read these settings and build the corresponding homepage section.


7. Example Homepage Configuration

Suppose you want a section titled Latest in AI with four AI articles displayed in a grid.

Configure the widget like this:

Gadget Title:
Latest in AI

Item 1
Name: label
URL: AI

Item 2
Name: style
URL: grid

Item 3
Name: count
URL: 4

The theme will automatically fetch the latest posts carrying the AI label and display them using the selected grid layout.


8. Dual-Column Homepage Sections

Home_Dual_Left and Home_Dual_Right are placed inside a shared two-column container.

This makes it possible to create side-by-side content sections.

For example:

┌─────────────────────────────┬─────────────────────────────┐
│           INDIA             │        AFGHANISTAN          │
│                             │                             │
│ Article 1                   │ Article 1                   │
│ Article 2                   │ Article 2                   │
│ Article 3                   │ Article 3                   │
└─────────────────────────────┴─────────────────────────────┘

A practical configuration could be:

Left

label → India
style → list
count → 3

Right

label → Afghanistan
style → list
count → 3

9. The Single Post Editorial Suite

Nexus Pro includes several built-in reading and engagement features for individual blog posts.


Reading Progress Bar

A slim progress indicator appears at the top of the browser window.

It tracks the reader's progress from:

0% ─────────────────────────────── 100%

This gives readers a visual indication of how much of the article remains.


Automatic Reading Time

Nexus Pro automatically estimates the reading time of an article using an average reading speed of approximately 200 words per minute.

For example:

⏱ 4 min read

The estimated reading time appears beneath the article title.


10. Font Size Controls

Readers can adjust the article text size using:

A−   A+

The controls allow visitors to increase or decrease the reading size without changing the rest of the website.

The supported range is approximately:

14px → 22px

Paragraphs, lists, and headings are adjusted while preserving the overall layout.


11. Automatic Table of Contents

Nexus Pro can automatically generate a Table of Contents (TOC) for longer articles.

When an article contains two or more <h2> or <h3> headings, the theme automatically creates the TOC.

TOC Features

  • Automatic heading detection

  • Hide / Show toggle

  • Smooth scrolling

  • Scroll-offset handling

  • No manual TOC markup required

Example:

Table of Contents

1. Introduction
2. How It Works
3. Configuration
4. Troubleshooting

12. One-Click Code Copy

For technical articles, every:

<pre><code>...</code></pre>

code block automatically receives a Copy button.

When clicked:

  1. The code is copied to the clipboard.

  2. The button provides visual confirmation.

  3. The reader can paste the code elsewhere.

This is particularly useful for programming and Blogger tutorials.


13. Image Lightbox

Images inside posts can be opened in a full-screen lightbox.

When a visitor clicks an image:

  • A dark backdrop appears.

  • The image is enlarged.

  • Image captions can be displayed.

  • Pressing Esc closes the lightbox.

This provides a better viewing experience without opening a separate page.


14. Social Sharing

Nexus Pro includes floating/sticky social sharing buttons for popular platforms.

Supported services include:

  • WhatsApp

  • Facebook

  • X (Twitter)

  • LinkedIn

  • Telegram

  • Native mobile Web Share

On supported mobile browsers, the Web Share API can open the device's native sharing interface.


15. Author Bio

The author section displays:

  • Author name

  • Profile summary

  • Avatar

If an author has not configured an avatar image in Blogger, Nexus Pro automatically generates a modern initial-based avatar instead.

For example:

┌─────┐
│  K  │
└─────┘
Kundan Singh
Author & Blogger

16. Smart Related Posts

At the bottom of each article, Nexus Pro automatically generates a related-post section.

The system:

  1. Identifies the active post's primary label.

  2. Searches for other posts using the same label.

  3. Excludes the current article.

  4. Displays related content in a responsive 3-card layout.

This helps readers discover more content without manually configuring related articles for every post.


17. Setting Up Tabbed Comments

Nexus Pro supports two comment systems through a tabbed interface:

┌──────────────────────────────────────────────────────┐
│ Blogger Comments (Active) │ Disqus Comments          │
├──────────────────────────────────────────────────────┤
│                                                      │
│      Blogger comment form and threaded replies       │
│                                                      │
└──────────────────────────────────────────────────────┘

Readers can switch between:

  • Blogger Native Comments

  • Disqus Comments


18. Connecting Disqus

To connect your Disqus account:

  1. Open Blogger Dashboard → Layout.

  2. Locate the System Settings widget (LinkList99).

  3. Click Edit.

  4. Find:

Name: disqus_shortname
  1. Replace the demo value with your Disqus forum shortname.

Example:

Name: disqus_shortname
URL / Value: your-disqus-id
  1. Click Save.

Performance Optimization

The Disqus script is loaded only when the visitor opens the Disqus Comments tab.

This prevents Disqus from loading unnecessarily for visitors who use Blogger comments and helps reduce the initial page-load overhead.


19. System Settings & AI Crawler Control

The System Settings (LinkList99) widget can also control additional theme features.

Available Settings

SettingValuePurpose
disqus_shortnameYour forum shortnameConnects Disqus
AI_Crawlersallow / disallowControls supported AI crawler access

AI Crawler Setting

Example:

Name: AI_Crawlers
URL / Value: allow

or:

Name: AI_Crawlers
URL / Value: disallow

This setting is intended to control the theme's crawler-related behavior for supported AI agents.


20. Footer Customization

Nexus Pro uses a flexible three-column footer.

The main footer areas are:

Footer_1
Footer_2
Footer_3

You can add standard Blogger gadgets such as:

  • About Us

  • Recent Posts

  • Labels

  • Useful Links

  • Newsletter

  • Custom HTML

Configure these directly from:

Blogger Dashboard → Layout


21. Useful Resource Links

You can use the navigation/footer areas to provide quick access to important websites or pages.

Example resources:

Symbols to Copy and Paste
Know My Age
AI Fancy Text

Add each resource as a standard LinkList item.


22. Theme Attribution

The theme includes a theme-creation credit linked to WayTemplates, in accordance with the applicable template licensing requirements.

Do not remove or modify required attribution unless your specific license permits it.


23. Back to Top Button

Nexus Pro includes a floating Back to Top button.

The button automatically appears after the visitor scrolls approximately:

400px

Clicking it smoothly returns the visitor to the top of the page.


24. Blogger Label URLs & JSON Feeds

When creating category links or testing the homepage sections, use Blogger's standard label URL structure.

Label Search URLs

LabelBlogger Label URLJSON Feed
AI/search/label/AI/feeds/posts/default/-/AI?alt=json
Story/search/label/Story/feeds/posts/default/-/Story?alt=json
Psychology/search/label/Psychology/feeds/posts/default/-/Psychology?alt=json
Self Help/search/label/Self%20Help/feeds/posts/default/-/Self%20Help?alt=json
India/search/label/India/feeds/posts/default/-/India?alt=json
Afghanistan/search/label/Afghanistan/feeds/posts/default/-/Afghanistan?alt=json
Currency/search/label/Currency/feeds/posts/default/-/Currency?alt=json

Full Example

For the AI label:

Label page

https://your-blog.blogspot.com/search/label/AI

JSON feed

https://your-blog.blogspot.com/feeds/posts/default/-/AI?alt=json

For labels containing spaces, encode the space as %20.

Example:

Self Help

becomes:

/search/label/Self%20Help

and:

/feeds/posts/default/-/Self%20Help?alt=json

25. Quick Configuration Reference

FeatureControlled FromConfiguration
Main NavigationLinkList1Menu links
Mega MenuLinkList1Add _mega
Dark ModeHeaderAutomatic
SearchHeaderAutomatic
Homepage HeroLinkList101label, style, count
Fullwidth SectionLinkList102label, style, count
Highlight SectionLinkList103label, style, count
Grid SectionLinkList104label, style, count
Dual LeftLinkList105label, style, count
Dual RightLinkList106label, style, count
Currency SectionLinkList107label, style, count
DisqusLinkList99disqus_shortname
AI Crawler ControlLinkList99AI_Crawlers
FooterFooter_1–3Blogger gadgets

26. The Basic Configuration Pattern

Most Nexus Pro dynamic sections follow the same simple three-setting structure:

label  → Which Blogger label to display
style  → How the posts should be displayed
count  → How many posts should appear

For example:

label  → Psychology
style  → highlight
count  → 5

That's all you need to configure a dynamic homepage section.

No template-code editing is required for normal configuration.

Link copied to clipboard!
KundanD
Author Profile

KundanD

Editorial contributor and writer. Passionate about exploring ideas, breaking news, technology, and comprehensive guides for our readers.

Comments 0

Leave a Comment