Page 2 – Support | Kriesi.at – Premium WordPress Themes

Which shortcode do I need to apply the link titles to? I am confused

Are you referring to the PHP code?

my page shortcode does have link titles (see below)

[av_section min_height='' min_height_pc='25' min_height_px='500px' padding='small' custom_margin='0px' custom_margin_sync='true' svg_div_top='' svg_div_top_color='#333333' svg_div_top_width='100' svg_div_top_height='50' svg_div_top_max_height='none' svg_div_top_opacity='' svg_div_bottom='' svg_div_bottom_color='#333333' svg_div_bottom_width='100' svg_div_bottom_height='50' svg_div_bottom_max_height='none' svg_div_bottom_opacity='' color='main_color' background='bg_color' custom_bg='#000000' background_gradient_direction='vertical' background_gradient_color1='#000000' background_gradient_color2='#ffffff' background_gradient_color3='' 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='' shadow='no-border-styling' bottom_border='no-border-styling' bottom_border_diagonal_color='#333333' bottom_border_diagonal_direction='' bottom_border_style='' custom_arrow_bg='' id='' custom_class='' template_class='' aria_label='' av_element_hidden_in_editor='0' av_uid='av-gw04d9' sc_version='1.0']

[av_hr class='invisible' icon_select='yes' icon='ue808' font='entypo-fontello' position='center' shadow='no-shadow' height='-25' custom_border='av-border-thin' custom_width='50px' custom_margin_top='30px' custom_margin_bottom='30px' custom_border_color='' custom_icon_color='' id='' custom_class='' template_class='' av_uid='av-fvcgnh' sc_version='1.0' admin_preview_bg='']

[av_heading heading='CHECK OUT OUR OTHER BOWL 360 FRANCHISE ' tag='h3' style='blockquote modern-quote modern-centered' subheading_active='' show_icon='' icon='ue800' font='entypo-fontello' size='26' av-desktop-font-size-title='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' subheading_size='20' av-desktop-font-size='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' icon_size='' av-desktop-font-size-1='' av-medium-font-size-1='' av-small-font-size-1='' av-mini-font-size-1='' color='custom-color-heading' custom_font='#ffffff' subheading_color='' seperator_color='' icon_color='' margin='' margin_sync='true' av-desktop-margin='' av-desktop-margin_sync='true' av-medium-margin='' av-medium-margin_sync='true' av-small-margin='' av-small-margin_sync='true' av-mini-margin='' av-mini-margin_sync='true' headline_padding='' headline_padding_sync='true' av-desktop-headline_padding='' av-desktop-headline_padding_sync='true' av-medium-headline_padding='' av-medium-headline_padding_sync='true' av-small-headline_padding='' av-small-headline_padding_sync='true' av-mini-headline_padding='' av-mini-headline_padding_sync='true' padding='10' av-desktop-padding='' av-medium-padding='' av-small-padding='' av-mini-padding='' icon_padding='10' av-desktop-icon_padding='' av-medium-icon_padding='' av-small-icon_padding='' av-mini-icon_padding='' link='manually,http://' link_dynamic='' link_target='' title_attr='' id='' custom_class='' template_class='' av_uid='av-esbpnx' sc_version='1.0' admin_preview_bg='']
Birthdays. Holidays. Parties for the kids. Parties for the office. Parties for you and your friends. When you’re ready to celebrate, then it’s time to BE BOWLED. Bring your party to the lanes and get ready for one unforgettable event.
[/av_heading]

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

[av_partner heading='' type='grid' columns='8' navigation='arrows' control_layout='av-control-default' nav_visibility_desktop='' nav_arrow_color='' nav_arrow_bg_color='' nav_dots_color='' nav_dot_active_color='' size='no scaling' img_size_behave='' border='' img_border='solid' img_border_width='1' img_border_width_sync='true' img_border_color='#cccccc' border_radius='12' border_radius_sync='true' box_shadow='' box_shadow_style='0px,0px,0px,0px' box_shadow_color='' padding='10px' padding_sync='true' animation='slide' transition_speed='' autoplay='false' interval='5' heading_tag='' heading_class='' img_scrset='' lazy_loading='disabled' el_id='' custom_class='' template_class='' av_uid='av-bil12l' sc_version='1.0']
[av_partner_logo id='2178' id_dynamic='' hover='Bowl 360 Ozone Park' link='manually,https://bowl360.nyc/' link_dynamic='' link_target='_blank' linktitle='Bowl 360 Ozone Park' av_uid='av-9cabb1' sc_version='1.0']
[av_partner_logo id='2180' id_dynamic='' hover='' link='manually,https://bowl360astoria.nyc/' link_dynamic='' link_target='' linktitle='Bowl 360 Astoria' av_uid='av-6z8btp' sc_version='1.0']
[av_partner_logo id='2181' id_dynamic='' hover='' link='manually,https://bowl360brooklyn.nyc/' link_dynamic='' link_target='' linktitle='Bowl360 Brooklyn' av_uid='av-6jvk4t' sc_version='1.0']
[av_partner_logo id='2183' id_dynamic='' hover='' link='manually,http://bowl360newhydepark.com/' link_dynamic='' link_target='' linktitle='Bowl 360 New Hyde Park' av_uid='av-44jhel' sc_version='1.0']
[av_partner_logo id='2184' id_dynamic='' hover='' link='manually,https://bowl360strikecityspringhill.com/' link_dynamic='' link_target='' linktitle='Bowl 360 Strike City Spring Hill' av_uid='av-101zh' sc_version='1.0']
[av_partner_logo id='2220' id_dynamic='' hover='' link='manually,https://island360restaurant.com/' link_dynamic='' link_target='' linktitle='Island 360 Restaurant' av_uid='av-101zh-2' sc_version='1.0']
[av_partner_logo id='2222' id_dynamic='' hover='' link='manually,https://paddles360.com/' link_dynamic='' link_target='' linktitle='Paddles 360' av_uid='av-101zh-1' sc_version='1.0']
[av_partner_logo id='2260' id_dynamic='' hover='' link='manually,https://uptownbarandgrill360.com/' link_dynamic='' link_target='' linktitle='Uptown Bar and Grill' av_uid='av-101zh-1-1' sc_version='1.0']
[/av_partner]

