[SOLVED]Adding shortcode to event list Events Calendar pro

Not sure but it worked ;) Please see login details in PC.

Regards,

Steven

Hi,

Thanks for the reply. This code works fine for the single events and single posts page. However I’d like to have that shotcode in the page with the events list itself

Update:
I inserted this code in the content.php (in my child theme) and it works.

<?php echo do_shortcode("[av_slideshow size='no scaling' animation='slide' autoplay='false' interval='5' control_layout='av-control-default' custom_class='']
[av_slide slide_type='image' id='222' video='' mobile_image='' fallback_link='' video_ratio='' title='' link_apply='' link='lightbox' link_target='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size=''][/av_slide]

[/av_slideshow]"); ?>

Now I only need to have it full width. Thanks in advance!
Best regards,

Steven

Hi Ismael,

It does displays the header in the Event List page (how do we get it full width). Changing av_slideshow_full size=’no scaling’ to av_slideshow_full size=’no scaling’ doesn’t do the trick.

BTW, after adding your code in the functions.php, it adds that header to the single event page as well. So I changed the statement under Layer slider in single post page and single event page: if( is_singular(array( 'post', 'tribe_events' to if( is_singular(array( 'post' I tested it and it works.

So basically the only question is how to get the header in your code full width.

Regards,

Steven

Hi,

Thanks. Works like a charm!

Regards,

Steven

Hi Guys,

Indeed this works for the desktop version. However I forgot that we need a (smaller) static image as header for the mobile version. How can I achieve that? Normally I would use a CSS media query for that, but I’m not sure how to dothis in this case. So the goal is: Show the slideshow on desktop version (and hide the static image) and show the static image on mobile (and hide the slideshow)

Thanks in advance!

Regards,

Steven

Hi Yigit,

That’s what you do in a normal page (show hide content sections based on screen) but this page is one generated by Events Calendar so therefore we had to use this code with shortcode. I do see mobile_image='' fallback_link='' in the shortcode but where do I select that option when adding a image to slider via the magic wand? See screendump. I can’t find that option here. It’s only visible when selecting a video.

Cheers,

Steven

Hi,

Thanks for your answer, However I dont’t want a videoslide but a image slide and when inserting that, there’s no option for a fallback image.

Regards,

Steven

Hi,
I’m not sure if we are on the same subject. Again, that’s what you do in a normal page (show hide content sections based on screen) but this page is one generated by Events Calendar so therefore we had to use this code with shortcode and put it in functions.php in order to have the slider displayed. Latest thing I tried was:
Enable debug mode, used the advanced layout editor, added a slider with screen options (not showing on smaller screens) and below my mobile image with screen options (hide on larger screens.
This is de code I’ve put in the functions.php:

/*
  * Layer slider in Tribe Events List page and Single Event page
  */ 
add_action('ava_after_main_container', 'avf_tribe_events_before_html_slider', 10, 1);
function avf_tribe_events_before_html_slider($before) {
	if( is_post_type_archive('tribe_events') ) {
	  echo do_shortcode("[av_slideshow_full size='no scaling' min_height='0px' stretch='' animation='slide' conditional_play='' autoplay='false' interval='5' control_layout='av-control-default' src='' attachment='' attachment_size='' position='top left' repeat='no-repeat' attach='scroll' av-small-hide='aviaTBav-small-hide' av-mini-hide='aviaTBav-mini-hide' av_uid='av-nordxb' custom_class='']
[av_slide_full slide_type='image' id='642' video='http://' mobile_image='' fallback_link='http://' video_format='' video_ratio='16:9' title='' custom_title_size='' custom_content_size='' caption_pos='caption_bottom' link_apply='' link='lightbox' link_target='' button_label='Click me' button_color='light' link1='manually,http://' link_target1='' button_label2='Click me' button_color2='light' link2='manually,http://' link_target2='' font_color='' custom_title='' custom_content='' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-p7aoxr' video_controls='' video_mute='' video_loop='' video_autoplay='' overlay_enable=''][/av_slide_full]

[/av_slideshow_full]

[av_image src='https://www.vakantiepas.nl/site2018/wp-content/uploads/2018/03/mobile_header.jpg' attachment='759' attachment_size='full' align='center' styling='no-styling' hover='' link='' target='' caption='' font_size='' appearance='' overlay_opacity='0.4' overlay_color='#000000' overlay_text_color='#ffffff' copyright='' animation='no-animation' av-desktop-hide='aviaTBav-desktop-hide' av-medium-hide='aviaTBav-medium-hide' av_uid='av-jivm3mwy' custom_class='' admin_preview_bg=''][/av_image]"); 
	}
}

Result is that both show up on large screens as well as mobile screens. See screenshot here.

Hi Ismael,

For some reason it works now. Thanks for the support!

Regards,

Steven