Forum Replies Created
-
Posts
-
I can’t confirm that on my side too. Although the gtmetrix values are not so nice –
It loads itself everything quite quickly ( And i cleared all cachings before making the screen film ) . See film. https://webers-testseite.de/wp-content/uploads/maskenzauber.mp4
Chrome only reports mixed content when loading some fonts – see picture.
but if you see the more informative Speedtest on gtmetrix: https://gtmetrix.com/reports/maskenzauber.com/88uokIa1
you will see that what probably slows down the most are the images that have not been optimized for the output sizes.
Next thing is matomo.js could be compressed ( thats your analytics tool ? )Unfortunately, many have a wrong idea of how responsive images ( background images ) work.
Either the image reacts to the screen width, then you can see it completely across all widths. For background images this would be the contain property. – Or you can specify fixed heights or width ( this is the cover variant), then the image will be cropped at different screen widths. Of course you can compress or stretch the image, but this is not advisable for a concrete image.Well you have enough variants now – I hope you find an acceptable solution. I would prefer the two color-section solution, and give both the same class.
with this setup :
custom-ID of the color-section is: Pferd
see: https://webers-testseite.de/feedxl/
you can give to the 1/1 containers a fullwidth definition. – But in responsive Case the columns react normal and flow under each other.
if you have only 1/1 it will work.
The css for that example above (think to get rid or replace the custom-ID):.responsive #top #pferd .container { max-width: 100%; width: 100%; padding: 0; } .responsive body #pferd .column-top-margin { margin-top: 0; } .responsive #pferd .flex_column.av_one_full { height: 50% !important; } .responsive #top #wrap_all #pferd .flex_column { margin-bottom: 0 !important }first : that is not possible.
second: Look here: https://webers-testseite.de/feedxl/
what is wrong on having it this way? in other words: what is the benefit of having the whole thing in one section.https://webers-testseite.de/feedxl-2/
it is possible to have more than one background on a container – all definitions are separated by commata:
see here a little tutorial: https://webers-testseite.de/multiple-background-images/
You have to have the horse as cutoff png file.
but you then have the problem on responsive case with the not growing half part at the bottom – so the text has no place to be in there – and it grows then to the top into the other half.
(on that example i have the custom-id of halbhalb (that is the german expression for halfhalf)
and that color-section got no padding!:#halbhalb { background-repeat: no-repeat; background-image: url(https://webers-testseite.de/wp-content/uploads/pferd.png), linear-gradient(#f2d7d0 50%, #fe6d6a 50% ); background-attachment: scroll; background-position: 50% top, center center; background-size: auto 50% , 100% 100%; } #halbhalb.avia-section.av-minimum-height .container .content { vertical-align: bottom; }So my advice is to use two color-sections. https://webers-testseite.de/feedxl/
hi ismael – how to use it: This does not have effect:
function remove_ls_update_notification() { return 'no'; } add_filter('avf_show_layerslider_update_notification', 'remove_ls_update_notification');i try to use the filter too – experimenting with its use- but your code Nikko do not have effect on my installation too.
and maybe this is an interesting thought on how to get the shortcode from a demo page:
https://kriesi.at/support/topic/how-do-i-create-block-with-these-squares/#post-1159564ich befürchte, dass ein “Banner” – Bild in der Position – mit einem Header der dann oben on top fixed ist während der Banner ( Bild ) wegscrollt nicht einfach zu erreichen wird sein.
Sowas ist natürlich möglich – aber kostet wohl ein wenig Zeit. Eventuell belehren mich die Mods eines Besseren___________
I’m afraid that a “banner” – image in position – with a header that is then fixed on top of top while the banner ( image ) scrolls away will not be easy to reach.
Such a thing is of course possible – but costs probably a little time. Maybe the mods will teach me betterDieses Snippet oben : Link kommt in die child-theme functions.php
dann gehst du zum widget bereich und fügst den widgetbereich “header” hinzu:
Dann kannst du dort ein Image ALB platzieren in dem Widget ohne Titel ( notiere dir die Aspectratio ) ( in meinem Beispiel 472:1600 = 29.5% )
jetzt nur noch die Responsivität gewährleisten also widget area ohne padding und in 100vw breite höhe entsprechend der AspectRatio ( bei mir 29.5vw)
das img genauso.
Du muss dann natürlich die Seiten .page-id-36310 rausnehmen:
.page-id-36310 #header_main .widget, .page-id-36310 #header_main .widget img { padding: 0; width: 100vw; height: 29.5vw; } .html_top_nav_header.html_header_top.html_header_sticky #top.page-id-36310 #wrap_all #main { padding-top: calc(29.5vw + 85px); } @media only screen and (max-width:767px) { .responsive #top.page-id-36310 #main { padding-top:0 !important; } }Leider ist es so, dass wenn man den Header sticky hat der Bereich auch sticky ist.
wenn man den header auf scroll hat – scrollt es mit raus:
https://webers-testseite.de/kitten/have you a shrinking header? thats what i ask above.
these two classes are only present if there is a shrinking header.
( you know – i do not see private content area as participant )na ich dachte so als Webdesigner wüßte man wie ;)
Morgen mehr
Aber wie gesagt ohne die Seite zu sehen stoppt mein Support hier. Da musst du dann auf die Mods warten wenn Du es nicht öffentlich machen kannst.By the way: https://kriesi.at/documentation/enfold/?s=header
Selber lesen macht auch (nur) schlau ;) . Die Dokumentation ist wirklich gut.ich denke dann ist der beste ansatz: ein header widget bereich anzulegen:
/*********header widget ****************************/ add_action( 'ava_main_header', 'enfold_customization_header_widget_area' ); function enfold_customization_header_widget_area() { dynamic_sidebar( 'header' ); }and create a widget on widgets called “header” – insert your image there and style it via quick css
ich muss deine Seite sehen. – ins blaue hinein vermutungen anzustellen ist nicht zielführend.
Es wird aber mit der von Enfold festgelegten Verhalten für Header schwer. Denn die Position wäre entweder in header_meta als last-child oder in header als first-child – beide Positionen sind bei einem fixierten header schwer zu realisieren. Der Content (#main) muss ja auch noch die Info erhalten welches Padding es zu Top halten muss.you are welcome.
this is a nice way to pick out the enfold shortcode to select some layouts from the pages of a demo.
Because of the original insertions (image links – categories – postlinks etc. pp) – you only had to adjust the layout after import.sometimes on those xml datas the content starts with :
<wp:meta_value><![CDATA[{{{title}}}– copy only the enfold shortcode – without those curly brackets. ( Mostly it will start as mentioned above:<content:encoded><![CDATA[Also : die Header Sachen kannst du im Enfold Optionen Dialog unter dem Tab Header einstellen:
Header – Header Layout – Menu and Logo Position: Logo Top – Menu Below. ( kannst du hier sehen: https://webers-testseite.de/kontakt/ )
Dann wie oben beschrieben
habe es mal für Dich auf dieser Seite so gemacht ;)
Du siehst es kappt auch responsiv ( nur der Header nicht – weil ich auf meiner Testseite auch mit Headervarianten gespielt habe. – die anderen Seiten haben andere Header Layouts)you have to adjust now the content of the layout builder elements – because the links f.e. in it works if the link target is set to your targets.
And the icon-set is not in your installationThis is part of a demo site!
• activate the Debug Mode in Enfold by adding this to your child-theme functions.php
// Debug Modus Enfold add_action('avia_builder_mode', "builder_set_debug"); function builder_set_debug(){ return "debug"; }• Create a new page on your enfold installation – don’t forget to name it
• Enable the Advanced Layerslider Editor ( now you can see under the layout input area another one which shows you all the enfold shortcodes generated by the ALB Elements you pull into the avia layout builder – publish that page ( this is now an empty page generated with alb )• now find the shortcode of that demo page
– so all demo import options can be found at : enfold – includes – admin – demo_files
look on the demo page to get the name of the demo and look what the page is ( in your case: knowledgebase and the page is the home page.open that knowledgebase.xml with a good texteditor ( f.e. : sublime text on mac (or bbedit) – notepad++ for windows )
find : <title>Home</title>
the enfold shortcode of that page is sourrounded by:
<content:encoded><![CDATA[ here is the enfold shortcode ]]></content:encoded>i shorten it to the element you like to have with a color-section above that you can see the negative margin
copy that code inbetween :[av_section min_height='75' min_height_pc='25' min_height_px='500px' padding='default' shadow='no-shadow' bottom_border='border-extra-diagonal' bottom_border_diagonal_color='#ffffff' bottom_border_diagonal_direction='border-extra-diagonal-inverse' bottom_border_style='' custom_margin='0px' custom_margin_sync='true' custom_arrow_bg='' color='main_color' background='bg_gradient' custom_bg='' background_gradient_color1='#009efd' background_gradient_color2='#2af598' background_gradient_direction='diagonal_bt' src='https://kriesi.at/themes/enfold-knowledgebase/wp-content/uploads/sites/80/2018/10/hero-bg.png' attachment='221' attachment_size='full' attach='scroll' position='center center' repeat='no-repeat' video='' video_ratio='16:9' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='' id='search_section' custom_class='' aria_label='' av_element_hidden_in_editor='0' av_uid='av-jgasyq2w'] [av_heading heading='Customer Support <strong>& Knowledge Base</strong>' tag='h1' link_apply='' link='manually,http://' link_target='' style='blockquote modern-quote' size='42' subheading_active='' subheading_size='14' margin='' padding='0' color='custom-color-heading' custom_font='#ffffff' custom_class='' id='' 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-innvjb'][/av_heading] [/av_section] [av_section min_height='' min_height_px='500px' padding='default' shadow='no-border-styling' bottom_border='border-extra-diagonal' bottom_border_diagonal_color='#ffffff' bottom_border_diagonal_direction='' bottom_border_style='' custom_arrow_bg='' id='frontpage_grid' color='main_color' background='bg_color' custom_bg='' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' 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_element_hidden_in_editor='0' av_uid='av-jgatvii1' custom_class=''] [av_one_third first min_height='av-equal-height-column' vertical_alignment='av-align-top' space='no_margin' custom_margin='aviaTBcustom_margin' margin='-300px,0' row_boxshadow_color='' row_boxshadow_width='10' link='category,16' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight_size='1.1' border='1' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_color' background_color='rgba(255,255,255,0.95)' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-45nqm' custom_class=''] [av_font_icon icon='ue832' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#79c8f8' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='Guides' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='5' color='custom-color-heading' custom_font='#4d6877' 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-6bvdunb'][/av_heading] [av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0fj83' custom_class='' admin_preview_bg=''] <p style="text-align: center;">Tutorials for using the theme, building content and everything else!</p> [/av_textblock] [/av_one_third][av_one_third min_height='' vertical_alignment='av-align-top' space='' margin='0px' margin_sync='true' row_boxshadow_color='' row_boxshadow_width='10' link='page,647' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight_size='1.1' border='1' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_color' background_color='rgba(255,255,255,0.95)' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-aage' custom_class=''] [av_font_icon icon='ue825' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#79c8f8' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='FAQ' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='10' color='custom-color-heading' custom_font='#4d6877' 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-5mz86w7'][/av_heading] [av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0gaz0' custom_class='' admin_preview_bg=''] <p style="text-align: center;">Frequently Asked Questions and beginners hurdles</p> [/av_textblock] [/av_one_third][av_one_third min_height='' vertical_alignment='av-align-top' space='' margin='0px' margin_sync='true' row_boxshadow_color='' row_boxshadow_width='10' link='page,707' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight_size='1.1' border='1' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_color' background_color='rgba(255,255,255,0.95)' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-52c6' custom_class=''] [av_font_icon icon='ue82f' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#79c8f8' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='Community' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='10' color='custom-color-heading' custom_font='#4d6877' 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-5hau2x3'][/av_heading] [av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0gsih' custom_class='' admin_preview_bg=''] <p style="text-align: center;">Our every growing community where you will meet other awesome users</p> [/av_textblock] [/av_one_third][av_one_third first min_height='av-equal-height-column' vertical_alignment='av-align-top' space='no_margin' margin='0px' margin_sync='true' row_boxshadow_color='' row_boxshadow_width='10' link='category,15' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight_size='1.1' border='1' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_color' background_color='rgba(255,255,255,0.95)' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-45nqm' custom_class=''] [av_font_icon icon='ue820' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#79c8f8' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='Getting Started' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='10' color='custom-color-heading' custom_font='#4d6877' 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-4o861fr'][/av_heading] [av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0ha0h' custom_class='' admin_preview_bg=''] <p style="text-align: center;">If you are new to Enfold, start here with easy to follow tutorials</p> [/av_textblock] [/av_one_third][av_one_third min_height='av-equal-height-column' vertical_alignment='av-align-middle' space='no_margin' margin='0px' margin_sync='true' row_boxshadow_color='' row_boxshadow_width='10' link='page,707' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight='aviaTBhighlight' highlight_size='1.1' border='' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_gradient' background_color='rgba(255,255,255,0.95)' background_gradient_color1='#2af598' background_gradient_color2='#009efd' background_gradient_direction='diagonal_tb' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-45nqm' custom_class=''] [av_font_icon icon='ue81c' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#ffffff' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='Submit a Request' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='10' color='custom-color-heading' custom_font='#ffffff' 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-4inadxj'][/av_heading] [av_textblock size='' font_color='custom' color='#ffffff' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0hwwx' custom_class='' admin_preview_bg=''] <p style="text-align: center;">For any other questions and specific issues.</p> [/av_textblock] [/av_one_third][av_one_third min_height='av-equal-height-column' vertical_alignment='av-align-middle' space='no_margin' margin='0px' margin_sync='true' row_boxshadow_color='' row_boxshadow_width='10' link='category,14' linktarget='' link_hover='opacity80' padding='80px,10px,80px,10px' highlight_size='1.1' border='1' border_color='rgba(230,234,236,0.5)' radius='0px' radius_sync='true' column_boxshadow_color='' column_boxshadow_width='10' background='bg_color' background_color='rgba(255,255,255,0.95)' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' animation='' mobile_breaking='' mobile_display='' av_uid='av-45nqm' custom_class=''] [av_font_icon icon='ue80a' font='enfold-knowledgebase' style='' caption='' link='' linktarget='' size='40px' position='center' color='#79c8f8' av_uid='av-jfdzoxcx' custom_class='' admin_preview_bg=''][/av_font_icon] [av_hr class='invisible' height='10' 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_uid='av-vsj2' admin_preview_bg=''] [av_heading heading='Downloads' tag='h3' link_apply='' link='' link_target='' style='blockquote modern-quote modern-centered' size='27' subheading_active='' subheading_size='15' margin='' padding='10' color='custom-color-heading' custom_font='#4d6877' 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-445mdon'][/av_heading] [av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jfe0hwwx' custom_class='' admin_preview_bg=''] <p style="text-align: center;">The official Child Theme for Enfold, Plugins and useful Code Snippets</p> [/av_textblock] [/av_one_third] [/av_section]• that copied content you can insert into that input area below the layout builder:
publish then (update)
• now you see the layout builder element on top in that layout field.
• get rid of the stuff you don’t like to have
(• if you are familiar with the enfold shorcodes you can pick out only the parts you like to have before copying)by the way – this is not a flip grid element – it is a color-section with 1/3 columns in it (equal height) and no space between columns:
the first one of them (guides) has set a negative margin of -300px
über die lage des eingesetzten divs bin ich mir bei deinem Text nicht ganz klar wie du merkst.
Wo genau soll es denn nun hin? Oberhalb des Headers ? unterhalb der Navigation ? Eventuell gibst du mal den Link zur Seite raus.Je nachdem wohin damit könnte man auch einen hook verwenden. (ohne do_shortcode)
Bist du vertraut mit dem Child-theme umgang?
man kann auch html code direkt mit jQuery in ein Element als erstes Kind setzen . ( prepend )
Eine gute Stelle für dein Unterfangen wäre sicherlich als erstes Kind innerhalb von #main
das Styling könnte man auch über quick css machen – man kann es aber auch sofort im script setzen.wichtig für das responsive Verhalten ist die Kenntnis über das Seitenverhältnis deines Bildes.
wir setzen die Breite des eingefügten Containers auf volle Screenweite : 100vw
und die Höhe dann entsprechend der Bildseitenverhältnisse auf zB 50vw wenn das Verhältnis 2:1 istDies kommt in die Child-Theme functions.php:
function insert_as_first_child_in_main() { ?> <script> (function($){ $( '#main' ).prepend('<div class="after-header"></div>'); $('.after-header').css({ "background": "url(url-to-your-image.jpg)", "background-size": "cover", "background-repeat": "no-repeat", "width": "100vw", "height": "35vw", }) })(jQuery); </script> <?php } add_action('wp_footer', 'insert_as_first_child_in_main');PS : bei transparentem Header ist es dann natürlich auch unterhalb des headers ( wie das eben mit #main auch vorher war )
by the way if – you haven’t a shrinking header we could have set it to shrink but without shrinking amount ;)
that will be the next stepthe transparency logo is something different and would not work the way you like to have; because the transparency logo only is in place when the header is transparent. The transparency header is only there if the page isn’t scrolled – so viceversa you like to have.
Frist Question : has your site a shrinking header? – because if so you can use the classes that toggles on header by scrolling.
f.e. use the header-scrolled class for that#header:not(.header-scrolled) .logo { opacity: 0; }if you use for that the opacity option you can have a smooth goaway of your logo by heaving transition timing
may i see your site pleaseWith a WordPress theme that lives from the variety of design possibilities, however, it will always be accompanied by a large share of personal contribution.
If you have a fixed color scheme, it is easy to define a different color scheme as “Night Mode”.
But since everyone here in Enfold can create different color themes, it’s not as easy as it seems to be.
So my idea would be to add more settings for a darkmode ( so to speak a second general styling tab for dark mode) similar to the already existing color settings in Enfold, and then fade in a switch on the pages if needed.by the way we had this discussion already : https://kriesi.at/support/topic/dark-mode-2/#post-1142042
these Night Modes more or less uses the mix-blend -mode and that is something not supported from all Browser: Link
See here some infos to the script : https://darkmodejs.learn.uno/
you mean this:
and that should be under each post ( or portfolio too?)
maybe you can use that filter here : avf_template_builder_content
but it does only work if your single posts are made with advanced layout builder.it is used this way:
add_filter('avf_template_builder_content', 'avf_template_builder_content_mod', 10, 1); function avf_template_builder_content_mod($content = "") { if(is_single() || is_singular('portfolio') ) { $addendum = do_shortcode(" enfold shortcode place it here between "); $content = $content . $addendum ; } return $content; }you have to be carefull with the shortcode insertion – because this have to be a oneliner and inline styles are complicated to have – besides that you can not use fullwidth containers as color-sections or grid-rows – because otherwise the sidebar goes down under this.
how to get from enfold the enfold shortcode is known ?but you are running an actual php version on your hoster ( php 7.x ff.) ?
Because newer Enfold i think – needs newer php Versions – not php 5.xbut it should be the copyright info you inserted on media library? – and this should only be there on info reasons? – not as a watermark to prevent download and unwanted usage?
on background-images ( set by enfold as section-backgrounds?) – or defined by css as background?
where should the copyright info be displayed on galleries? – in lightbox besides the title – or where?well, that’s just two pairs of shoes.
We got now the possibilitiy to have on image alb a unique alt- and title-attribute. But demanding it for galleries is just something else. At ;) Divi it goes. So I think you should pull right away, but in the unmistakable way Enfold does – easier and more intuitive.Goto the menu settings dialog
- add to your main menu two home links
- open the top one of them to see the menu-item settings by clicking on that little arrow on the right of the menu list point
- you can now enter on navigation label an img src html like:
<img class="avia_image" src="/wp-content/uploads/logo.png" alt="logo" title="maybe your Domainname" /> - if you can not see in that menu item settings dialog the classes – you had to open on top of your window that flyout “Screen Options” and mark the needed fields
- that menu item gets now a meanigfull name f.e.: only-burger
- just a bit in quick css:
#avia-menu .only-burger.menu-item { display: none !important } - if you want to get rid of second home link on hamburger menu – you know what to do?
f.e. give a custom-class to that home menu-item : only-desktop - and have then for both : #avia-menu .only-burger.menu-item, #av-burger-menu-ul .only-desktop { display: none !important }