[/av_section]

January 3, 2025 at 2:47 pm #1474565

In reply to: Is it possible to animate automatically the Icon Circles?

abortolotti

Thank you for the reply @Guenni007 and for the sample website you gave me.

Unfortunately, that doesn’t seem to do what I mean, as the animation goes normally also on our site when you start scrolling the page; for the site you sent me, you still have to hover over the icons to display their content inside the center of the circle.

What I would like to do is for everything to show without having to hover over the icon, i.e. you start seeing the logo inside the circle, then after 2 seconds you see the content of the first icon displayed, then after 2 seconds you see the content of the second icon displayed and lastly, after another 2 seconds you see the content of the third icon displayed in the center.
So everything would display automatically, as nearly nobody would point the mouse to the icons to reveal content, since nobody knows and the vast majority don0t event imagine there is something else to view.

Hope that makes sense and hope that is something feasible, or if not, maybe that is a new feature to add to the next version of Enfold.

Thanks

January 3, 2025 at 9:06 am #1474513

Topic: Is it possible to animate automatically the Icon Circles?

in forum Enfold

abortolotti

Participant

Hey there,

We love the Icon Circle element for the site we’re making now, but nearly nobody hover over the icon circle and therefore doesn’t view the content of each circle.

Is there a way to set an timed autodisplay of the Icon circles content automatically, while scrolling the page?

Here’s a screenshot of the page I mean:

Icon Circle

Ideally, this would be the behaviour:

1. logo shows in the center, then after 2-3 seconds
2. First dot on top animates and shows up content in the center, then 2 seconds later,
3. Second dot on the right animates and shows up content in the center, then 2 seconds later,
4. Third and last dot on the left animates and show up content in the center.

Maybe also on loop, so it continues.

Is it possible?

Thank you for your help.

Antonio

December 10, 2024 at 12:55 pm #1473329

In reply to: remove container wrappers around code widget

philipe

Hello Ismael – yes I added that code, as per the code I posted to you, you can see it in the first line. What I am trying to do is create a video scrubber scrolling effect. This requires the container to be at that height, so the scroll is tied to the video position (see rest of code). Then to remove the height so it works similarly to parallax then we use section.vid div.holder {position:sticky!important; top:0!important;}. Making the screen stick to enable the scrolling video. However the problem is that Enfold automatically generates container tags around a code block. Therefore these div containers are also being set at that height of the section.vid box. My original question was how do we insert code without the container tags being generated, which would be the cleanest method. If that is not possible, then is there another solution to make the container tags also the same size? Any ideas appreciated. Thanks, Philip.

December 4, 2024 at 9:28 am #1472855

In reply to: Need help to install demo

Rikard

Keymaster

Hey evadietetique,

It might be easier if you simply add the shortcodes for that demo to a new page, since it’s only a single page. Please activate debug mode under Enfold->Layout Builder->Show Advanced Options, then paste this shortcode in the window which will appear under the regular layout window:

