Hi!

@PRuuPH: Yes, you can still use the code.

add_filter( 'wp_nav_menu_items', 'avia_append_search_nav', 10, 2 );
function avia_append_search_nav ( $items, $args ) {
	if(avia_get_option('header_searchicon','header_searchicon') != "header_searchicon") return $items;

    if ((is_object($args) && $args->theme_location == 'avia') || (is_string($args) && $args = "fallback_menu"))
    {
        global $avia_config;
        ob_start();
				get_search_form(false);
				$getform = ob_get_clean();
        $items .= '<li id="menu-item-search" class="noMobile menu-item menu-item-search-dropdown">'.$getform.'</li>';
    }
    return $items;
}

Adjust the position with this css:

#top #menu-item-search #searchform div {
  opacity: 1 !important;
  display: block !important;
  top: 20px;
  margin-left: 20px;
}

It will require a few css modifications which depends on the site’s header settings.

Regards,
Ismael

Hi eviang!

Thank you for using Enfold.

The social share section has its own sharing pattern and the plugin’s settings won’t affect it. You can use the following filter in the functions.php file:

// modify social share args
add_filter('avia_social_share_link_arguments', 'avia_add_social_share_link_arguments', 10, 1);
function avia_add_social_share_link_arguments($args) {
	$args['twitter']['pattern'] = 'https://twitter.com/share?text=[title]%20@something&url=[shortlink]';
	return $args;
}

EDIT: You have to modify the text query: “?text=[title]%20@something”

The “[title]” is the title of the current post or page, the %20 is a space and the @something is the twitter handle if you want to include it or add any other text.

Usage examples:

https://kriesi.at/support/topic/share-button-twitter-handle-not-showing-when-people-are-sharing/#post-578267
https://kriesi.at/support/topic/changing-words-on-share-function/#post-481864

Cheers!
Ismael

Hi gooseflight!

Thank you for using Enfold.

1.) Please use this css declaration:

.avia_ajax_form h3 {
 // style here
}

2.) Yes, you can adjust the width using css. This is the default style:

.avia_ajax_form .button {
    margin: 0;
    padding: 16px 20px;
    border-radius: 2px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-weight: normal;
    font-size: 0.92em;
    min-width: 142px;
    outline: none;
}

3.) I’m not sure what you mean by this but you can add a custom script via functions.php file. Example here: https://kriesi.at/support/topic/insert-java-scripts-in-body/#post-579587

Cheers!
Ismael

Hi!

Please add this in the Quick CSS field:

@media only screen and (max-width: 767px) {
.responsive.html_header_top #header_main .social_bookmarks, .responsive.html_top_nav_header #top .social_bookmarks {
    margin-top: 0;
    display: block !important;
}
}

Regards,
Ismael

Hi mcraig77!

Thank you for using Enfold.

I think its better if you hide the button on mobile view and then add it somewhere else. Maybe, below the slider? Will that work? You can toggle the display of the elements by using css media queries. Example here: https://kriesi.at/support/topic/how-to-hide-some-elements-in-mobile-version/#post-362263

Regards,
Ismael

Hi Anne-lys87!

Thank you for using Enfold.

Please use this:

div .main_color .tabcontainer .active_tab_content, div .main_color .tabcontainer .active_tab, .responsive #top .main_color .active_tab_content, .responsive #top .main_color .tabcontainer .active_tab {
    background-color: #28343c;
    color: #ffffff;
}

Cheers!
Ismael

Hi Jasmer!

Thank you for using Enfold.

1.) Adjust the width of the columns that contain the icons:

@media only screen and (max-width: 767px) {
#top #wrap_all #photo-center .flex_column.av_one_third {
    width: 31%;
    float: left;
    clear: none;
    margin-left: 2%;
}
}

2.) Please refer to number 1. Use the google / chrome inspector in order to get the appropriate element selectors. https://developer.chrome.com/devtools/docs/dom-and-styles

I only want this to affect the mobile site only. The desktop site is perfect.

3.) Use css media queries. http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

Regards,
Ismael

Hey!

1.) You can move the arrow with this:

#top .scroll-down-link {
    margin: 0px 0 0 -42px;
}

2.) Did you set the blog page as “blog” in Enfold > Theme Options panel? Or you can use the blog post element.

3.) Regarding the responsive issue, please move all elements inside a color section. If you have a few elements on the page that are left outside a color section, move them inside. This usually fix the issue.

Best regards,
Ismael

Hi Charlotte!

Thank you for using Enfold.

1.) Set the height of the header in the Enfold > Header panel. Set the Header Size settings to custom then adjust the height accordingly.

2.) Add this in the Quick CSS field:

#top #extended-categories-select-2 {
    padding: 20px 20px;
    font-size: 20px;
}

3.a) Use this to disable the animation:

.avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry {
    -webkit-animation: none;
    animation: none;
}

3.b) For the title:

.av-masonry-entry-title.entry-title {
    font-size: 30px;
}

3.c) Remove the date:

.av-masonry-date.meta-color{
    display: none;
}

4.) Add the “noLightbox” to the class attribute of the link tag.

In the future, please create a single thread for each inquiry. Thank you.

Cheers!
Ismael