• Site logo

    MagicGellan

Stack Settings

My Image

MagicGellan Settings

MagicGellan - Setup

  • Marker Mode: (select) Auto marker discovery will only work with BWD MagicMarkers and Sections stacks. Normal Foundation Markers will work but will populate the menu with the marker ID
    • Default: Auto
    • Possible Values:
      • Manual
      • Auto
  • Item Count: (number) The number of items in the nav
    • Enable: When Marker Mode is set to simple
    • Default: 3
    • Min Value: 1
    • Max Value: 20
  • Collapse Setup?: (checkbox) Collapse the Button Setup an only show the preview
    • Default: false
  • Make first section active?: (checkbox) Make the first marker active. This is needed if you want to hide when the first marker is at the top of the page. By default Magellan will not make any markers active until the page is scrolled.
    • Default: false

  • Show Dots: (select) Defines the behavior of the MagicGellan Nav Below the breakpoint. To always show dots set the breakpoint to 9999 to always show bar set breakpoint to 0
    • Default: Below Breakpoint
    • Possible Values:
      • Below Breakpoint
      • Never
  • Breakpoint: (number) The custom breakpoint below which dots will be shown. This setting is active in edit mode to allow you to style the dots.
    • Enable: When Show Dots is set to bp-mag-dots
    • Default: 600px
    • Min Value: 0px
    • Max Value: 9999px

  • Hide All: (select) Hides the MagicGellan Completely when previewed or published.
    • Default: Never
    • Possible Values:
      • Never
      • Below
      • Above
  • Breakpoint: (number) The custom breakpoint at which point the MagicGellan nav will be hidden
    • Default: 600px
    • Min Value: 0px
    • Max Value: 9999px
  • Hide for landing page: (checkbox) Hides the MagicGellan stack for the first full browser height of scroll. Useful if you have a full screen landing page - e.g. in a 100% high Sections Stack
    • Default: false

