New action bar

Hello Dev Team,

Is it possible to implement a second Action bar with two buttons ?

Thank you for your support,

Jerome

That can be done. First of all you need to add a new options on Theme Options panel to actually use it.

This can be done by adding these lines of code right below existing Theme Options for Call For Action Button. All this code does is it adds “2” at the end of option ID and at the name itself. This should be done in options.php file which you can find in Sparkling folder.

$options[] = array( 'name' => __('Call For Action Button Title 2', 'sparkling'),
          'desc' => __('Enter the title for Call For Action button', 'sparkling'),
          'id' => 'w2f_cfa_button2',
          'std' => '',
          'type' => 'text');

$options[] = array( 'name' => __('CFA button link 2', 'sparkling'),
          'desc' => __('Enter the link for Call For Action button', 'sparkling'),
          'id' => 'w2f_cfa_link2',
          'std' => '',
          'type' => 'text');

Now you should tweak existing function inside extras.php file. Replace existing sparkling_call_for_action() function with this one:

if ( ! function_exists( 'sparkling_call_for_action' ) ) :
/**
 * Call for action text and button displayed above content
 */
function sparkling_call_for_action() {
  if ( is_front_page() && of_get_option( 'w2f_cfa_text' )!=''){
    echo '<div class="cfa">';
      echo '<div class="container">';
        echo '<div class="col-sm-6">';
          echo '<span class="cfa-text">'. of_get_option( 'w2f_cfa_text' ).'</span>';
          echo '</div>';
          echo '<div class="col-sm-3">';
          echo '<a class="btn btn-lg cfa-button" href="'. of_get_option( 'w2f_cfa_link' ). '">'. of_get_option( 'w2f_cfa_button' ). '</a>';
          echo '</div>';
          echo '<div class="col-sm-3">';
          echo '<a class="btn btn-lg cfa-button" href="'. of_get_option( 'w2f_cfa_link2' ). '">'. of_get_option( 'w2f_cfa_button2' ). '</a>';
          echo '</div>';
      echo '</div>';
    echo '</div>';
  }
}
endif;

This is slightly modified version of default function and this will make less space for call for action text but will leave more space for both buttons. This can be tweaked by changing col-sm-3 values. This is part of Bootstrap grid system.

Hello Aigars,

Thank you for your very quick answer !

It works well. In addition, If I need to add an option for color too ? I need to duplicate this code and add number for each new button ?

In extras.php :

     if ( of_get_option('cfa_bg_color')) {
        echo '.cfa { background-color: '.of_get_option('cfa_bg_color').'; } .cfa-button:hover a {color: '.of_get_option('cfa_bg_color').';}';
      }
      if ( of_get_option('cfa_color')) {
        echo '.cfa-text { color: '.of_get_option('cfa_color').';}';
      }
      if ( of_get_option('cfa_btn_color') || of_get_option('cfa_btn_txt_color') ) {
        echo '.cfa-button {border-color: '.of_get_option('cfa_btn_color').'; color: '.of_get_option('cfa_btn_txt_color').';}';

In options.php :

		$options[] = array( 'name' => __('Call For Action Text Color', 'sparkling'),
							'desc' => __('Default used if no color is selected', 'sparkling'),
							'id' => 'cfa_color',
							'std' => '',
							'type' => 'color');

		$options[] = array( 'name' => __('Call For Action Background Color', 'sparkling'),
							'desc' => __('Default used if no color is selected', 'sparkling'),
							'id' => 'cfa_bg_color',
							'std' => '',
							'type' => 'color');

		$options[] = array( 'name' => __('Call For Action Button Border Color', 'sparkling'),
							'desc' => __('Default used if no color is selected', 'sparkling'),
							'id' => 'cfa_btn_color',
							'std' => '',
							'type' => 'color');

		$options[] = array( 'name' => __('Call For Action Button Text Color', 'sparkling'),
							'desc' => __('Default used if no color is selected', 'sparkling'),
							'id' => 'cfa_btn_txt_color',
							'std' => '',
							'type' => 'color');

Thank you for your support, regards,

Jerome