animated "play video" button

Hi,

Very sorry for the late reply, it’s been a bit hectic here. You can create that layout by using and icon element inside a 1/4 element. You can see the settings in the screenshot in private.

If you want to import that whole page then you can enable debug mode: http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/, then add this shortcode to a new page:

[av_section min_height='100' min_height_px='500px' padding='default' shadow='no-border-styling' bottom_border='no-border-styling' scroll_down='aviaTBscroll_down' id='' color='main_color' custom_bg='' src='' attachment='' attachment_size='' attach='scroll' position='top left' repeat='no-repeat' video='https://www.youtube.com/watch?v=Wq-DEL2ONGg' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.8' overlay_color='#4ecac2' overlay_pattern='' overlay_custom_pattern='']
[av_three_fourth first]

[av_headline_rotator before_rotating='EVERYTHING UNDER ONE ROOF! WE OFFER GREAT ' after_rotating='' multiline='aviaTBmultiline' interval='3' animation='' tag='h2' size='63' align='left' custom_title='#ffffff']
[av_rotator_item title='MARKETING' link='' linktarget='' custom_title='#315e5b']
[av_rotator_item title='USER EXPERIENCE' link='' linktarget='' custom_title='#315e5b']
[av_rotator_item title='CUSTOMER SUPPORT' link='' linktarget='' custom_title='#315e5b']
[av_rotator_item title='DESIGN SKILLS' link='' linktarget='' custom_title='#315e5b']
[/av_headline_rotator]

[av_hr class='custom' height='50' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#ffffff' custom_margin_top='40px' custom_margin_bottom='40px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello']

[/av_three_fourth][av_one_fourth]

[av_hr class='invisible' height='50' shadow='no-shadow' position='center' custom_border='av-border-thin' custom_width='50px' custom_border_color='' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='yes' custom_icon_color='' icon='ue808' font='entypo-fontello']

[av_font_icon icon='ue897' font='entypo-fontello' style='border' caption='' link='manually,https://vimeo.com/64927358' linktarget='' size='40px' position='center' color='#ffffff']
Watch our Promo Video
[/av_font_icon]

[/av_one_fourth]
[/av_section]

[av_section min_height='' min_height_px='500px' padding='huge' shadow='no-border-styling' bottom_border='no-border-styling' id='' color='main_color' custom_bg='' src='' attachment='' attachment_size='' attach='scroll' position='top left' repeat='no-repeat' video='' video_ratio='16:9' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='']
[av_one_fifth first]

[/av_one_fifth][av_three_fifth]

[av_heading tag='h1' padding='10' heading='We create <strong>high quality products</strong> that are used and loved by thousands of customers' color='' style='blockquote modern-quote modern-centered' custom_font='' size='40' subheading_active='' subheading_size='15' custom_class=''][/av_heading]

[/av_three_fifth][av_one_fifth]

[/av_one_fifth][av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#000000' custom_margin_top='70px' custom_margin_bottom='70px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello']

[av_one_third first]

[av_textblock size='' font_color='' color='']
<h3>Lorem ipsum dolor sit amet</h3>
Consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

<a href="#">Learn more...</a>
[/av_textblock]

[/av_one_third][av_one_third]

[av_textblock size='' font_color='' color='']
<h3>Lorem ipsum dolor sit amet</h3>
Consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

<a href="#">Learn more...</a>
[/av_textblock]

[/av_one_third][av_one_third]

[av_textblock size='' font_color='' color='']
<h3>Lorem ipsum dolor sit amet</h3>
Consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

<a href="#">Learn more...</a>
[/av_textblock]

[/av_one_third]
[/av_section]

[av_image_hotspot src='https://kriesi.at/themes/enfold-startup/files/2015/02/desat-gb_macbook.jpg' attachment='466' attachment_size='full' animation='fade-in' hotspot_layout='numbered' hotspot_tooltip_display='av-permanent-tooltip' hotspot_mobile='aviaTBhotspot_mobile']
[av_image_spot tooltip_pos='av-tt-pos-above av-tt-align-right' tooltip_width='av-tt-large-width' tooltip_style='main_color' link='' hotspot_color='custom' custom_bg='#4ecac2' custom_font='#ffffff' custom_pulse='' hotspot_pos='35.9,31.2']
First of all select the "<strong>Enfold</strong>" option from your admin menu
[/av_image_spot]
[av_image_spot tooltip_pos='av-tt-pos-left av-tt-align-top' tooltip_width='av-tt-default-width' tooltip_style='main_color' link='' hotspot_color='custom' custom_bg='#4ecac2' custom_font='#ffffff' custom_pulse='' hotspot_pos='58.6,35.4']
Open the demo import tab
[/av_image_spot]
[av_image_spot tooltip_pos='av-tt-pos-right av-tt-align-centered' tooltip_width='av-tt-large-width' tooltip_style='main_color av-tooltip-shadow' link='' hotspot_color='custom' custom_bg='#4ecac2' custom_font='#ffffff' custom_pulse='' hotspot_pos='65.1,52.6']
Select the demo you like and click the <strong>import</strong> button
[/av_image_spot]
[av_image_spot tooltip_pos='av-tt-pos-right av-tt-align-bottom' tooltip_width='av-tt-default-width' tooltip_style='main_color' link='' hotspot_color='custom' custom_bg='#4ecac2' custom_font='#ffffff' custom_pulse='' hotspot_pos='32.2,68']
Save the page once you are done
[/av_image_spot]
[/av_image_hotspot]

[av_button_big label='Learn more' description_pos='below' link='manually,http://' link_target='' icon_select='no' icon='ue800' font='entypo-fontello' custom_font='#ffffff' color='theme-color' custom_bg='#444444' color_hover='custom' custom_bg_hover='#444444'][/av_button_big]

[av_section min_height='' min_height_px='500px' padding='huge' shadow='no-border-styling' bottom_border='border-extra-arrow-down' id='' color='main_color' custom_bg='' src='' attachment='' attachment_size='' attach='scroll' position='top left' repeat='no-repeat' video='' video_ratio='16:9' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='']

[av_heading heading='What our customers say about us' tag='h1' style='blockquote modern-quote modern-centered' size='40' subheading_active='' subheading_size='15' padding='10' color='' custom_font=''][/av_heading]

[av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#000000' custom_margin_top='40px' custom_margin_bottom='40px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello']

[av_testimonials style='slider_large' columns='2' interval='5' font_color='' custom_title='' custom_content='#bcbcbc']
[av_testimonial_single src='468' name='Markus Meyer' subtitle='CEO' link='#' linktext='Floorfilla Media']
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
[/av_testimonial_single]
[av_testimonial_single src='472' name='Susan Charice' subtitle='CTO' link='#' linktext='Mambajuice']
Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
[/av_testimonial_single]
[/av_testimonials]

[/av_section][av_section min_height='75' min_height_px='500px' padding='large' shadow='no-border-styling' bottom_border='no-border-styling' id='' color='main_color' custom_bg='#f8f8f8' src='https://kriesi.at/themes/enfold-startup/files/2015/02/hipster-working.jpg' attachment='473' attachment_size='full' attach='parallax' position='center right' repeat='stretch' video='' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.3' overlay_color='#ffffff' overlay_pattern='' overlay_custom_pattern='']
[av_three_fifth first]

[/av_three_fifth][av_two_fifth]

[av_heading heading='Who are we? What do we do?' tag='h1' style='blockquote modern-quote' size='' subheading_active='' subheading_size='15' padding='10' color='' custom_font=''][/av_heading]

[av_hr class='custom' height='50' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#000000' custom_margin_top='10px' custom_margin_bottom='10px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello']

[av_textblock size='' font_color='' color='']
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

<a href="#">Learn more...</a>
[/av_textblock]

[/av_two_fifth]
[/av_section]

[av_section min_height='' min_height_px='500px' padding='default' shadow='no-border-styling' bottom_border='no-border-styling' id='' color='main_color' custom_bg='' src='' attachment='' attachment_size='' attach='scroll' position='top left' repeat='no-repeat' video='' video_ratio='16:9' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='']
[av_one_fifth first]

[/av_one_fifth][av_three_fifth]

[av_heading heading='Developed with the <strong>best partners</strong> you can think of' tag='h1' style='blockquote modern-quote modern-centered' size='40' subheading_active='' subheading_size='15' padding='10' color='' custom_font=''][/av_heading]

[/av_three_fifth][av_one_fifth]

[/av_one_fifth][av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#000000' custom_margin_top='40px' custom_margin_bottom='40px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello']

[av_partner columns='5' heading='' size='no scaling' border='av-border-deactivate' type='slider' animation='slide' navigation='no' autoplay='true' interval='5']
[av_partner_logo id='474'][/av_partner_logo]
[av_partner_logo id='475'][/av_partner_logo]
[av_partner_logo id='476'][/av_partner_logo]
[av_partner_logo id='477'][/av_partner_logo]
[av_partner_logo id='478'][/av_partner_logo]
[av_partner_logo id='479'][/av_partner_logo]
[av_partner_logo id='480'][/av_partner_logo]
[av_partner_logo id='481'][/av_partner_logo]
[av_partner_logo id='482'][/av_partner_logo]
[av_partner_logo id='483'][/av_partner_logo]
[/av_partner]
[/av_section]

[av_section min_height='75' min_height_px='500px' padding='large' shadow='no-border-styling' bottom_border='no-border-styling' id='' color='main_color' custom_bg='' src='https://kriesi.at/themes/enfold-startup/files/2015/02/desat-laptop.jpg' attachment='484' attachment_size='full' attach='parallax' position='center center' repeat='stretch' video='' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.5' overlay_color='#ffffff' overlay_pattern='' overlay_custom_pattern='']
[av_one_fifth first]

[/av_one_fifth][av_three_fifth]

[av_heading tag='h1' padding='10' heading='Want to know when we got news on our latest product? <strong>Sign up for our newsletter now!</strong>' color='custom-color-heading' style='blockquote modern-quote modern-centered' custom_font='#000000' size='40' subheading_active='' subheading_size='15' custom_class=''][/av_heading]

[/av_three_fifth][av_one_fifth]

[/av_one_fifth][av_one_third first]

[/av_one_third][av_one_third]

[av_contact  (Email address hidden if logged out) ' title='' button='Sign Up' on_send='redirect' sent='Your message has been sent!' link='page,18' subject='' autorespond='' captcha='' hide_labels='aviaTBhide_labels' color='']
[av_contact_field label='E-Mail' type='text' options='' check='is_email' width='element_three_fourth' multi_select=''][/av_contact_field]


[/av_contact]

[/av_one_third][av_one_third]

[/av_one_third]
[/av_section]

Best regards,
Rikard

Hi,

No, the code is for the whole page, so that you can see how it’s done. Did you try it out?

Best regards,
Rikard

Hi Chris,

You can probably create that in a Layer Slider, but I think it will be difficult if you want to use elements from the builder since you would have to use shortcode. Have a look at the demo page I sent you.

Best regards,
Rikard