Skip to content
maka-img_mm_marketplace
maka marketplace

Discover Products to help you POWER up with CMS Hub

maka-img_mm_power-pro
Power Pro Theme

Check out the POWER demo and see all the latest features

maka-img_mm_performance
Performance

POWER is optimized to perform, review the results

maka-img_mm_customer-showcase
Customer Showcase

See how our customers used the POWER Theme

POWER Pro V25 released on August 18th 2022 – Read Changelog

maka-img_mm_documentation_3
Getting Started

Follow our guide to save time and avoid missing a step

maka-img_mm_module-library
Module Library

From page speed impact to set up instructions, you'll find it all

maka-img_mm_video-tutorials
Video tutorials

Find all POWER videos in the same spot for quick answers

maka-img_mm_faq
FAQs

Have questions?
We have answers

Experiencing an issue with POWER? Submit a support ticket here

maka-img_mm_about-us
About us

“Would I rather be feared or loved? Easy. Both. I want people to be afraid of how much they love me.”
– Michael Scott, not us

maka-img_mm_blog
Blog

This is mostly a demo right now. We are working on some really cool things around the office.

maka-img_mm_career
Career

Quite possibly the most fun you will have at work, ever. Did we mention how cool we are?

Having issues with POWER?
SUBMIT A SUPPORT TICKET


Schedule a Q&A or Demo
PREPURCHASE CONSULTATION


Other questions?
CONTACT US / LIVE CHAT

LIVE Chat 7CT AM – 7CT PM – Get in touch here

POWER Sec Breadcrumbs Module

How to configure the Sec Breadcrumbs module for POWER Pro theme in HubSpot

icon-module-sec-breadcrumbs

SEC BREADCRUMBS

Provide site visitors with a visible path showing where they are on your site.

Add clickable links to create page specific navigation.

sec-breadcrumbs-example

Page Speed Impact

LOW

Very minimal impact to page load speed, the code for this module has been optimized to limit resources needed on page load.

TIPS

Place your breadcrumbs in the same place across all pages where you'll be using breadcrumbs.

It is recommended to add for all pages within the same navigation path.

FAQ

Can I use anchor links in the Breadcrumbs?

Yes, it is possible to use an anchor link on the page, using "External" for the Link To and the anchor (ex: #anchor) as the URL.

Breadcrumbs are typically reserved to show the path the user has already taken, so while it is possible to use this for links on the page, we recommend using the Sec Sticky Sub-Menu module instead.

Module Options

Breadcrumb

This is where you will add the items that appear in the breadcrumbs.

add-breadcrumb

There are no breadcrumbs added by default, you'll need to click "Add one" to create the first link.

Once you have added your first breadcrumb, there will be a "+Add" link to create additional links.

breadcrumb-add-additional

Breadcrumb Item(s) > Title

This is where the title/text goes that you want to display for the breadcrumb/link.

Breadcrumb Item(s) > Link

The Link dropdown allows you to choose the type of link to include for the button: External, Content, or Blog

Based on your selection, you can either add the URL or choose the page or blog post.

Breadcrumb Item(s) > Link > Open in New Window

There is a toggle to allow you to open the link in a new window. The default is set to open in the same window/tab.

Tip: Since breadcrumbs are used to show the users path to the page, it is recommended to open in the same window/tab.

Breadcrumb Item(s) > Link > Link Type

There is a check box for "No Follow" which allows you to indicate that the link is not associated with your website. This setting has SEO implications if used incorrectly.

Breadcrumb Item(s) > Animation

You can also override the default animation settings at the item level.

accordion-item-animation-settings

Layout > Padding Top and Padding Bottom

Choice of Standard, None, Small, Medium, Large, or First Section with Header. Refer to Settings that apply to all Section Modules for more details about these choices.

Style > Color Scheme

Choice of Light or Dark.

Tip: If you change the background color for the module, the definition of Light Color scheme is a light background with dark text and Dark Color scheme is a dark background with light text. Based on your background color, you would need to toggle the color scheme to ensure the text color displays properly and is legible.

Style > Background

Choice of Background Color, Primary Background Color, Background Image/Video, Background Gradient, or Transparent. Refer to Settings that apply to all Section Modules for more details about these choices.

Animation

Checkbox to turn on/off Animate on Scroll. Turning off here will only apply to this section, to turn animation off globally refer to Theme Options for Animations.

Animation > Section

Ability to change the Animation Type and Delay for the Section. 

Configurations

BREADCRUMB FULL WIDTH LAYOUT

sec-breadcrumb-gradient-example

Layout > Padding Top and Padding Bottom

Medium

Style > Color Scheme

Dark

Style > Background

Gradient

Examples

DESIGN SOMETHING COOL WITH THIS POWER MODULE?

Share it with us!

NEVER MISS A POWER UPDATE

We are continuously improving our modules and updating our documentation. Stay in the loop.