Hi,
I am in the process of setting up event tracking for button clicks of the contact forms that I have on the site.
This post makes sense for the most part: https://kriesi.at/support/topic/tracking-code-on-specific-button/#post-335355
Only complication is that I have 2 forms and as such would like to measure them individually. I figure that at the moment the submit buttons of both forms have the same class ( class=”button” ). And as such if i’d use this class in the ga script i wouldn’t be able to identify which form has been submitted.
How can i target the different buttons of each of the 2 forms in order to measure each form submit individually?
Hey, thanks for your help but this has pushed things down on every single page – unfortunately not what I was after!
As mentioned above, this was only an issue on certain pages.
This is an example of one of the pages I’m unhappy with:
http://fleurmurphy.com.au/2016/04/21/quickfix-marketing-campaign/
You’ll see the large image at the top is very close to the top nav bar.
I tried simply adding padding to the top of the image, and that didn’t seem to work at all.
Pages like this (post pages with the large image at the top) are the only ones I need changed.
All the rest of the pages were perfect as they were.
I’ve removed your code from my Quick CSS.
Please help :)
Hey tlchase!
Thank you for using Enfold.
Looks like the widget area is being used in place of the sidebar. The default sidebar should go to the bottom of the page on mobile view. We can use jQuery to reverse the order of the column on mobile view. Example: https://kriesi.at/support/topic/remove-border-from-partner-logo-list/#post-586602
Please turn on a custom css class. Edit the columns then add a unique class attribute to them.
Best regards,
Ismael
Hi!
The mega menu considers the duplicated “Product” menu item as the first column. Instead of adding a duplicate, try the solution provided in the following thread which creates some kind of “go to this page” link on mobile view. You can replace the text with an arrow or anything you want. https://kriesi.at/support/topic/mobile-menu-links/#post-637296
Regards,
Ismael
Hi,
Thank you for the info. The issue is still under investigation. For now, please follow the solution provided here: https://kriesi.at/support/topic/enfold-google-maps-widget-not-working/#post-657900
Best regards,
Ismael
Good Afternoon:
Below in the private content section, I’ve posted the URL to my development machine as well as to a screenshot. For the site I’m working on, I have a relatively thin header that’s a color section with a simple background image, the area you see that says, “CASABLANCA”. In that color section, I need to place an image that needs to overlap the full width submenu below and perhaps a little of the full width easy slider below that. It should end up appearing more or less like the third URL I posted in the private content area; that’s the current live version of the site I’m converting to WordPress.
I’ve applied position: absolute as well as a high number z-index to the class I assigned to the image element, but that doesn’t “bring it to the front” so to speak. I’ve also tried it with just a code block but got the same result.
If you guys can give me any help on this one, I’d sure appreciate it.
Thank you!
Scott
Hi,
Does anyone recommend a top bar notification plugin that works with Enfold.
I tried TOP BAR out, but it does not seem to display on Enfold theme.
Thanks
Hi,
1. The current page (/home-2/) is not within the menu so none of the menu items will be highlighted.
2. Add this to Quick cSS:
#top .av-submenu-container li:hover .avia-menu-fx{
opacity: 1;
visibility: visible;
display: block;
}
Best regards,
Josue
Hey!
Try adding this code to the Quick CSS:
@media only screen and (max-width: 1200px) {
.responsive .boxed #wrap_all { overflow: hidden; /*needed for mobile menu scrolling */ }
.responsive #top { overflow-x: hidden; }
.responsive .boxed#top, .responsive #top.boxed .stretch_full ,
.responsive.html_boxed.html_header_sticky #header,
.responsive.html_boxed.html_header_transparency div #header{ width: 100%; max-width: 100%; }
.responsive #top .flex_column_table_cell{display: block;}
.responsive #top .flex_column_table{display:block;}
.responsive #top #wrap_all .container {
width: 85%;
max-width: 85%;
margin: 0 auto;
padding-left:0;
padding-right:0;
float:none;
}
.responsive .units, .responsive .unit {
margin: 0;
}
.responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
margin: 0;
margin-bottom: 20px;
width: 100%;
}
.responsive #top #wrap_all .av-flex-cells .no_margin{
display: block;
margin: 0;
height:auto !important;
overflow: hidden;
padding-left:8% !important;
padding-right:8% !important;
}
.responsive #top #wrap_all .av-flex-cells .no_margin .flex_cell_inner{
width: 100%;
max-width: 100%;
margin: 0 auto;
}
.responsive #top #wrap_all .av-flex-cells .no_margin.av-zero-padding{
padding-left:0% !important;
padding-right:0% !important;
}
.responsive #top #wrap_all .flex_column:empty{margin:0;}
}
Cheers!
Josue
I’m having the issue of the top and bottom being flat and the featured image is 400×400 so it’s square.
Hi,
Glad we could help, please let us know if you should need any more help on the topic.
Best regards,
Rikard
Hey Bettina!
There are CSS classes you can use for those.
Add the following let us know if it works
#top .title_container .container { padding: 0 !important; }
and
Please do let us know if that works out for you
Regards,
Basilis
I found this topic
https://kriesi.at/support/topic/pricing-table-different-colors-on-each-collumn-header/
but when I try to add the code to quick-css nothing happens and I dont understand how to setup it… Can you please help?
Thanks
Hi joelwall33!
Please add to your CSS
.html_elegant-blog #top .avia-content-slider .blog-categories { display: none; }
let us know if tou need anything else
Regards,
Basilis
Hi Yigit
Last thing. Is it possible to center the whole block of iconlist in a page or section? If i insert them in the Avia editor the set of icons is aligned to the left. I tried to insert them as shortcode in a text block and add div in the top bt it doest work.
Thank you very much
Hi,
Great, glad we could help. Let us know if you should need any more help on the topic.
Regards,
Rikard
Hi,
Desktop:
On the left menu at the Bottom we have two Social Media Icons.
Mobile:
I Wand to Add the Social Media Buttons into ‘#mobile-advanced’ below the last Link.
I think the clone function ‘avia_responsive_menu()’ in avia.js does not copy the social media buttons.
Any Suggestions?
Thx a Lot
Chris
Hello the team,
I’ve a strange bug with ACF PRO and the theme Enfold. This bug appears in the post edit screen, everything is ok under pages and custom post types. In the post edit screen, the tabs (html/text editors) and arrows in the metaboxes stop working.
If i desactivate ACF, everything works. If i desactivate Enfold with ACF activated, everything works.
I got this error :
TypeError: e is undefined (http://xxx/wp-includes/js/wp-auth-check.min.js?ver=4.5.3)
<anonyme>
wp-auth-check.min.js:1
n.event.dispatch()
jquery.js:3
n.event.add/r.handle()
jquery.js:3
n.event.trigger()
jquery.js:3
a.event.trigger()
jquery-migrate.min.js:2
.trigger/<()
jquery.js:3
.each()
jquery.js:2
n.prototype.each()
jquery.js:2
.trigger()
jquery.js:3
j/z.xhr<()
heartbeat.min.js:1
n.Callbacks/i()
jquery.js:2
n.Callbacks/j.fireWith()
jquery.js:2
y()
jquery.js:4
.send/c()
jquery.js:4
Have you an idea ?
Thank you for your help.
Best regards.
Hi!
Please add following code to Quick CSS
#header .av-social-link-facebook:hover a {
background-color: #37589b !important;
}
#header .av-social-link-gplus:hover a {
background-color: #de5a49 !important;
}
#header .av-social-link-linkedin:hover a {
background-color: #419cca !important;
}
#top .social_bookmarks li a {
border-radius: 300px!important;
}
Cheers!
Yigit
Hi,
Have you applied this workaround – https://kriesi.at/support/topic/woocommerce-2-6-problem-urgent/#post-650161 and check if that helps? If not, please do create a testing environment and post credentials here privately so we can look into it.
Best regards,
Yigit
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
#top .av-subnav-menu > li.current-menu-item a {
color: orange;
}
Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.
Best regards,
Yigit
Hey Tobiy,
1- Glad you figured it out! :)
2- Please refer to this post – http://kriesi.at/documentation/enfold/inserting-breadcrumbs-as-shortcode/
1st 3- Please remove following custom CSS code
@media only screen and (min-width: 468px) {
#top .thumbnail_container img {
min-height: 450px;
}}
then go to WooCommerce > Settings > Products > Display and change product image sizes as needed and then regenerate them using this plugin – https://wordpress.org/plugins/regenerate-thumbnails/. Also, please make sure to upload your product images in the same proportions.
2nd 3- You can refer to this post – http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/ and add widget area to your header and show it conditionally on selected WooCommerce pages. Please https://docs.woothemes.com/document/conditional-tags/
Best regards,
Yigit
Hey,
On my site, there is a row of three boxes, which on mobile should wrap to one column all with 100 %. This is not what happens however, as you can see. In addition, I’ve had to add this CSS to hack the blog posts grid to display correctly on mobile as well, as the second blog post box did not have a margin at the bottom on mobile:
@media only screen and (max-width: 767px){
.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-bottom: 20px;
margin-left: 0;
}
}
What’s going on? This occurs even if I remove all extra CSS added in the child theme.
Thanks :)
-
This topic was modified 9 years, 6 months ago by
emilbroll.
Hi Ulrich,
Ok I see what you mean. Please try the following in Quick CSS:
@media only screen and (max-width: 479px) {
#menu-focus {
margin-top:120px;
}
}
Thanks,
Rikard
The banner role is unnecessary for element header.
<header↩id=’header’ class=’all_colors header_color light_bg_color av_header_top av_logo_left av_main_nav_he…eader_border_disabled’ role=”banner” itemscope=”itemscope” itemtype=”https://schema.org/WPHeader” >
– – – –
Document uses the Unicode Private Use Area(s), which should not be used in publicly exchanged documents. (Charmod C073)
data-av_icon=’’ data-av_icon
– – – –
Element nav does not need a role attribute.
From line 52, column 57; to line 53, column 111
<nav↩class=’sub_menu’ role=”navigation” itemscope=”itemscope” itemtype=”https://schema.org/SiteNavigationElement” ><ul↩id
Hey there I have set my grid to :
#para-grid2 {
background-attachment: fixed;
background-position: left top !important;
background-size: cover !important;
background-image: url(“http://www.samanthadoyle.com/wp-content/uploads/2016/07/weight-lift-2.png”) !important;
margin-left: 5% !important;
margin-right: 5% !important;
max-width: 1500px !important;
}
And it won’t adhere to the max of 1500px is there something I did wrong?
Hey, this one didn’t quite work. It removed the entire space where the logo was, which means all of my page content has now moved up on the page, and my mobile nav is cut off at the top of the screen. Is there a way to remove the logo but retain the white bar that used to be there behind it?
Hi,
I updated my website in a staging space with the last version of WordPress, Enfold and Woocommerce (and all related plugins).
My homepage is very slow to load in opposite of outdated website and the problem seem be avia.js (see screenshot).

I tried also the fix here, but it didn’t work https://kriesi.at/support/topic/having-problems-after-updating-to-wordpress-4-5-please-read-this-first/
How can I speed-up my website?
Hey fernandosantospanarama,
Auto play works without any issue. Just make sure you have the autoplay checked in vimeo video options and copy the iframe embed code in the code block element.
Let us know if you have any questions.
Best regards,
Vinay
Hey Tyler,
The masonry element is using the isotope script which calculates the position of the masonry items dynamically. I’m afraid, it’s not possible to change the width or the height of the thumbnail to make it look like a square without breaking the script. The width and height of the masonry items will depend on the number of columns and the current width of the main container.
Best regards,
Vinay