this is not true. The enfold contact form offers checkboxes if you like.
Look : https://webers-testseite.de/kontakt/

you can do it via :

and you can see in your screenshot that this what you see is the logo alternate – this is the logo used if header layout is set to transparency (including glassy) and you will find that on Enfold options dialog / header / transparency options

documentation is here: https://kriesi.at/documentation/enfold/custom-social-icons/

if you do not have a font icon of your “social-icon” you can use png files for that.

1 look for a png file you like to have
f.e.:

2 : upload it to your media library and copy the link – you will need it:

3 : now go to your functions.php of your child-theme and enter:
that little goodreads will be the addendum to the class set by enfold

function avia_add_custom_social_icon($icons) {
    $icons['Goodreads'] = 'goodreads';
    return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

with that you can now choose the new social icon on Enfold Options – Social Profiles ( it is at the end of the list)

4 : This comes to quick css ( you see here is the automatically created class av-social-link-goodreads )

#top #wrap_all .av-social-link-goodreads a:before{
    content: "";
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    background: url(https://link-to-your-image/goodreads.png) no-repeat center center;
    background-size: contain;
}

5 : styling the hover effect – this to quick css ( color makes no sense here because we have no font )

#top #wrap_all .av-social-link-goodreads:hover a{
    color:#fff; 
    background-color:#9fae37; 
}

6 : for another “social-icon” you only have to replace goodreads

yes but it seems that there is something missing !
i started with Enfold Options Elegant – then it is possible to have modern because it only goes an additional class to html (html_modern-blog)
but from that point it does not remove the globaly set elegant if i choose business .
– i will try a different solution now – but had to remove those settings for now

sorry – it seems not to work propper

the thing is that on html there are the classes added – (html_blog-elegant, html_blog-modern) if they were present the blog will look this way we know. But adding it via addClass has a timeshift – thats ugly – so best would be to have a filter there similar to header-styling.

and again you can have here too f.e. the choice of header style for each page ;)

add_filter('avf_builder_boxes', 'register_meta_boxes', 10, 1);
function register_meta_boxes($boxes){
$boxes[] = array( 'title' =>__('Layout','avia_framework' ), 'id'=>'layout', 'page'=>array('page' , 'post' , 'portfolio' ), 'context'=>'side', 'priority'=>'low');
return $boxes;
}

add_filter('avf_builder_elements', 'register_meta_elements', 10, 1);
function register_meta_elements($avf_builder_elements){
$avf_builder_elements[] = array(
						"slug"	=> "layout",
						"name" 	=> __("Menu and Logo Position", 'avia_framework'),
						"desc" 	=> __("You can choose various different logo and main menu positions here", 'avia_framework'),
						"id" 	=> "header_layout",
						"type" 	=> "select",
						"std" 	=> "",
						"subtype" => array( __('Logo left, Menu right', 'avia_framework')  	=>'logo_left main_nav_header menu_right',
											__('Logo right, Menu Left', 'avia_framework')	 	=>'logo_right main_nav_header menu_left',
											__('Logo left, Menu below', 'avia_framework') 	=>'logo_left bottom_nav_header menu_left',
											__('Logo right, Menu below', 'avia_framework') 	=>'logo_right bottom_nav_header menu_center',
											__('Logo center, Menu below', 'avia_framework') 	=>'logo_center bottom_nav_header menu_right',
										));
$avf_builder_elements[] = array(
				          "slug"  => "layout",
				          "name"  => __("Blog Styling", 'avia_framework' ),
				          "desc"  => __("Choose the blog styling here.", 'avia_framework' ),
				          "id"  => "blog_global_style",
				          "type"  => "select",
				          "std"   => "",
				          "no_first"=>true,
				          "subtype" => array( 
				                  __( 'Default (Business)', 'avia_framework' ) =>'',
				                  __( 'Elegant', 'avia_framework' ) =>'elegant-blog',
				                  __( 'Modern Business', 'avia_framework' ) =>'elegant-blog modern-blog',
				                    ));

return $avf_builder_elements;
}

hm – if you style your blogs via the blog alb – means if you setup a page f.e. and show your blog with blog ALB – we can create a meta-box on the right side of your editor page:

put this into functions.php of your child-theme:

add_filter('avf_builder_boxes', 'register_global_blog_style', 10, 1);
function register_global_blog_style($boxes){
    $boxes[] = array( 'title' =>__('Layout','avia_framework' ), 'id'=>'layout', 'page'=>array('page' , 'post' , 'portfolio' ), 'context'=>'side', 'priority'=>'low');
return $boxes;
}

