[direction]

Estimated reading: 1 minute 430 views

You may see some direction or steps highlighted on the theme doc demo pages as like the below screenshot.

We used the [direction] shortcode to render the design of the steps. Your shortcode could be [direction]Theme Options > Header > Top of Header > Menu Element[/direction] Use the > character as the direction separator icon. This character (>) will be replaced with an arrow-right icon by default.

You can change the icon with some custom CSS. See the code below-

.direction_step + .direction_step:before {
  content: "\35";
  font-family: eleganticons;
}

​Here the content value is the Elegant Icon​ code. You would not find the icon code directly on the Elegant Icon’s website. Inspect the icon by right-clicking on it from their website. Then navigate to the CSS ::before CSS Pseudo-elements to see the icon code. Watch the below GIF to see the process of inspection and taking of the icon code.

https://i.imgur.com/7zac94t.gif

Leave a Comment

Share this Doc

[direction]

Or copy link

CONTENTS

Talk to the Refi Experts!

We pride ourselves on providing competent guidance, responsive communication, and quick closings. Reply on us to help you secure commercial financing.

Talk to the Refi Experts!

We pride ourselves on providing competent guidance, responsive communication, and quick closings. Reply on us to help you secure commercial financing.