MagicGellan - Menu Bar

  • Orientation: (select) Select either a horizontal or vertical magellan bar
    • Default: Horizontal
    • Possible Values:
      • Horizontal
      • Vertical
  • Body Margin: (number) Adds a margin to make room for the vertical magicgellan.
    • Enable: When Orientation is set to mag-vertical
    • Default: 0
    • Min Value: 0
    • Max Value: 600
  • Positioning: (select) The screen positioning of the MagicGellan menu
    • Default: Fixed Top
    • Possible Values:
      • Fixed Top
      • Fixed Bottom
      • Floating
      • Sticky: Consider using a BWD Pin stack to make a sticky Magellan, particularly if you want an offset from the top. The Foundation sticky fixing is not smooth
      • Static: Use this setting if you are Making Magellan sticky using the BWD Pin Stack. NOTE: The foundation fixing routine is not smooth the BWD Pin Stack will provide a much nicer smooth fix when sticky
  • Info: Nav Dots are disabled in stcky mode. Hover here for tip to use Nav Dots.
  • Stick at: (number) The vertical distance from the top of the browser when the stick Magellan fixes. You can use this to place it below a Top Bar for example. NOTE: The foundation fixing routine is not smooth. For a smooth sticky fix use the BWD Pin Stack with Magellan set to static
    • Enable: When Positioning is set to mag-sticky
    • Default: 0px
    • Min Value: 0px
    • Max Value: 600px
  • Top: (number) The vertical distance from the top of the browser as a percentage
    • Enable: When Positioning is set to mag-fixed fixed-custom
    • Default: 35
    • Min Value: 0
    • Max Value: 100
  • Top: (number) The vertical distance from the top of the browser as a percentage
    • Enable: When Positioning is set to mag-parent-fix
    • Default: 35%
    • Min Value: 0%
    • Max Value: 100%
  • Units: (select) The units of measuremnt for vertical positioning
    • Enable: When Positioning is set to mag-fixed fixed-custom
    • Default: Pixels
    • Possible Values:
      • Pixels
      • % Percent
  • Horiz Align: (select) The horizontal position of the vertical menu
    • Enable: When Orientation is set to mag-vertical
    • Default: Left
    • Possible Values:
      • Left
      • Right
  • Position: (number) The horizontal distance from the edge of the browser
    • Enable: When Orientation is set to mag-vertical
    • Default: 0
    • Min Value: 0
    • Max Value: 500
  • Units: (select) The units of measurement for horizontal positioning
    • Enable: When Orientation is set to mag-vertical
    • Default: Pixels
    • Possible Values:
      • Pixels
      • % Percent
  • Width: (select) The width of the Nav when in vertical mode. For horizontal mode simply contrain the with using columns or other container stacks
    • Enable: When Orientation is set to mag-vertical
    • Default: Auto
    • Possible Values:
      • Auto
      • Limited Width
      • Fixed Width
  • Max Width: (number) The fixed width of the vertical magellan sideBar
    • Enable: When Width is set to width-max
    • Default: 200px
    • Min Value: 30px
    • Max Value: 500px
  • Fixed Width: (number) The fixed width of the vertical magellan sideBar
    • Enable: When Width is set to width-fixed
    • Default: 140px
    • Min Value: 30px
    • Max Value: 500px
  • Sidebar Width: (number) The space allowed for the sidebar vertical Magellan
    • Enable: When Width is set to width-fixed
    • Default: 140px
    • Min Value: 30px
    • Max Value: 500px
  • Contain within body?: (checkbox) Keep the menu content of the MagicGellan bar within the width of the page body
    • Default: false

  • Bar Background: (select) Applies a color or gradient to the bar background
    • Default: Color
    • Possible Values:
      • Color
      • Gradient
      • Two Color Gradient
      • Two Tone
      • Faded
      • Image
      • None - Transparent
  • Base Top: (color) The top color of the base menu background gradient
    • Enable: When Bar Background is set to twocolor
    • Default: #737373
  • Base: (color) The color of the base menu background
    • Default: #333333
  • Opacity: (number) The opacity of the Magellan Background
    • Default: 100%
    • Min Value: 0%
    • Max Value: 100%
  • Bottom Opacity: (number) The background opacity of the top menu at the bottom when using Faded style
    • Enable: When Bar Background is set to faded
    • Default: 85%
    • Min Value: 0%
    • Max Value: 100%

  • Bar Height: (number) The Height of the MagicGellan bar when in horizontal mode
    • Default: 45px
    • Min Value: 0px
    • Max Value: 150px
  • Bar Padding: (slider) Allow the bar background to show areound the links
    • Default: 0px
    • Min Value: 0px
    • Max Value: 30px
  • Shadow when Fixed?: (checkbox) Adds a shadow to the MagicGallan Bar when it is in the fixed position. NOTE: unlike TopBar there is no way to detect when a sticky magellan has become fixed so this setting is inoperative in sticky mode
    • Default: false
  • Shadow Opacity: (number) The opacity of the shadow
    • Enable: When Shadow when Fixed? is set to true
    • Default: 40%
    • Min Value: 10%
    • Max Value: 99%
  • Shadow Blur: (number) The blur radius of the shadow
    • Enable: When Shadow when Fixed? is set to true
    • Default: 5px
    • Min Value: 0px
    • Max Value: 20px

