The New Way to Build with AI! Introducing ReUI — the developer platform for agentic UI with shadcn/ui
Browse ReUI Pro
Light
Dark
System
Ask  Question

Metronic, Bootstrap, Stepper without step indicators, how to?


Hi

how can we create stepper without step indicators using metronic theme?

For instance
https://preview.keenthemes.com/metronic8/demo1/utilities/wizards/horizontal.html

We want to remove stepper indicators as ("Account Type","Account Info","Business Info"...)

Could you help us, please?


A
A. Lukic 1 year ago
Bootstrap
2 Answers
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)

 
Deleted comment
user
Carlos Web 1 year ago

Hi! To create a stepper without step indicators in the Metronic theme (like the one in your link), you can simply hide or remove the HTML markup for the step labels (e.g., “Account Type,” “Account Info”) and adjust the CSS to realign the content properly. Metronic is flexible, so with a bit of tweaking, you can keep the step content functional while hiding the visual indicators.

For similar UI customization tips, whatapps.net is also a helpful resource you might want to explore.


 
Deleted comment
user
Sean Author 1 year ago

Hi,

Just hide the step indicator using "stepper-nav mb-5 d-none". Completely removing it is not suggested as stepper components refers to the indicators during the stepper interaction.

Regards,
Sean


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Metronic

Go to Metronic Downloads License Guide & FAQ Purchase Metronic Refunds
buy metronic keenthemes mega bundle

ReUI

Open-source React components, blocks and templates built on shadcn/ui and Tailwind CSS by Keenthemes.

ReUI by Keenthemes React Components UI Blocks React Templates ReUI Documentation