add_filter('avf_builder_elements', 'register_meta_blogstyle', 10, 1);
function register_meta_blogstyle($avf_builder_elements){
  $avf_builder_elements[] = array(
          "slug"  => "layout",
          "name"  => __("Blog Styling", 'avia_framework' ),
          "desc"  => __("Choose the blog styling here.", 'avia_framework' ),
          "id"  => "blog_global_style",
          "type"  => "select",
          "std"   => "",
          "no_first"=>true,
          "subtype" => array( 
                  __( 'Default (Business)', 'avia_framework' ) =>'',
                  __( 'Elegant', 'avia_framework' ) =>'elegant-blog',
                  __( 'Modern Business', 'avia_framework' ) =>'elegant-blog modern-blog',
                    ));

return $avf_builder_elements;
}

you will have than on the right in Layout Options the choice of setting blog_style for each page
see here : https://webers-testseite.de/blog-seite-elegant/
and: vice versa: https://webers-testseite.de/blog-seite-modern/

Edit: hm now we have to support other themes – seems to me to be a proof of quality for Enfold.

if it wasn’t avada it will go this way:
the thing is that content gets a padding-top / padding-bottom of 50px !

so if you insert your hr element give it a custom class f.e. nopadding

and do this to functions.php of your child-theme:

function padding_to_parent_of_hr_nopadding(){
?>
<script>
(function($){
	$('div.hr.nopadding').closest('.content').css({"padding": "10px 0", "min-height": "0px"  });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'padding_to_parent_of_hr_nopadding');

what does the code do – it looks for a hr with the class nopadding – if it finds some – it will search for the nearest parent element with class content and defines the padding for it.
this is something which could not be done by css – because we have to select the parent of a dif with class.

:lol Enfold is great : on avia-compat.js there are some checks concerning to devices. (test(navigator.userAgent))

as i did above with that code

var avia_is_mobile = false;
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) && 'ontouchstart' in document.documentElement)
{
	avia_is_mobile = true;
	document.documentElement.className += ' avia_mobile ';
}

so if it is a mobile the html document get the class avia_mobile

so we could use that allready for changings:
delete the function in your functions.php and try – this must be the same effect because avia-compat.js allready checked it an set that class to html:

.avia_mobile  #top.page-id-40 #full_slider_1,
.avia_mobile  #top.page-id-40 #av_section_1 .av_textblock_section.av-desktop-hide,
.avia_mobile  #top.page-id-40 #av_section_1 .avia-video.av-desktop-hide {
  display: none !important
}

.avia_mobile  #top.page-id-40 #full_slider_2 {
  display: block !important
}

please go to ipad settings / safari and empty the browser cache .

this is what i see on your page (click to enlarge):

Excuse my initial confusion, but you always have to see how it’s originally set in Enfold to overwrite it.
a separate own test page helps always better than anything else

i see on your page that it works now ( on my ipad it does show now the slideshow (not the film) even on landscape version)

i edited the code above try those

what does your ipad show than now : both ?

or you can try the media query from link above: Link

Too embarrassing

• This reply was modified 7 years, 3 months ago by Guenni007.

i would in this case not take the media-query via screenwidth only.
if you like to handle this only via css than there will be some queries for devices: Link

but i think via functions.php and jquery it would be more selective.

for example this to functions.php of your child-theme:
Can you have a look if it is influenced your ipad too?

Too embarrassing : sorry

• This reply was modified 7 years, 3 months ago by Guenni007.

ist aber auch nicht nötig – siehe meinen letzten Beitrag !
nimm diesen Code in die functions.php
aber wie gesagt alle Checkmarks weglassen im Code-Block element

____________________

Aber damit du custom css setzen kannst gibt es mittlerweile zwei möglichkeiten
früher ging es nur via code in functions.php of child-theme:
add_theme_support('avia_template_builder_custom_css');
oder mittlerweile wenn du die aktuellen Versionen installiert hast, dann über Enfold Optionen / Layout Builder dort häckchen bei : Show element options for developers

ok there is a padding-top/padding-bottom

du hattes Recht, ich dachte, dass es unten nicht so stören würde.

setze deinen Code Block so an – gib ihm die custom class: zero-height (oder irgendwas anderes ) lass alle checkmarks weg – dann wird ein surrounding container geschaffen, dem wir über die functions.php des child-themes:

function set_height_to_zero(){
?>
<script>
(function($){
 $('div.zero-height').closest('.content').css( 'padding' , '0px' );
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'set_height_to_zero'); 

Was macht der code oberhalb: Er sucht nach dem Element mit der Klasse zero-height – wenn er das Element gefunden hat geht er soweit höher bis er das nächste Elternelement findet, mit der Klasse content und ordnet ihm das padding 0 zu.
Da es quasi inline definiert ist, wird es auch ohne important wirksam sein – siehe die Beispiel Seite:
die 1px distanz kommt von dem footer border-top und dem min-height siehe nächster Beitrag

Warum der jQuery Code: es ist via css leider noch nicht Möglich Eltern Element zu selektieren ! Leider – würde manches einfacher machen.
Selbst in CSS4 to come wird es einen parent-selector noch nicht geben – schade Link
https://webers-testseite.de/a-post-with-a-popup/

• This reply was modified 7 years, 2 months ago by Guenni007.