Tagged: enfold theme, fullscreen slider
-
AuthorPosts
-
September 1, 2017 at 5:55 pm #846939
Hello Kriesi Support team,
I know that this topic has been discussed quite often. But I don’t want to add a button by copying a button shortcode inside the slider caption. If possible I want to amend and/or edit the necessary files to have the opportunity to choose the number of buttons shown on the fullscreen slideshow in the backend in the caption menu of the fullscreen slider.
I already amended the config-templatebuilder > avia-shortcodes > slideshow_fullscreen.php file and the config-templatebuilder > avia-shortcodes > av-helper-slideshow.php file, where I found program code for handling the functionality of button 1 and 2.
What I did for slideshow_fullscreen.php:
lines 253-264
array(
“name” => __(“Apply a link or buttons to the slide?”, ‘avia_framework’ ),
“desc” => __(“You can choose to apply the link to the whole image or to add ‘Call to Action Buttons’ that get appended to the caption”, ‘avia_framework’ ),
“id” => “link_apply”,
“type” => “select”,
“std” => “”,
“subtype” => array(
__(‘No Link for this slide’, ‘avia_framework’ ) =>”,
__(‘Apply Link to Image’, ‘avia_framework’ ) =>’image’,
__(‘Attach one button’, ‘avia_framework’ ) =>’button’,
__(‘Attach two buttons’, ‘avia_framework’ ) =>’button button-two’,
__(‘Attach three buttons’, ‘avia_framework’ ) =>’button button-three’)),I added the last line, for a third button. In my opinion this array contains the options that you can choose. “Choose to apply the link to the whole image or to add ‘Call to Action Buttons’ that get appended to the caption. ”
Then I added this code snippet, it is the same as for button two, just amended for button three
lines after code for button 2 lines 425 and followingarray( “name” => __(“Button 3 Label”, ‘avia_framework’ ),
“desc” => __(“This is the text that appears on your third button.”, ‘avia_framework’ ),
“id” => “button_label3”,
“type” => “input”,
“container_class” => ‘av_half av_half_first’,
“required”=> array(‘link_apply’,’contains’,’button-three’),
“std” => “Click me”),array(
“name” => __(“Button 3 Color”, ‘avia_framework’ ),
“desc” => __(“Choose a color for your third button here”, ‘avia_framework’ ),
“id” => “button_color3”,
“type” => “select”,
“std” => “light”,
“container_class” => ‘av_half’,
“required”=> array(‘link_apply’,’contains’,’button-three’),
“subtype” => array(
__(‘Translucent Buttons’, ‘avia_framework’ ) => array(
__(‘Light Transparent’, ‘avia_framework’ )=>’light’,
__(‘Dark Transparent’, ‘avia_framework’ )=>’dark’,
),__(‘Colored Buttons’, ‘avia_framework’ ) => array(
__(‘Theme Color’, ‘avia_framework’ )=>’theme-color’,
__(‘Theme Color Subtle’, ‘avia_framework’ )=>’theme-color-subtle’,
__(‘Blue’, ‘avia_framework’ )=>’blue’,
__(‘Red’, ‘avia_framework’ )=>’red’,
__(‘Green’, ‘avia_framework’ )=>’green’,
__(‘Orange’, ‘avia_framework’ )=>’orange’,
__(‘Aqua’, ‘avia_framework’ )=>’aqua’,
__(‘Teal’, ‘avia_framework’ )=>’teal’,
__(‘Purple’, ‘avia_framework’ )=>’purple’,
__(‘Pink’, ‘avia_framework’ )=>’pink’,
__(‘Silver’, ‘avia_framework’ )=>’silver’,
__(‘Grey’, ‘avia_framework’ )=>’grey’,
__(‘Black’, ‘avia_framework’ )=>’black’,
))),
array(
“name” => __(“Button 3 Link?”, ‘avia_framework’ ),
“desc” => __(“Where should the Button link to?”, ‘avia_framework’ ),
“id” => “link3”,
“container_class” => ‘av_half av_half_first’,
“required”=> array(‘link_apply’,’contains’,’button-three’),
“type” => “linkpicker”,
“fetchTMPL” => true,
“subtype” => array(
__(‘Set Manually’, ‘avia_framework’ ) =>’manually’,
__(‘Single Entry’, ‘avia_framework’ ) => ‘single’,
__(‘Taxonomy Overview Page’, ‘avia_framework’ ) => ‘taxonomy’,
),
“std” => “”),array(
“name” => __(“Button 3 Link Target?”, ‘avia_framework’ ),
“desc” => __(“Select here if you want to open the linked page in a new window”, ‘avia_framework’ ),
“id” => “link_target3”,
“type” => “select”,
“std” => “”,
“container_class” => ‘av_half’,
“required”=> array(‘link_apply’,’contains’,’button-three’),
“subtype” => AviaHtmlHelper::linking_options()),It was only copy and paste of the code of button two and amending for an additional button (button three)
What I did for av-helpoer-slideshow.php:
In the function advanced_slide() I added code for button 3 similar to button 2. The function is not completely show, the rest of the code is not nescessary. In the lines where I changes something I add !!! CHANGES !!!, only in this blog for displaying purposes.
//function that renders the slides. use when we did use sub-shorcodes to define the images
protected function advanced_slide()
{
$html = “”;
$counter = 0;
$this->ie8_fallback = “”;foreach($this->id_array as $key => $id)
{
$meta = array_merge( array( ‘content’ => $this->subslides[$key][‘content’],
‘title’ =>”,
‘link_apply’ =>”,
//direct link from image
‘link’ =>”,
‘link_target’ =>”,
//button link 1
‘button_label’ =>”,
‘button_color’ =>’light’,
‘link1’ =>”,
‘link_target1’ =>”,
//button link 2
‘button_label2’ =>”,
‘button_color2′ =>’light’,
‘link2’ =>”,
‘link_target2’ =>”,
//button link 3 !!! CHANGES !!!
‘button_label3’ =>”,
‘button_color3′ =>’light’,
‘link3’ =>”,
‘link_target3’ =>”,‘position’ =>’center center’,
‘caption_pos’ =>’capt-bottom capt-left’,
‘video_cover’ =>”,
‘video_controls’=>”,
‘video_mute’ =>”,
‘video_loop’ =>”,
‘video_format’ =>”,
‘video_autoplay’=>”,
‘video_ratio’ =>’16:9′,
‘video_mobile_disabled’=>”,
‘video_mobile’ =>’mobile-fallback-image’,
‘mobile_image’ => ”,
‘slide_type’ =>”,
‘custom_markup’ => ”,
‘custom_title_size’ => ”,
‘custom_content_size’ => ”,
‘font_color’ =>”,
‘custom_title’ => ”,
‘custom_content’ => ”,
‘overlay_enable’ => ”,
‘overlay_opacity’ => ”,
‘overlay_color’ => ”,
‘overlay_pattern’ => ”,
‘overlay_custom_pattern’ => ”,), $this->subslides[$key][‘attr’]);
extract($meta);
if(isset($this->slides[$id]) || $slide_type == ‘video’)
{
$img = array(”);
$slide = “”;
$attachment_id = isset($this->slides[$id]) ? $id : false;
$link = AviaHelper::get_url($link, $attachment_id);
$extra_class = “”;
$linkdescription= “”;
$linkalt = “”;
$this->service = false;
$slider_data = “”;
$stretch_height = false;
$final_ratio = “”;
$viewport = 16/9;$markup_url = avia_markup_helper(array(‘context’ => ‘image_url’,’echo’=>false, ‘id’=>$attachment_id, ‘custom_markup’=>$custom_markup));
if($slide_type == ‘video’)
{
$this->service = avia_slideshow_video_helper::which_video_service($video);
$video = avia_slideshow_video_helper::set_video_slide($video, $this->service, $meta);
$video_class = !empty( $video_controls ) ? ” av-hide-video-controls” : “”;
$video_class .= !empty( $video_mute ) ? ” av-mute-video” : “”;
$video_class .= !empty( $video_loop ) ? ” av-loop-video” : “”;
$video_class .= !empty( $video_mobile ) ? ” av-“.$video_mobile : “”;$extra_class .= ” av-video-slide “.$video_cover.” av-video-service-“.$this->service.” “.$video_class;
$slider_data .= ” data-controls='{$video_controls}’ data-mute='{$video_mute}’ data-loop='{$video_loop}’ data-disable-autoplay='{$video_autoplay}’ “;if($mobile_image){
$fallback_img = wp_get_attachment_image_src($mobile_image, $this->config[‘size’]);
$slider_data .= ” data-mobile-img='”.$fallback_img[0].”‘”;
}//if we dont use a fullscreen slider pass the video ratio to the slider
if($this->config[‘bg_slider’] != “true”)
{
global $avia_config;
//if we use the small slideshow only allow the “full” $video_format
if($this->config[‘handle’] == ‘av_slideshow’) $video_format = “full”;//calculate the viewport ratio
if(!empty($avia_config[‘imgSize’][$this->config[‘size’]]))
{
$viewport = $avia_config[‘imgSize’][$this->config[‘size’]][‘width’] / $avia_config[‘imgSize’][$this->config[‘size’]][‘height’];
}//calculate the ratio when passed as a string (eg: 16:9, 4:3). fallback is 16:9
$video_ratio = explode(‘:’,trim($video_ratio));
if(empty($video_ratio[0])) $video_ratio[0] = 16;
if(empty($video_ratio[1])) $video_ratio[1] = 9;
$final_ratio = ((int) $video_ratio[0] / (int) $video_ratio[1]);switch($video_format)
{
case “”:
$final_ratio = $viewport;
break;
case “stretch”:
$final_ratio = $viewport;
$stretch_height = ceil( $viewport / ($video_ratio[0]/$video_ratio[1]) * 100 );
$stretch_pos = (($stretch_height – 100) / 2) * -1;
$slider_data .= ” data-video-height='{$stretch_height}'”;
$slider_data .= ” data-video-toppos='{$stretch_pos}'”;
$extra_class .= ” av-video-stretch”;
break;
case “full”:
// do nothing and apply the entered ratio
break;
}$slider_data .= ” data-video-ratio='{$final_ratio}'”;
}}
else //img slide
{
$slide = $this->slides[$id];
$linktitle = trim($slide->post_title) ? esc_attr($slide->post_title) : “”;
if($linktitle == “-“) $linktitle = “”;
$linkdescription = (trim($slide->post_content) && empty($link)) ? “title='”.esc_attr($slide->post_content).”‘” : “”;
$linkalt = get_post_meta($slide->ID, ‘_wp_attachment_image_alt’, true);
$linkalt = !empty($linkalt) ? esc_attr($linkalt) : ”;
$img = wp_get_attachment_image_src($slide->ID, $this->config[‘size’]);
$video = “”;
}if($this->slide_count === 1) $extra_class .= ” av-single-slide”;
$blank = (strpos($link_target, ‘_blank’) !== false || $link_target == ‘yes’) ? ‘ target=”_blank” ‘ : “”;
$blank .= strpos($link_target, ‘nofollow’) !== false ? ‘ rel=”nofollow” ‘ : “”;
$tags = (!empty($link) && $link_apply == ‘image’) ? array(“a href='{$link}'{$blank}”,’a’) : array(‘div’,’div’);
$caption = “”;
$button_html = “”;
$counter ++;
$button_count = “”;
if(strpos($link_apply, ‘button-two’) !== false){$button_count = “avia-multi-slideshow-button”;}
if(strpos($link_apply, ‘button-three’) !== false){$button_count = “avia-multi-slideshow-button”;} !!!CHANGES !!!//if we got a CTA button apply the link to the button istead of the slide
if(strpos($link_apply, ‘button’) !== false)
{
$button_html .= $this->slideshow_cta_button($link1, $link_target1, $button_color, $button_label, $button_count);
$tags = array(‘div’,’div’);
}if(strpos($link_apply, ‘button-two’) !== false)
{
$button_count .= ” avia-slideshow-button-2″;
$button_html .= $this->slideshow_cta_button($link2, $link_target2, $button_color2, $button_label2, $button_count);
}if(strpos($link_apply, ‘button-three’) !== false) !!!CHANGES !!!!
{
$button_count .= ” avia-slideshow-button-3″;
$button_html .= $this->slideshow_cta_button($link3, $link_target3, $button_color3, $button_label3, $button_count);But all of these amendment have no effect in the backend. There is no new choise for a third button provided.
I don’t know so well all files and the code of the enfold theme. Do you know other files which have to be amended to get the possibility of adding an additional button.
I don’t need a customization of you, just the help to find the places where I have to amend. The rest I can, hopefully, figure out by myself.Thank for your support.
By the way, I could not find a previous post about this topic, if there is any and I missed it, sorry for asking again.
Best, Constanze
September 4, 2017 at 3:42 pm #847789Hey Constanze_Henkel,
To accomplish this, you`ll need to hire a freelance because these modifications don’t include in our support scope.
Best regards,
John Torvik -
AuthorPosts
- You must be logged in to reply to this topic.