[av_layout_row border='' min_height_percent='100' min_height='0' color='main_color' mobile='av-flex-cells' id='welcome' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-busuf8']
[av_cell_one_half vertical_align='middle' padding='200px,0px,200px,0px' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/freelancer-girl.jpg' attachment='219' attachment_size='full' background_attachment='scroll' background_position='center center' background_repeat='stretch' mobile_display='' av_uid='av-bqgyjg']

[/av_cell_one_half][av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/bg.jpg' attachment='217' attachment_size='full' background_attachment='scroll' background_position='center center' background_repeat='stretch' mobile_display='' av_uid='av-bjr95g']

[av_heading tag='h1' padding='0' heading='Welcome!' color='' style='blockquote modern-quote' custom_font='' size='60' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-bclyt0'][/av_heading]

[av_hr class='custom' height='50' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-b880uk']

[av_textblock size='25' font_color='custom' color='#000000' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='' av_uid='av-13rf10']
I am Sarah, an experienced California based freelancer. I specialise in graphic design & user interfaces as well as photo, video & audio editing.
[/av_textblock]

[av_hr class='invisible' height='10' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-awl6x0']

[av_button label='Learn more!' link='manually,#next-section' link_target='' size='large' position='left' icon_select='no' icon='ue800' font='entypo-fontello' color='custom' custom_bg='#c3aca1' custom_font='#ffffff' admin_preview_bg='' av_uid='av-am3mbo']

[/av_cell_one_half]
[/av_layout_row]

[av_layout_row border='' min_height_percent='100' min_height='0' color='main_color' mobile='av-flex-cells' id='recent' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-ajcq50']
[av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='#d3c3bc' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='center center' background_repeat='contain' mobile_display='' av_uid='av-ab65z0']

[av_heading tag='h1' padding='0' heading='Recent Projects' color='custom-color-heading' style='blockquote modern-quote modern-centered' custom_font='#ffffff' size='60' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='rgb(34, 34, 34)' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-a8puyk'][/av_heading]

[av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#ffffff' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-a2eatw']

[av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-9v34ak']
<p style="text-align: center;">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.</p>
[/av_textblock]

[av_hr class='invisible' height='10' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-9piuf0']

[av_masonry_gallery ids='230,229,228,227,226,225' items='6' columns='2' paginate='none' size='fixed' orientation='av-orientation-square' gap='large' overlay_fx='active' container_links='active' id='' caption_elements='none' caption_styling='' caption_display='always' color='custom' custom_bg='#bfada5' av-medium-columns='' av-small-columns='' av-mini-columns='' av_uid='av-9g38c4']

[av_hr class='invisible' height='10' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-9eclpg']

[/av_cell_one_half][av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/sketches.jpg' attachment='223' attachment_size='full' background_attachment='fixed' background_position='center right' background_repeat='stretch' mobile_display='av-hide-on-mobile' av_uid='av-96xub8']

[/av_cell_one_half]
[/av_layout_row]

[av_layout_row border='' min_height_percent='100' min_height='0' color='main_color' mobile='av-flex-cells' id='services' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-90wqq4']
[av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/laptop-hands.jpg' attachment='220' attachment_size='full' background_attachment='fixed' background_position='center center' background_repeat='stretch' mobile_display='av-hide-on-mobile' av_uid='av-8tm1xo']

[/av_cell_one_half][av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='center center' background_repeat='contain' mobile_display='' av_uid='av-8pbwjw']

[av_heading tag='h1' padding='0' heading='Services' color='custom-color-heading' style='blockquote modern-quote modern-centered' custom_font='#c3aca1' size='60' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='rgb(255, 255, 255)' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-8hz9jo'][/av_heading]

[av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#c3aca1' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-8abezo']

[av_textblock size='' font_color='custom' color='#c3aca1' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-86jvd0']
<p style="text-align: center;">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.</p>
[/av_textblock]

[av_hr class='invisible' height='60' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-82hb4k']

[av_one_half first min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-7sqofw']

[av_font_icon icon='ue826' font='entypo-fontello' style='' caption='' link='' linktarget='' size='60px' position='center' color='#c3aca1' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-7rluj8'][/av_font_icon]

[av_hr class='invisible' height='20' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-7kegkk']

[av_textblock size='' font_color='custom' color='#c3aca1' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-7fhz6c']
<h4 style="text-align: center;">Research</h4>
<p style="text-align: center;">Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
[/av_textblock]

[av_hr class='custom' height='8' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#c3aca1' custom_margin_top='40px' custom_margin_bottom='0px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' av-small-hide='aviaTBav-small-hide' av-mini-hide='aviaTBav-mini-hide' admin_preview_bg='' av_uid='av-75qm98']

[/av_one_half][av_one_half min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-737w1w']

[av_font_icon icon='ue8c0' font='entypo-fontello' style='' caption='' link='' linktarget='' size='60px' position='center' color='#c3aca1' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-6ty4mc'][/av_font_icon]

[av_hr class='invisible' height='20' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-6p8lzw']

[av_textblock size='' font_color='custom' color='#c3aca1' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-6iw7rw']
<h4 style="text-align: center;">Design</h4>
<p style="text-align: center;">Lorem ipsum dolor sit amet, consectetlit. Aenean eget dolor.</p>
[/av_textblock]

[av_hr class='custom' height='8' shadow='no-shadow' position='center' custom_border='av-border-fat' custom_width='50px' custom_border_color='#c3aca1' custom_margin_top='40px' custom_margin_bottom='0px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' av-small-hide='aviaTBav-small-hide' av-mini-hide='aviaTBav-mini-hide' admin_preview_bg='' av_uid='av-6d8t8s']

[/av_one_half][av_one_half first min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-66pnys']

[av_font_icon icon='ue80e' font='entypo-fontello' style='' caption='' link='' linktarget='' size='60px' position='center' color='#c3aca1' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-5zd8oc'][/av_font_icon]

[av_hr class='invisible' height='20' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-5xjz50']

[av_textblock size='' font_color='custom' color='#c3aca1' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-5os6b8']
<h4 style="text-align: center;">Photography</h4>
<p style="text-align: center;">Lorem ipsum dolor sit amet, consectetlit. Aenean eget dolor.</p>
[/av_textblock]

[/av_one_half][av_one_half min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-5jx5dw']

[av_font_icon icon='ue856' font='entypo-fontello' style='' caption='' link='' linktarget='' size='60px' position='center' color='#c3aca1' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-5d2kuc'][/av_font_icon]

[av_hr class='invisible' height='20' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-59xkxw']

[av_textblock size='' font_color='custom' color='#c3aca1' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(255, 255, 255)' av_uid='av-50iuhw']
<h4 style="text-align: center;">Development</h4>
<p style="text-align: center;">Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
[/av_textblock]

[/av_one_half][/av_cell_one_half]
[/av_layout_row]

[av_layout_row border='' min_height_percent='100' min_height='0' color='main_color' mobile='av-flex-cells' id='about' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-4usz8c']
[av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='#d3c3bc' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='center center' background_repeat='contain' mobile_display='' av_uid='av-4pxp1o']

[av_heading tag='h1' padding='0' heading='About me' color='custom-color-heading' style='blockquote modern-quote' custom_font='#ffffff' size='60' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='rgb(34, 34, 34)' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-4k9wmk'][/av_heading]

[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='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-4dvesc']

[av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-46o1lg']
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_textblock]

[av_hr class='invisible' height='10' shadow='no-shadow' position='left' custom_border='av-border-fat' custom_width='50px' custom_border_color='#0a0a0a' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='' av_uid='av-41bgq4']

[av_heading tag='h1' padding='0' heading='Skills' color='custom-color-heading' style='blockquote modern-quote' custom_font='#ffffff' size='30' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='rgb(34, 34, 34)' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-3x52dg'][/av_heading]

[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='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-3o141o']

[av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-3kiqnw']
Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
[/av_textblock]

[av_one_full first min_height='' vertical_alignment='av-align-top' space='' custom_margin='aviaTBcustom_margin' margin='10px' margin_sync='true' padding='30px' padding_sync='true' border='5' border_color='#c3aca1' radius='0px' radius_sync='true' background_color='#ffffff' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-c0rn0']

[av_progress bar_styling='av-flat-bar' bar_animation='av-animated-bar' bar_styling_secondary='av-small-bar' show_percentage='av-show-bar-percentage' bar_height='4' admin_preview_bg='' av_uid='av-39fubo']
[av_progress_bar title='Web Design' progress='100' color='theme-color' icon_select='no' icon='43' font='entypo-fontello' av_uid='av-30j064']
[av_progress_bar title='Web Development' progress='90' color='theme-color' icon_select='no' icon='43' font='entypo-fontello' av_uid='av-2ubch0']
[av_progress_bar title='Photography' progress='90' color='theme-color' icon_select='no' icon='43' font='entypo-fontello' av_uid='av-2t3k30']
[/av_progress]

[/av_one_full][/av_cell_one_half][av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/freelance-girl-relax.jpg' attachment='218' attachment_size='full' background_attachment='fixed' background_position='center right' background_repeat='stretch' mobile_display='av-hide-on-mobile' av_uid='av-2ietrw']

[/av_cell_one_half]
[/av_layout_row]

[av_layout_row border='' min_height_percent='100' min_height='0' color='main_color' mobile='av-flex-cells' id='contact' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-2extrw']

[av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='' src='https://kriesi.at/themes/enfold-freelancer/files/2017/09/tochscreen.jpg' attachment='224' attachment_size='full' background_attachment='fixed' background_position='center center' background_repeat='stretch' mobile_display='av-hide-on-mobile' av_uid='av-280shw']

[/av_cell_one_half][av_cell_one_half vertical_align='middle' padding='100px' padding_sync='true' background_color='#85a7ca' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='center right' background_repeat='contain' mobile_display='' av_uid='av-23kzes']

[av_heading tag='h1' padding='0' heading='Get in touch' color='custom-color-heading' style='blockquote modern-quote' custom_font='#ffffff' size='60' subheading_active='' subheading_size='15' custom_class='' admin_preview_bg='rgb(34, 34, 34)' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' 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-1z2mi4'][/av_heading]

[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='30px' custom_margin_bottom='30px' icon_select='no' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-1rakpo']

[av_one_half first min_height='' vertical_alignment='av-align-top' space='' margin='0px' margin_sync='true' padding='0px' padding_sync='true' border='' border_color='#a95e33' radius='0px' radius_sync='true' background_color='' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-1lcqes']

[av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='' av_uid='av-1f2rdo']
<h2>Address</h2>
10800 West Pico Boulevard Infinity Loop
Cupertino, Los Angeles, USA
<h2></h2>
[/av_textblock]

[/av_one_half][av_one_half min_height='' vertical_alignment='av-align-top' space='' margin='0px' margin_sync='true' padding='0px' padding_sync='true' border='' border_color='#a95e33' radius='0px' radius_sync='true' background_color='' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-172ues']

[av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' admin_preview_bg='' av_uid='av-10nq70']
<h2>Opening Hours:</h2>
Mo-Fr: 8:00-19:00
Sa: 8:00-14:00
So: closed
<h2></h2>
[/av_textblock]

[/av_one_half][av_contact email='' title='' button='Submit' on_send='' sent='Your message has been sent!' link='manually,http://' subject='' autorespond='' captcha='' hide_labels='aviaTBhide_labels' form_align='' color='av-custom-form-color av-light-form' admin_preview_bg='rgb(34, 34, 34)' av_uid='av-vk6xw']
[av_contact_field label='Name' type='text' check='is_empty' options='' multi_select='' av_contact_preselect='' width='' av_uid='av-2fvqs'][/av_contact_field]
[av_contact_field label='E-Mail' type='text' check='is_email' options='' multi_select='' av_contact_preselect='' width='' av_uid='av-k3aqs'][/av_contact_field]
[av_contact_field label='Subject' type='text' check='is_empty' options='' multi_select='' av_contact_preselect='' width='' av_uid='av-hlg6c'][/av_contact_field]
[av_contact_field label='Message' type='textarea' check='is_empty' options='' multi_select='' av_contact_preselect='' width='' av_uid='av-pq38'][/av_contact_field]
[/av_contact]

[/av_cell_one_half][/av_layout_row]

Best regards,
Rikard

November 27, 2024 at 5:29 am #1472326

In reply to: automatic sizing of vertical images

Hi,

for example horizontal photos are visible in their entirety because they are automatically adapted to the screen,

Some images appear fully visible on mobile because their aspect ratio differs from the phone browser’s viewport. In portrait mode, the viewport is taller than most images with a landscape proportion, making them fully visible. Please note that images automatically adjust to occupy the space of their parent container. If you want to control how the images are resized and make them fully visible on certain screens with different aspect ratio, you need to apply a custom css class name to them and adjust their width or height manually. For example, you can set the image width to 50%, and the image will resize proportionally to its height.

@media only screen and (max-width: 1366px) {
     /* Add your Mobile Styles here */
     .av-limit-image-height img.avia_image {
        width: 50%;
        margin: 0 auto;
    }
}

Again, you need to apply the class name “av-limit-image-height” to the Image element. However, focusing on whether the images are fully visible on load may not be necessary, as users can still scroll to view the content.

Best regards,
Ismael

November 27, 2024 at 3:28 am #1472322

Topic: Post slider image height

in forum Enfold

nyoung_web

Participant

I’m still new to WordPress/Enfold and I’m trying to set the thumbnail for a post slider to the same height.
In the link of the test page, the post slider after the first image has one thumbnail that is at 1210 x 420, and the others 1080 x 420.
I want them all to appear at a certain height, preferably the same height as the one with the 1210 x 420 dimension.
The slider’s image size is set to “Entry without sidebar (1210×423)”.

Below is the custom css I added over the course of solving multiple issues, so some of them may be working against each other. I would appreciate any advice about the custom css below or any additional one(s) that could achieve the look I want.

#top .avia-content-slider .slide-entry-title { font-size: 1em; }

#top .post-entry .blog-categories {
  	font-size: 0.9em;
    font-weight: normal; }

#top .content .entry-content-wrapper {
	padding-right: 0px;
}

#top .avia-slideshow-inner {
	float: center;
}

#top .avia-content-slider .slide-entry-wrap {
	float: center;
}

#top .avia-content-slider-inner {
	margin: 0px;
	overflow: hidden !important;
}

#top .avia-content-slider　{
	display: flex;
}

#top .avia-content-slider　.slide-image img{
	height: auto !important;
}

.avia_desktop .avia-content-slider .avia-slideshow-arrows a{ opacity: 1; }

@media only screen and (max-width: 479px)
{
	.responsive #top #wrap_all .slide-entry{width:48%; margin-left:4%}
	.responsive #top #wrap_all .avia-content-slider-even .slide-entry.slide-parity-odd,
	.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.slide-parity-even{margin:0; clear:both;}
	.responsive #top #wrap_all .avia-content-slider-odd  .slide-entry.first{margin-left:0; width:100%;}
	.responsive .avia-content-slider .slide-image img { width: 100%; }
	.responsive #top .avia-slideshow-arrows a{ 
		display:block !important; 
		opacity: 1; 
		font-size: 20px; 
		width: 60px;
		height: 60px;
		top: 30%;
    margin: -30px 0 0;
		text-align: center;
	}
}

#top .scroll-down-link {
    height: 60px;
    width: 80px;
    margin: 0px 0 0 -40px;
    line-height: 60px;
    position: absolute;
    left: 50%;
    bottom: 25px;
    color: #263238;
    text-align: center;
    font-size: 70px;
    z-index: 100;
    text-decoration: none;
	  text-shadow: 0px 0px 5px rgba(0, 0, 0, 0);
}

November 18, 2024 at 8:34 am #1471530

In reply to: Woocommcer / Enfold / Home page freezes after adding to cart

Hi,

Thank you for the inquiry.

The page can’t be scrolled due to this css rule, which is applied after adding an item to the cart:

body.xoo-wsc-cart-active, html.xoo-wsc-cart-active {
    overflow: hidden!important;
}

You can override it with the following css code:

body.xoo-wsc-cart-active, html.xoo-wsc-cart-active {
    overflow: auto!important;
}

Best regards,
Ismael

November 15, 2024 at 6:23 am #1471354

In reply to: I do not have the correct easy slider with all options

Hi,

Thank you for the inquiry.

Unfortunately, there is no built-in option to delay the animation until the user scrolls to the slider. To achieve this, you can use the LayerSlider element as suggested previously. You’ll need to enable the Project Settings > Slideshow > Slideshow Behavior > Start only in Viewport option and disable the Auto-start slideshow option.

Best regards,
Ismael

October 16, 2024 at 9:10 am #1469199

In reply to: Tabelle wird auf Mobilnicht richtig angezeigt – Table is not displayed correctly

Hi,

Thank you for the inquiry.

Please edit all the Text Blocks with the table element, go to Advanced > Developer Settings panel, apply the name “av-custom-text-table” in the Custom CSS Class field, then add this css code to make the tables scrollable in mobile view.

.av-custom-text-table {
    overflow: auto;
}

Best regards,
Ismael

September 25, 2024 at 1:31 pm #1467805

In reply to: Right Sidebar Menu Sticky

or – maybe a simpler idea – we use the left header sidebar ! – and just handle the #wrap_all as a flex container – and define the order in this way that the header goes to the right side

@media only screen and (min-width: 768px) {
  #wrap_all {
    display: flex !important;
    flex-flow: row nowrap;
  }

  #wrap_all #header {
    order: 2;
    flex: 0 1 27%;
    right: 0;
    left: auto;
  }

  #wrap_all #main {
    order: 1;
    flex: 0 1 73%;
    margin-left: 0 !important;
    border-left: none !important;
  }
  
  .responsive #top .header_bg {
    box-shadow: -5px 0px 5px -5px #666;
  }

  /*** because submenu is defined to a width of 208px ***/
  #top #avia-menu > li.dropdown_ul_available > ul.sub-menu {
    left: -207px
  }

  /*** have a bit more space from main menu-item to the fly-out submenu ***/
  .html_header_sidebar #header .av-main-nav>li {
    margin-left: 5px !important;
    padding-left: 13px;
  }
}

@media only screen and (min-width: 990px)  {
  #wrap_all #header {
    flex: 0 1 300px;
  }

  #wrap_all #main {
    flex: 0 1 calc(100% - 300px);
  }
}

see: https://enfold.webers-webdesign.de/
( the scroll away after some time does not belong to that settings here. – this is part of the inital Headersetting )

this is not styled to the end – becaue i want to go back to the original setting of header on top.
above all, you now have to extend the subnavigation to the left – but that shouldn’t be a problem using css.

September 25, 2024 at 10:20 am #1467794

In reply to: Right Sidebar Menu Sticky

manurimini

Hello Ismael
For now I’ve solved the issue by adding a scrollbar to the header to have the menu visible in every screen height.

#header_main {
  overflow: auto !important;
  max-height: calc(100vh - 40px); /* the -40px works for me but it depends on the lenght of your header */
}

Of course it would be nicer to have a function to make it scrollable as in the Left Sidebar Menu without the sidebar but my knowledge of php and js is very poor
Best wishes
Manu

This reply was modified 1 year, 2 months ago by manurimini.

September 25, 2024 at 10:18 am #1467793

In reply to: Right Sidebar Menu Sticky

manurimini

Hello Guenni
First of all, I would like to thank you for all the interventions you make on this forum that have helped me over the years to solve various issues.
When you use General Layout > Logo And Main Menu > Left Sidebar you have three choices in the tab Sticky Sidebar Menu (You can choose if you want a sticky sidebar that does not scroll with the content):
1 – Never Sticky
2 – Always Sticky
3 – Sticky if Sidebar is smaller then the screen size, scroll otherwise
You have this choices only if you use the Left Sidebar Menu
If you switch to Right Sidebar Menu the options tab Sticky Sidebar Menu is not available and as Ismael wrote with CSS unfortunately the feature “Sticky if Sidebar is smaller then the screen size scroll otherwise” when the right sidebar is enabled is impossible to set.
So, for now I’ve solved the issue by adding a scrollbar to the header to have the menu visible in every screen height.

#header_main {
  overflow: auto !important;
  max-height: calc(100vh - 40px); /* the -40px works for me but it depends on the lenght of your header */
}

Of course it would be nicer to have a function to make it scrollable as in the Left Sidebar Menu without the sidebar but my knowledge of php and js is very poor
Best wishes
Manu

This reply was modified 1 year, 2 months ago by manurimini.

September 16, 2024 at 1:18 pm #1467088

In reply to: Mega Menu

be carefull if you install that child-theme on an existing installation!
Enfold has on Import/Export Options : “Import Settings From Your Parent Theme”. Button –
This generally works smoothly. The child theme then initially adopts the settings of the parent theme – including the quick css settings.

But link above to docu can tell you more detailed

By the way: you do not need to edit this by ftp.
Mostly there is the opportunity to edit the child-theme functions.php via Dashboard:

Dashboard – Appearance – theme file editor ( right side click f.e. on functions.php)

______________________________

after that for that test page of mine i have in quick css:

.avia_mega_div.avia_mega7 {
  right: calc(-100vw) !important;
  width: 95vw;
}

#top  .avia_mega_div > .sub-menu {
  display: grid !important;
  margin:0;
  gap: 20px 0px;
  grid-auto-flow:row;
  grid-template-columns: repeat(7, 1fr);  /*** that means 7 grid-cells with each 1 fraction (same size)  ***/
}

#top #header .avia_mega_div > .sub-menu > li {
  display: block !important;
  width: unset;
  position: relative;
}

#top #header .avia_mega_div {
  max-width: 100vw;  /*** if it is neccessary ***/
}

@media only screen and (min-width: 990px)  and (max-width: 1199px) {
  #top #header .avia_mega_div > .sub-menu {
    grid-template-columns:repeat(4, 1fr);  
  }

  #header .avia_mega_div {
    overflow-y: scroll;  /*** needed - if your mega-div height is too large for your device ***/
    max-height: calc(100vh - 200px);  /*** depends on your header height ***/
  }
}

August 16, 2024 at 4:34 pm #1464785

In reply to: Add changes in config-templatebuilder\avia-shortcodes in childtheme

Hi,
This is only for items in the /avia-shortcodes/ directory and you must add the code to your child theme and add a /shortcodes/ directory to your child theme, please see our documentation here. If the page doesn’t scroll automatically, scroll to Add Elements to ALB

Best regards,
Mike

August 5, 2024 at 5:34 am #1463806

In reply to: [Tab element] Tab section scrollable?

Kanza

Hello back everyone, I’ve managed to solve it by my own after many tests.

Here I share the code, hope it helps someone else:

	.scrollable-tab .av-layout-tab-inner .container {
		position: relative;
		overflow: auto!important;
		max-height: 600px!important;
	}

/* Styles for WebKit (Chrome, Safari) */
	.scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar {
		width: 15px; 
	}

	.scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-track {
		background: #f1f1f1; 
	}

	.scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-thumb {
		background-color: #FF9D26; 
		border-radius: 2px; 
		border: 2px solid #f1f1f1;
	}

	.scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-thumb:hover {
		background-color: #FFB84D; 
	}

If you have any ideas to improve it, please comment.

Regards,

August 4, 2024 at 7:37 pm #1463790

Topic: [Tab element] Tab section scrollable?

in forum Enfold

Kanza

Participant

Is there a way to make a tab section content scrollable over a certain height?

I’ve tried giving a class to a specific tab and adding this css, but it doesn’t seems to work:

	.scrollable-tab {
		position: relative;
		overflow: auto;
		max-height: 500px;
	}

Any ideals?

August 2, 2024 at 11:10 am #1463617

In reply to: Table sortable header row

Kanza

I see you around for years in this forum. Your contribution is awesome! Thank you very much! I’m going now to try with your code.

On your first example, there is a little “box” on the top of the scroll section. From my tests, if you set custom width for columns, that little box turns funny and take a totally random shape and size. Perhaps I did something wrong…

I’m looking to get exactly the same result as the examples I sent in here: https://colorlib.com/etc/tb/Table_Fixed_Header/index.html
But perhaps this is impossible without changing the way Enfold generates tables. From what I know, it takes a custom class at some section that enfold doesn’t automatically generates. And it’s way too hard for me to figure out how to solve that trough JS.

Thank you again, will make some new tests based on your page.
Regards,

July 22, 2024 at 12:09 am #1462630

Topic: Auto launch masonry gallery

in forum Enfold

nTECHgrate

Participant

Hello Enfold Team,

I have a masonry gallery on my homepage, but it doesn’t load until I start to scroll. I want to change this and have it load on page launch. Can you please help with this?

Thanks

-James

July 9, 2024 at 7:26 am #1461660

In reply to: Table of content

Hi,

Thank you for the update.

All post but at the beginning.

You can create a custom shortcode for the TOC widget, then use a template hook to automatically render the TOC on every post. Please add this code to the functions.php file:

add_shortcode('avs_toc', 'avs_toc_function');
function avs_toc_function()
{
    $args = array(
        'name' => 'Displayed Everywhere',
        'id' => 'av_everywhere',
        'description' => '',
        'class' => '',
        'before_widget' => '<section id="avia_auto_toc-2" class="widget clearfix avia_auto_toc">',
        'after_widget' => '<span class="seperator extralight-border"></span></section>',
        'before_title' => '',
        'after_title' => '',
        'widget_id' => 'avia_auto_toc_custom',
        'widget_name' => 'Enfold Child Table of Contents',
    );

    $instance = array(
        'title' => 'Toc',
        'exclude' => '',
        'style' => '',
        'level' => 'h1',
        'single_only' => 1,
        'indent' => 1,
        'smoothscroll' => 1,
    );

    ob_start();
    $toc = new \aviaFramework\widgets\avia_auto_toc;
    $toc->widget($args, $instance);
    $output = ob_get_clean();

    return $output;
}

Then include this hook to render the TOC after the main title:

add_action('ava_after_main_title', function() {
    if(is_single()) echo do_shortcode('[avs_toc]');
}, 10);

Best regards,
Ismael

June 30, 2024 at 4:53 pm #1460645

Topic: How to hide the autoscrolling arrow?

in forum Enfold

Jak73

Participant

Hi,
i added a spacer (thin line). There is a strange autoscrolling arrow.
Could not find settings to disable it.
Please see screenshot.
kind regards Jak

June 24, 2024 at 10:29 pm #1458528

In reply to: Changes to right sidebar header

Top Header – Logo left – menu right.
to have on start to all pages first the hamburger active and to generate the widget area – this to child-theme functions.php:

function custom_burger_menu_active( $active, $context ){
	return true;
	return $active;
}
add_filter('avf_burger_menu_active', 'custom_burger_menu_active', 10, 2 );

add_action('ava_after_footer_output', function() {
  echo '<div id="extra_sidebar" class="container_wrap extra_sidebar_color" role="contentinfo" ><div class="container" style="text-align: center; padding: 10px 0 20px">';
  echo do_shortcode("[av_sidebar widget_area='extra_sidebar']");
  echo '</div></div>';
});

this is for social bookmarks a shortcode to place inside a text-widget :

function social_bookmarks_shortcode() {
$social_args = array('outside'=>'ul', 'inside'=>'li', 'append' => '');
$social = avia_social_media_icons($social_args, false);
return $social;
}
add_shortcode('social-bookmarks', 'social_bookmarks_shortcode');

to use it as : [social-bookmarks]

now goto your widgets and create a new widget area : extra_sidebar
!!! to have on top a free space not to overlap the hamburger icon i placed to that a text-widget on top with an empty div container:

here is the css code: you can fit to your needs the amount of that extra bar:

 .responsive #top #wrap_all #header {
    position: fixed !important;
    height: 100px !important;
  }

.html_header_top #top #header .container {
  width: 100% !important;
  padding: 0;
  max-width: 100% !important;
}

.html_header_top #top #header .main_menu,
.html_header_top #top #header .av-main-nav-wrap,
.html_header_top #top #header .av-burger-menu-main {
  width: 100px;
  margin: 0 !important;
}

.html_header_top #top #header .av-burger-menu-main a {
  padding: 0 !important;
  text-align: center;
}

#top #header_main > .container, 
#top #header_main > .container .main_menu .av-main-nav > li > a, 
#top #header_main #menu-item-shop .cart_dropdown_link {
  height: 100px !important;
  line-height: 100px !important;
}

.header_color .header_bg, 
.header_color .main_menu ul ul, 
.header_color .main_menu .menu ul li a, 
.header_color .pointer_arrow_wrap .pointer_arrow, 
.header_color .avia_mega_div, 
.header_color .av-subnav-menu > li ul, 
.header_color .av-subnav-menu a {
  background-color: transparent !important;
}

.html_header_top.html_header_sticky #top #wrap_all #header {
  box-shadow: none
}

.html_header_top.html_header_sticky #top #wrap_all #main {
  padding-top: 0px !important;
}

.html_av-overlay-side #top .av-burger-overlay-scroll {
  background-color: rgba(0,0,0,0.5) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.responsive #top .av-logo-container .logo {
  display: none !important;
}

#extra_sidebar  {
  display: block;
  position: fixed;
  width: 100px !important;
  height: 100%;
  top: 0;
  right: 0px;
  left: auto;
  background-color: #FFF;
  z-index: 302 !important;
}

#extra_sidebar .container  {
  height: 100%;
}

.html_header_top #top #wrap_all #main {
  width: calc(100% - 100px);
  padding-top: 0px !important;
}

#top #extra_sidebar .avia-builder-widget-area {
  display: flex !important;
  flex-flow: column nowrap;
  justify-content: space-around !important;
  height: 90%;
  padding-top: 250px !important; /*** try your self a good looking value ******/
}

#top #extra_sidebar .avia-builder-widget-area:before,
#top #extra_sidebar .avia-builder-widget-area:after {
  display: none;
}

#top #extra_sidebar .avia-builder-widget-area > * {
  flex: 0 1 auto;
  -ms-writing-mode:tb-rl;
  writing-mode:vertical-rl;
  /*! transform:rotate(180deg); */
}

#top #extra_sidebar .avia-builder-widget-area svg,
#top #extra_sidebar .avia-builder-widget-area img  {
  width: auto;
  height: 70px;
  transform: rotate(90deg);
  transform-origin: top right;
  margin-right: 15px;
}

#top #extra_sidebar .widget ul.social_bookmarks  {
    transform: rotate(90deg) !important;
}

#top #extra_sidebar .widget ul.social_bookmarks li a {
    transform: rotate(-90deg) !important;
}

@media only screen and (min-width: 768px) and (max-width: 989px) {
  .responsive.html_mobile_menu_tablet.html_header_top.html_header_sticky #top #wrap_all #main {
    padding-top: 0px;
  }
}

I don’t know whether existing rules have played a role here. If it doesn’t work right away, please contact me again.

June 18, 2024 at 12:48 pm #1451858

Topic: The Events Calendar Pro – prevent auto scroll to top

in forum Enfold

Marco

Participant

Hi there,

please have a look at the website in private content. The links on the calendar pagination (page number or next/previous button) are causing an auto scroll to top. So the user has to scroll down to get to the events again. Is there any chance to prevent that auto scroll.

I already had the people at the Events Calendar support have a look at the issue, but the issue seems unlikely to be coming from them.

Thanks in advance!

Best regards
Marco

June 18, 2024 at 12:07 am #1451705

In reply to: Alb full width submenu sticky on mobile upgrade

in detail : it is this calculation case:

if( burger_menu.is(":visible") )
{
	this.css({top: 'auto', position: 'absolute'}); fixed = false;
	return;
}

that is replaced by that:

if( burger_menu.is(":visible") && (scrolled + modifier > top_pos) )
{
    this.css({top: header.Height() , position: 'fixed !important'}); fixed = true;
}

and these values are set all to !important in the original menu.css

@media only screen and (max-width: 989px){
	.responsive #top .av-switch-990.av-submenu-container{
		top: auto ;
		position: relative ;
	}
	/**** … ***/
}

@media only screen and (max-width: 767px){
	.responsive #top .av-switch-768.av-submenu-container{
		top: auto ;
		position: relative ;
	}
	/**** … ***/
}

@media only screen and (max-width: 479px){
	.responsive #top .av-switch-480.av-submenu-container{
		top: auto ;
		position: relative ;
	}
	/**** … ***/
}

only if they could be overwritten by that js script – the mobile sticky submenu will work.

June 4, 2024 at 12:54 pm #1447861

In reply to: How to get a different blog format ?

this technique is called : infinite scroll – maybe that older post can help you on that:
https://kriesi.at/support/topic/quick-way-to-add-infinite-scroll/#post-681490

Edit: it still works.
Download that little script: https://jscroll.com/#/installation
and upload it to your child-theme js folder ( if there is none – create that child-theme subfolder )

I load the script only for my test page (ID: 45777)
put this to your child-theme functions.php:


function my_custom_infinite_scoll() {
    if ( is_page(45777) ) {
        wp_enqueue_script( 'avia-child-jscroll', get_stylesheet_directory_uri().'/js/jscroll.min.js', array('jquery'), 2, true );
    }
} 
add_action('wp_enqueue_scripts', 'my_custom_infinite_scoll');

and

function infinite_scroll() {
if ( is_page(45777) ) {
?>
<script type="text/javascript">
(function($) {
$( ".content" ).jscroll({
	loadingHtml: '<img src="/wp-content/uploads/anim-world.gif" alt="Loading" /> Loading...',
	nextSelector: 'span.current + a',
	contentSelector: '.article-grid',
	autoTrigger: true,
});

})(jQuery);
</script>
<?php
}
}
add_action('wp_footer', 'infinite_scroll', 999);

In my case it is a blog element – give that custom class: article-grid to that element.
Read the setting carefully ( with pagination – this nav is set to display none via css )

see: https://webers-testseite.de/infinite-scroll/

June 2, 2024 at 2:46 pm #1447450

In reply to: Blog: html area block in single news

Hi,
Ok, as I examine your page I see that the wrap_all & main divs are closed and your injected color section is outsite the page:

Then I recalled that injecting any full width element, like color sections, causes the page to auto close like this, so the way around this is to inject the HTML instead, so I tested this on my site linked below as a proof of concept and this is the code that I used:

add_action('ava_after_main_title', 'ava_after_main_title_mod');
function ava_after_main_title_mod() {
	$post_id = get_the_ID();
    if(get_post_type( $post_id ) == "post" || is_archive() || is_category()) {
		echo '<div id="av_section_1" aria-label="header-blog" style="background-color:#e7e6e0;" class="avia-section av-gurxi-f7ad7ba9aa66e762665269785c869839 main_color avia-section-no-padding avia-no-border-styling  avia-builder-el-0  avia-builder-el-no-sibling  block-fit-size avia-bg-style-scroll container_wrap fullsize"><div class="container av-section-cont-open"><main role="main" itemprop="mainContentOfPage" class="template-page content  av-content-full alpha units"><div class="post-entry post-entry-type-page post-entry-3814"><div class="entry-content-wrapper clearfix"><div class="flex_column_table av-lwc8c3ub-7fae82ac0e7450fe73ac250f770e4e79 sc-av_one_half av-equal-height-column-flextable"><div style="padding: 20px 0 20px 0;" class="flex_column av-lwc8c3ub-7fae82ac0e7450fe73ac250f770e4e79 av_one_half  avia-builder-el-1  el_before_av_one_half  avia-builder-el-first  first no_margin flex_column_table_cell av-equal-height-column av-align-bottom  "><div class="av-special-heading av-tkaly-59af4c81dd5bd8035cb05863635061b6 av-special-heading-h1 custom-color-heading blockquote modern-quote  avia-builder-el-2  el_before_av_textblock  avia-builder-el-first "><div style="font-size: 18px;color: #a07860;" class="av_custom_color av-subheading av-subheading_above"><p>Veranstaltungen und Lesungen</p></div><h1 style="color:#1f4339;font-size:45px;font-family: "librebaskerville", Helvetica, Arial, sans-serif;text-transform: none;" class="av-special-heading-tag" itemprop="headline">Veranstaltungen</h1><div class="special-heading-border"><div class="special-heading-inner-border"></div></div></div><section class="av_textblock_section av-3a7ov5-3365d9d47359d52499c6170f6e5d6913 " itemscope="itemscope" ><div class="avia_textblock" itemprop="text"><p style="color: #666666;font-size: 17px;">Wir laden Sie ein, an unseren gemeinsamen Veranstaltungen, Reisen und Lesungen an besonderen Orten, teilzunehmen. Weiteres erfahren Sie in der jeweiligen Veranstaltungsbeschreibung.</p></div></section></div><div class="flex_column av-fy05a-677df80f19dcd41d19a6c602b9b923d5 av_one_half  avia-builder-el-4  el_after_av_one_half  avia-builder-el-last  buch-monat no_margin flex_column_table_cell av-equal-height-column av-align-bottom  "><div class="avia-image-container av-9gv81-4c6171ac5adc202d5cf1671f776d7959 av-styling- avia-align-right  avia-builder-el-5  avia-builder-el-no-sibling " itemprop="image" itemscope="itemscope" ><div class="avia-image-container-inner"><div class="avia-image-overlay-wrap"><img decoding="async" fetchpriority="high" class="wp-image- avia-img-lazy-loading-not- avia_image " src="/wp-content/uploads/2024/05/area-book-ueber-uns.png" alt="" title="" itemprop="thumbnailUrl"></div></div></div></div></div></div></div></main></div></div>';
	}
}

Note that I didn’t understand why you had $thumbnail = get_the_post_thumbnail_url ( $post_id ); since I saw no call for $thumbnail so it’s not in my code, feel free to adjust after to test my code. I also had to add so style inline so my test would look like your page, it should not cause a issue for you.
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.

Best regards,
Mike

June 1, 2024 at 6:59 pm #1447353

In reply to: all portfolio’s on one page

Hey Woutski,
Thank you for the link to your example site, when I look at it, it looks like the grid of icons at the top, linking to a sections lower on the page, in each section is a content slider showing one item with pagination to see more from this group. To create this I would use the Gallery element at the top of a page with a custom link added to each image as a anchor link to lower sections:

and then in the advanced tab set the link settings to Use custom link so the anchor links will be used.

Then using columns for the lower sections add a custom ID for the anchor links to point to:

Then in the columns use a Post Slider elements, each one with a different taxonomy, or category, for this example I used Portfolio Entries

and set it to show only one column with navigation arrows always showing.
This is how the backend looks:

and the frontend:

Now when a icon is clicked at the top of the page, you will scroll down to that section and then can use the navigation arrows to see more items from that group. When more items are added to that taxonomy then will automatically show in the correct group.

Best regards,
Mike

June 1, 2024 at 1:09 am #1447225

Topic: Autoscroll Issue with iFrame

in forum Enfold

kalimeromax

Participant

Hello team,

I hope you are well. I am experiencing an issue with the Enfold theme on my WordPress site and I am hoping you can assist me.

Every time I insert an iFrame on my page and reload the page, an autoscroll is triggered. The autoscroll occurs depending on the position where the page was scrolled before the reload, causing the page to land at different positions after the reload.

Could you please take a look at this on my site and help me resolve this problem? There is a link to the relevant page in the private content.
I look forward to your response and thank you in advance for your help.

Best regards,
Max

May 31, 2024 at 9:31 am #1447165

Topic: all portfolio’s on one page

in forum Pre Sale Questions

Woutski

Participant

Hi,

Is it possible to create one portfoliopage in where I see at the top the portfoliogrid with logo’s. and lower in that same page the portfolio items
By clicking a logo in the portfoliogrid it would scroll to the right portfolio item. Of cours every new portfolio item is automatically placed in the grid and in the page

Thanks in advance

Woutski

May 18, 2024 at 7:58 pm #1444388

In reply to: Embedding images in the navigation