Hi there,

I created a custom search box/ This is the code:

<form id="searchform" action="https://www.bramfietst.nl/" method="get">
<div style="text-align: center;"><input id="searchsubmit" class="button avia-font-entypo-fontello" type="submit" value="" />
<input id="s" autocomplete="off" name="s" type="text" value="" placeholder="Zoek op jouw plaatsnaam..." data-swplive="true" data-swpengine="default" data-swpconfig="default" aria-describedby="searchwp_live_search_results_5ede6fc967c8f_instructions" aria-owns="searchwp_live_search_results_5ede6fc967c8f" aria-autocomplete="both" />
<p id="searchwp_live_search_results_5ede6fc967c8f_instructions" class="searchwp-live-search-instructions screen-reader-text">When autocomplete results are available use up and down arrows to review and enter to go to the desired page. Touch device users, explore by touch or with swipe gestures.</p>

</div>
</form>

The div should align in the center, but it doesn’t. Whats going wrong? How can I align a searchbox in the center of my page in the enfold theme?

Hi!
I have a problem with the spacing of the menu bar items. The whole navigation is centered, the first line of the menu is filled with 8 menu buttons, the second line is filled with 6 menu items. The spacing in the second line looks a bit weird – to much space between the menu buttons. . How can i add a specific width to the navigation bar, so that the spacing is more consistent/naturale? Is there a way to define a specific width to the first line of the navigation bar to get kind of a line break?

Following code has already be added in Quick CSS

following code to Quick CSS in Enfold theme options > General Styling

.html_header_top.html_logo_center #header_main_alternate .main_menu ul:first-child {
display: flex;
flex-flow: wrap;
}
.av-main-nav li {
flex-grow: 1;
}

/* Activate burger menu */
@media only screen and (max-width: 1040px) {
#top #header .av-main-nav > li.menu-item {
display: none!important;
}
#top #header .av-burger-menu-main {
cursor: pointer;
display: block!important;
}}

Thanks in advance,
Juergen

dear support team
a customer of mine would like to display buttons on facebook and instgram on her website elianfe.com. The lawyer commissioned by her with regard to data protection has stated in this regard that we need an additional tool (plug-in) for the data protection-compliant use of the social media buttons and YouTube so that the data is not transferred to the third-party providers when the page is called up (2-click principle). This can e.g. implemented by the “Shariff” tool.
Now there is a plugin called “Shariff Wrapper” for the possible plugins or alternatively the plugin “Shariff for WordPress”.
Are these two plugins compatible with the ENFOLD version and do they fulfill the stated purpose? Or would you recommend another plugin?
When calling the “Shariff for WordPress” plugin, the following is added to the baking: Untested with your version of WordPress.
What recommendation could you give us?

Thank you very much and best regards Diana

Found this little trick , and it is working well. Just sharing if someone wants to use it too.

Credit goes to:
https://medium.com/hackernoon/removing-that-ugly-focus-ring-and-keeping-it-too-6c8727fefcd2

Put a file named “my_custom_scripts.js” in child theme js folder.
See https://kriesi.at/documentation/enfold/add-custom-js-or-php-script/

Contents:

(function($)
{
    "use strict";

// function to see if the user is using tab navigation instead of mouse function 
handleFirstTab(e) {
    if (e.keyCode === 9) { // the "I am a keyboard user" key
        document.body.classList.add('user-is-tabbing');
        window.removeEventListener('keydown', handleFirstTab);
    }
}
window.addEventListener('keydown', handleFirstTab);

// Add more functions here

}(jQuery));

Now you can hide the dotted outline and/or background for everyone except the users that have hit the “I am a keyboard user” key (tab).

CSS example:

/* Accessibility focus with lightblue background and dotted outline */
.user-is-tabbing a:focus,
.user-is-tabbing button:focus,
.user-is-tabbing input:focus,
.user-is-tabbing select:focus,
.user-is-tabbing textarea:focus {
  background-color: lightcyan !important;
  outline: dotted !important;
}

/* hide the lightblue background for everyone except tab navigation users */
body:not(.user-is-tabbing) a:focus,
body:not(.user-is-tabbing) select:focus,
body:not(.user-is-tabbing) textarea:focus {
/*  background-color: transparent; */ /* optional */
/*  outline: none; */ /* optional */
}

• This topic was modified 5 years, 9 months ago by rob2701. Reason: fixed small typo (missing enter)

I’ve been using Enfold for some time now. I just got a new copy for another client to spruce up the look of their website I have put the theme on a subdomain and the main site. the tinyMCE buttons are not showing on the main site but are visible on the Archive site. they are also visible on the the original site I created using Enfold. I can’t figure out what is different and why they are not showing up.

What do I need to do or install to make them show up?

I’m using the most current version of Enfold 4.7.5 and Enfold child theme. WP is 5.4.2 I have the classic editor installed

Buko

• This topic was modified 5 years, 9 months ago by byBuko.

Hi,

I have a custom JS module and need to call a custom function by pressing Enfold button. So on click I need to call Module.customFunction(‘foo’);

How can I handle it?

Thanks,
Regards, Vital

I’m using the button row shortcode which is perfect:

But how can I change the icon? There is an icon=’4′, icon=’5′ and icon=’6′ in the shortcode. But I want LinkedIn, Facebook and Instagram. How do I know the number of those icons? Where can I find it?

Thanks a lot!

PS. I want the social media icons in an iconbox, that’s why I need to use the shortcode. When I use icon shortcode in text block, I can’t center 3 icons next to eachother. Whit the button row I can!

If there is another way, let me know. Thanks!