MagicGellan - Menu Items

  • Text Font: (select) The font family and font wieght definitions that will be inherited from Site Styles
    • Default: Text Family (Site Styles)
    • Possible Values:
      • Text Family (Site Styles)
      • H1 Family (Site Styles)
      • H2 Family (Site Styles)
  • Menu Align: (select) The alignment of the nav links
    • Enable: When Orientation is set to mag-horizontal
    • Default: Center
    • Possible Values:
      • Left
      • Right
      • Center
      • Full Width Centered
  • Text Align: (select) The alignment of the nav links
    • Default: Center
    • Possible Values:
      • Left
      • Center
      • Right
  • Text Size: (slider) The font size of the links
    • Default: 0.81rem
    • Min Value: 0rem
    • Max Value: 2rem
  • Add Dividers?: (checkbox) Add dividers between the menu items
    • Default: false
  • Dividers: (color) The color of the dividers
    • Enable: When Add Dividers? is set to true
    • Default: #999999

  • Links: (color) The color of the default links
    • Default: #999999
  • Links Hover: (color) The hover color of the default links
    • Default: #737373
  • Active Links: (color) The color of the active links
    • Default: #ffffff

  • Link Bg: (color) The color of the background for default links
    • Default: #eeeeee
  • Links Bg Opacity: (number) The opacity of the Active Link Background
    • Default: 0%
    • Min Value: 0%
    • Max Value: 100%
  • Hover Bg: (color) The color of the background for hovered links
    • Default: #cccccc
  • Active Bg: (color) The color of the background for active links
    • Default: #666666
  • Active Bg Opacity: (number) The opacity of the Active and Hovered Links Background
    • Default: 30%
    • Min Value: 0%
    • Max Value: 100%

MagicGellan - Nav Dots

  • Top: (number) The vertical distance from the top of the browser as a percentage
    • Default: 35%
    • Min Value: 0%
    • Max Value: 100%
  • Align: (select) The alignment of the nav dots
    • Default: Left
    • Possible Values:
      • Left
      • Right
  • Side Offset: (number) The distance of the dots from the edge of the browser
    • Default: 10px
    • Min Value: 0px
    • Max Value: 100px
  • Dot Size: (number) The size of the vertical Nav Dots
    • Default: 12px
    • Min Value: 8px
    • Max Value: 30px
  • Dot Spacing: (slider) The spacing of the vertical Nav Dots
    • Default: 1.2
    • Min Value: 1
    • Max Value: 2

  • Dots: (color) The color of the nav dot border
    • Default: #999999
  • Fill: (checkbox) Fills the dot circle and makes it a solid disc
    • Default: false
  • Hover Dots: (color) The color of the nav dot border when hovered
    • Default: #666666
  • Fill: (checkbox) Fills the hovered dot circle and makes it a solid disc
    • Default: false
  • Active Dots: (color) The color of the active nav dot border
    • Default: #ffffff
  • Fill: (checkbox) Fills the active dot circle and makes it a solid disc
    • Default: false
  • Scale Active: (slider) Enlarge the active dot with respect to the size of the non active dots
    • Default: 1.2x
    • Min Value: 1x
    • Max Value: 3x

  • Tip Text: (color) The color of the tool tip text
    • Default: #333333
  • Text Size: (slider) The font size of the tips
    • Default: 0.9rem
    • Min Value: 0rem
    • Max Value: 2rem
  • Tip Padding: (slider) The padding applied to the hover menu link tips
    • Default: 4px
    • Min Value: 0px
    • Max Value: 10px
  • Rounded corners: (slider) The rounded corner border radius of the tips
    • Default: 5px
    • Min Value: 0px
    • Max Value: 16px
  • Tip Background: (select) The shade of the tip background
    • Default:
    • Possible Values:
      • Light
      • Dark
      • Custom
  • Custom BG: (input) Advanced: Enter a custom rgba color or even a css gradient for the tip background
    • Enable: When Tip Background is set to custom-tip
    • Default: rgba(20,59,150,0.8)

