header buttons add.html

<script>

  $( ( ) => {
  
    /*
    
      begin header buttons add
      
      License       : < https://tinyurl.com/s872fb68 >
      
      Version       : 0.8.0
      
      SS Version    : 7.1
      
      Fluid
      Engine
      Compatible    : Not Applicable
      
      Dependencies  : jQuery
      
      By            : Thomas Creedon < http://www.tomsWeb.consulting/ >
      
      */
      
      const buttonsAdd = [
      
        /*
        
          following is an example of a new button data structure. copy the
          example new button data structure and paste after the example new
          button data structure. remove the forward slash asterisk and asterisk
          forward slash lines from before and after the copied example. repeat
          for as many new buttons you want to create. this has been done once
          initially
          
          */
          
        /*
        
        {
        
          text : '[enter button text here between single quotes replacing square brackets]',
          
          url : '[enter url here between single quotes replacing square brackets]',
          
          // type is is optional. values are secondary, or tertiary
          
          type : '[optional, enter type here between single quotes replacing square brackets]'
          
          },
          
        */
        
        {
        
          text : '[enter button text here between single quotes replacing square brackets]',
          
          url : '[enter url here between single quotes replacing square brackets]',
          
          // type is is optional. values are secondary or tertiary
          
          type : '[optional, enter type here between single quotes replacing square brackets]'
          
          },
          
        ]
        
      /*
      
        targetAtttributeValue is an optional setting. enter _self, _blank,
        _parent, _top, or framename see < https://mzl.la/2Q0JROF > between
        single quotes
        
        */
        
      const targetAtttributeValue = '';
      
      /*
      
        buttonOriginalTargetAttributeAdd is an optional setting. use false or
        true. when true the target attribute will be added to SS's built-in cta
        button
        
        */
        
      const buttonOriginalTargetAttributeAdd = false;
      
      // do not change anything below, there be the borg here
      
      const codeName = 'Header Buttons Add';
      
      const selector = '.header-actions-action--cta, .header-menu-cta';
      
      const typeClassMap = {
      
        secondary : 'sqs-button-element--secondary',
        
        tertiary : 'sqs-button-element--tertiary'
        
        };
        
      const version = '0.8.0';
      
      const s = `${ codeName } v${ version }, ` +
      
        'License < https://tinyurl.com/s872fb68 >, ' +
        
        'Tom\'s Web Consulting < http://www.tomsWeb.consulting >';
        
      console.log ( s );
      
      $( selector ).each ( function ( ) {
      
        const $this = $( this );
        
        const $buttonOriginal = $( '.btn:first', $this );
        
        $.each ( buttonsAdd, function ( index, buttonAdd ) {
        
          const $button = $buttonOriginal
          
            .clone ( )
            
            .attr ( 'href', buttonAdd.url )
            
            .text ( buttonAdd.text )
            
            .appendTo ( $this );
            
          if ( targetAtttributeValue )
          
            $button.attr ( 'target', targetAtttributeValue );
            
          const clss = typeClassMap [ buttonAdd.type ];
          
          if ( clss == undefined ) return true; // continue
          
          $button
          
            .removeClass ( 'sqs-button-element--primary' )
            
            .addClass ( clss );
            
          } );
          
        if ( buttonOriginalTargetAttributeAdd && targetAtttributeValue )
        
          $buttonOriginal.attr ( 'target', targetAtttributeValue );
          
        } );
        
      /* end header buttons add */
      
    } );
    
  </script>