MagicGellan - Title Area

  • Info: Title Area will be hidden when alignment is set to center full width, except on Mobile Menu
  • Content: (select) The content for the title area.
    • Default: Site Setup
    • Possible Values:
      • Hide
      • Site Setup
      • Custom Data
  • Title Element: (select) The html element used for the title
    • Default: H1
    • Possible Values:
      • H1
      • H2
      • H3
      • H4
      • H5
      • H6
      • P
  • Title Font: (select) The font family and font wieght definitions that will be inherited from Site Styles
    • Default: H1 Family (Site Styles)
    • Possible Values:
      • Text Family (Site Styles)
      • H1 Family (Site Styles)
      • H2 Family (Site Styles)
  • Title Color: (color) The color of the title text
    • Default: #ffffff
  • Text Size: (slider) The font size of the title
    • Default: 1.06rem
    • Min Value: 0rem
    • Max Value: 4rem
  • Show Site Title?: (checkbox) Show the site title from Site Setup.
    • Enable: When Content is set to site-setup
    • Default: true

  • Logo Size: (select) Contain the image within the nav bar or allow it to overflow. This setting is only applied to horizontal bars
    • Default: Contained in Bar
    • Possible Values:
      • Contained in Bar
      • Overflow Bar
  • Max Width: (number) The maximum width of the displayed logo
    • Enable: When Logo Size is set to overflowing
    • Default: 100px
    • Min Value: 5px
    • Max Value: 500px
  • Image Height: (number) Specify the height of the overflowing image. The width will be automatically calculated to keep the image proportions. This setting only affects horizontal mode
    • Enable: When Logo Size is set to overflowing-draft
    • Default: 12px
    • Min Value: 20px
    • Max Value: 200px
  • Show Site Logo?: (checkbox) Show the site logo from Site Setup
    • Enable: When Content is set to site-setup
    • Default: true
  • Fixed Bar Height?: (checkbox) When using overflowing images you may wish to fix the bar height. Be careful with this setting as it will allow long content spill out of the bar. Control this using the breakpoint setting to change to Nav Dots before it happens
    • Enable: When Logo Size is set to overflowing
    • Default: false
  • Logo Mobile: (link) (Required) The url to the site logo image to be used on Mobile devices
    • Enable: When Content is set to custom
    • Default:
  • Logo Tablet: (link) (Optional) The url to the site logo image to be used on Tablet devices
    • Enable: When Content is set to custom
    • Default:
  • Logo Desktop: (link) (Optional) The url to the site logo image to be used on Desktop devices
    • Enable: When Content is set to custom
    • Default:
  • Title: (input) The title
    • Enable: When Content is set to custom
    • Default: Site Title

  • Hide Logo on Mobile?: (checkbox) Hide the logo on mobile devices in order to save space
    • Default: false
  • Hide Title on Mobile?: (checkbox) Hide the title on mobile devices in order to save space
    • Default: false
  • Remove Title Padding?: (checkbox) Remove the padding from the title area
    • Default: false

MagicGellan - Advanced

  • Custom Class: (input) Enter a custom class name to refer to this MagicGellan instance.
    • Default:

Magic Link Settings

Magic Link - Setup

  • Marker id: (input) The name of the Magellan or MagicGellan Marker. NOTE: Setting this blank removes Magellan functionality
    • Default: marker
  • Compensate Height?: (checkbox) Compensates the Magellan destination position by the height of this link. This is only needed in special circumstances where the arrival point from this link does not match that when clicked from another Magellan menu stack
    • Default: false

  • Info: Ensure dropzone content contains no links. Set buttons to Type: Button not Link etc.

Magic Marker Settings

  • Marker id: (input) The name of the marker that is referenced from the Sticky Nav stack
    • Default: marker
  • Menu Text: (input) The Text that will appear in the MagicGellan Menu for this marker when in Auto mode. This is optional and has no effect if this magic marker is used with a Foundation Magellan or Topbar stack
    • Default: Menu Item
  • Marker Offset: (number) Controls the magellan arrival offset position. Use this to adjust the arrival up or down to suit
    • Default: 0
    • Min Value: -600
    • Max Value: 600
  • Units: (select) The units of measurement for the marker offset
    • Default: Rem
    • Possible Values:
      • Rem
      • Pixels

  • Hide menu when active?: (checkbox) Hide the menu when this section is active
    • Default: false
  • Wrap Content?: (checkbox) Add your content to the Magic Marker section drop zone to help keep your content organised
    • Default: false
  • Collapse in Edit?: (checkbox) Collapses the content in edit mode but leaves the marker ID visible.
    • Enable: When Wrap Content? is set to true
    • Default: false

  • Show Marker in Preview?: (checkbox) Shows the maker position in preview mode to aid offset alignment. This is not present when Published.
    • Default: false
  • Color: (color) The color of the preview mode marker
    • Enable: When Show Marker in Preview? is set to true
    • Default: #FF0000