/* Switch to hamburger menu at 1024px width or less */
@media (max-width: 1024px) {
.custom-hamburger-menu .et_pb_menu__wrap {
display: none;
}
.custom-hamburger-menu .et_mobile_nav_menu {
display: block !important;
}
.custom-hamburger-menu .mobile_nav {
display: block !important;
}
.custom-hamburger-menu .mobile_menu_bar {
display: block !important;
}
}

/* Hide the hamburger menu and display the classic menu at widths greater than 1024px */
@media (min-width: 1025px) {
.custom-hamburger-menu .et_pb_menu__wrap {
display: block !important;
}
.custom-hamburger-menu .et_mobile_nav_menu {
display: none !important;
}
.custom-hamburger-menu .mobile_nav {
display: none !important;
}
.custom-hamburger-menu .mobile_menu_bar {
display: none !important;
}
}

Do you have any idea how to do it?

Many thanks

Kristyna

Hi Becky, I forgot to mention, our Divi Machine Classifieds course is free on Youtube also, so please take a look https://www.youtube.com/playlist?list=PL9My989q_-K9m5wpwC__pMnRygfrAbuol

Sorry you feel this way – something we don’t want. Is it possible to email in su*****@di********.com and ask to be put through to Peter to discuss this more. I want to make sure you are happy and we can get feedback on how we can make the products better for you and others. Here to help

So what you are saying above with your recommendation is that, instead of free extensive tutorials and documentation for you paying customers, we have to purchase another product to learn how to use the ones we’ve already paid for? That seems pretty unfair.

I’ve spent two days now trying to figure out how to create an form for Editing User Profiles that already exist, something that took me about 30 seconds with ACF Frontend Admin.

I really wanted to love your plugins, I paid for them after all, but so far I’m just incredibly disappointed and frustrated. The worst part is that I can’t actually get a refund because the plugins do, technically, do what you claim they do.

Hi Charles,

There seems to be a bug causing not to show on this page, we are currently looking into it, but here is the playlist on Youtube for all the lessons if you are eager to get started. https://www.youtube.com/playlist?list=PL9My989q_-K9m5wpwC__pMnRygfrAbuol

Sorry about the inconvenience!

Disregard, it wasn’t your button code, it was a code for showing the button in the mobile heading bar.

Website: Staging2.keresafortexas.com

Hola Fer,

Finalmente he podido encontrar el problema. Por si le pudiera servir a alguien, el problema está en que prevalece la parametrización de la fila donde se ubica el formulario al utilizar la personalización del canalón de ancho. Se debe indicar como mínimo 2.
Gracias nuevamente y disculpa mi error.

He creado varios diseños con ACF y Divi Machine, utilizando Divi Form Builder, pero encuentro algunos problemas de incompatibilidad con el tema EXTRA de DIVI. Uno de los primeros problemas que encuentro es la distribución de los campos en el formulario, no guarda distancia entre ellos y no encuentro la forma de definir ese espacio entre campos. He probado la más evidente, desde la pestaña de Diseño, apartado Campos, propiedad Campos margen, pero no lo aplica. He comprobado que en Opciones del tema ->performance, esté todo deshabilitado, pero sigue sin funcionar.
La teoría nos dice que los plugins de DiviEngine son totalmemente compatibles con los temas de DIVI, entiendo que incluye el tema EXTRA de DIVI.
Por favor, ¿sería posible obtener el CSS para aplica la separación de campos en el formulario? o bien saber si realmente existe alguna incompatibilidad con el tema EXTRA de DIVI.
Gracias por tu aportación.

Ok, I don’t know if this was a test by Peter 🙂 but I found the fix for my case:
I removed the display:none; for the .popup-overlay and added the position: absolute; to it. Then I’ve added the position: fixed; to the .popup-overlay.show. Now it fixes the overlay when showed, and respect the absolute z-index of -9999, which was being ignored somehow!

I my case this was the solution.

.pop-up-overlay {
/* display: none; */
position: absolute;
top: 0;
width: 100%;
height: 100vh;
z-index: -9999;
justify-content: center;
align-items: center;
opacity: 0;
overflow: hidden;
transition: opacity 0.4s ease;
-moz-transition: opacity 0.4s ease;
-webkit-transition: opacity 0.4s ease;
}

.popup-overlay.show {
display: flex;
opacity: 1;
position: fixed;
z-index: 9999;
cursor: pointer !important;
backdrop-filter: grayscale(100%) blur(5px);
-moz-backdrop-filter: grayscale(100%) blur(5px);
-webkit-backdrop-filter: grayscale(100%) blur(5px);
}

As always thank you for all Peter’s knowledge share.

But I also noticed that if I don’t have the display: none; then it will stay over every other divs! So what could be the fix here?

Thank you Peter for all your efforts on helping the community.

I’ve followed your code and noticed that for some cases the transitions might not work since the display of .popup-overlay is set to none.
So I’ve commented it and the fades worked.

AMP.

Sorry for the delay

Could you send a link so I could check the CSS please?

Sorry missed this comment – please submit a support ticket and we can help.

Sorry this code is just for the cart page

Sorry for the delay.. I see no button on the site, do you need help with this still?

Sorry for the delay here – missed the comment.

Probably too late, but if you send me a link to the site i could check it and let you know the CSS to use

So sorry for the delay, missed this comment 😀

The way you would do it on mobile would be in the theme customiser I am afraid – or are you wanting the button in the menu that opens?

Thanks, Dan. Awesome comment and appreciate the code for others to use

The search results template will pick up whatever is searched.

For example, if you want to search custom posts – use our Search Module in Divi Machine and choose the custom post you want to search, it will then do this.

One minor tweak… if the button text is long enough to wrap onto a second line on mobile, the default line height (9px) is too low – the lines overlap each other. I fixed it with this:

#mobile_menu .de-menu-cta a {
line-height: 1.3em !important;
padding-top: 9px !important;
padding-bottom: 9px !important;
}

It increases the space between the lines, but reduces the top / bottom padding to avoid an increase in the space above and below the text.

Cheers!

Hi, how to use it on the mini cart?

Acabo de te completar tu curso sobre directorios con Divi Machine y ACF, y ¡¡me ha encantado!!. Felicidades.

Tengo una consulta sobre otro tema, a ver si me puedes orientar.
Estoy haciendo un e-commerce de obras de arte, mayormente cuadros.
Utilizo woocommerce, DIVI y tengo todos los plugins de Divi Engine.

Mi problema es que que necesito incluir en cada producto el parámetro “artista”, de forma que luego pueda tener un listado de todos los artistas y, también, una página individual de cada uno, que se genere de forma dinámica, con su CV, fotos, premios,…., así como todas sus obras a la venta.
¿cómo puedo añadir este parámetro?.
Estoy probando con atributos, etiquetas, posts… pero no consigo aclararme.

Muchas gracias

Hello Kris!

Please see the image below as that URL should allow you to Log in OR Sign up with your email.

Please let us know if you still have issues.

Thanks for the code – I am sure it will help others too so really appreciate the comment.

Have a great day Mike!

// Remove default_address_fields from checkout
add_filter( ‘woocommerce_default_address_fields’ , ‘custom_override_default_address_fields’ );
function custom_override_default_address_fields( $address_fields ) {
$address_fields[‘address_1’][‘required’] = false;
$address_fields[‘address_2’][‘required’] = false;
$address_fields[‘city’][‘required’] = false;
$address_fields[‘state’][‘required’] = false;
$address_fields[‘postcode’][‘required’] = false;
return $address_fields;
}

https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/

Hello,
that was the right solution for my site. Thank you so much!!!
If you use Cloudflare – turn off Rocket as Emilia explained in above link.
Thanks so much
Marek

Es la primera página que deseo crear y al revisar los pasos indicados, ya esta con 768M en el límite de PHP, entonces a qué se debe que no puedo editar?

You are a very good teacher, you can explain difficult things clearly and understandably.
This is an amazing course, I really learned a lot. I got my certificate and I am very proud.
There is one thing, I would like to see added to this course and that is to monetize a website like this, because we are building websites to make money from them right. Maybe businesses would have to pay for the Classifieds and individuals do not. It would make sense if they could choose their user role on the registration page (business or an individual) and get a different page with or without payment options based on that role.
Could you give me advice on how to do this with this website? I would really appreciate it.
Greetings E R

Been struggling with this problem for days and most other sites use the ‘Flex’ CSS.
This Flex code doesn’t work well on phones and tablets
Your way of doing it works perfectly on all devices!

Top!!!!

Amazing solution and incredible customer support.

The actual website that I´m building, would be kinda nigthmare if wasn’t for this plugin. The custom fields integración, the Ajax filter, the carousel settings and, especially the excellent customer support…they solve me a couple of difficult things in a fast and reliable ways.

Lo recomiendo mucho!

Divi BodyCommerce can still do this 😀 Give that a try

Hi “Brayan” Have you resolved the issue ?

How did you updated this settings ?

I have tried all these nothing workings for me

location / {
#try_files $uri $uri/ /index.php;
# try_files $uri $uri/ /index.php?$args;
# try_files $uri $uri/ /index.php?$is_args$query_string;
try_files $uri $uri/ /index.php?$args$query_string;
}

Notes:
Create a New Mega Menú and select the layout from Divi Library you want to display and don’t forget to put the custom ID.

I created the new menu, but I don’t see where I must select the layout. Is it on the mega menu?

Is there a video I can watch or a step-by-step guide?

That would be “Thing #8 To Try IMHO because it’s more than apparent that Divi plans to do away with the classic builder configuration.

And I’m sure Divi is just a few (if not sooner) updates away from dumping the classic builder for good.

It will be at that point when Divi and I part company for good!

Any plans to implement ACF Flexible Content Type in Divi Engine?

Hi Andre,
Thank you for your feedback, and you are not wrong, our documentation needs work. We are working on a new documentation platform to address these issues and make it easier to keep the docs up to date as the plugins evolve.

In regard to the tutorials. If I am understanding you correctly, you would like to see more Divi Engine plugin-related tutorials, am I right?

As a sidenote, we do weekly mini-tutorials on our plugins called Quick Tips, and these are released every Friday in English and Spanish. Check them out on our Youtube Channel here -> https://www.youtube.com/@DiviEngine/videos

We appreciate your comments and will absolutely strive to do better!

Hello Andre! Have you seen our Divi Machine Classifieds course? We have worked for months to create it to address exactly the issue you are mentioning here. Please take a look at that as it covers from beginning to end, how to create a classifieds site using Divi Machine, and then enhance that site with Divi Machine Accounts and Divi Form Builder.Check it out here -> https://diviengine.com/product/divi-machine-classifieds/ I think you would really like it!

Hi Luis,
These people create very good things, but their documentation and classification of resources are so bad. I waste hours doing the same, searching how this works (machine account), and I found documentation but is so basic. It is frustrating

I have the same issue, did you fix it? The top of the colored button is aligned with the top of the other menu items. We need the top of the button TEXT to be aligned with the top of the other menu items. See https://stilltinnitus.com

They remain required.

Can you send me a URL so I can try see and help with CSS – it would be an overflow-y: auto CSS

I’m just struggling now to find a solution to be able to have this overlay and a scroll down possible in case the content is too big to show in just one screen. For example one long form.

Thanks, glad you appreciate it 😀

When i setup 4 column for product on desktop and on mobile will be 2 column. If i wanna product on mobile just one coloumn……..anyone know how?

Please advice

BR

Hi Lucas!

Thanks for the kind words. You could try setting the position to Absolute and then give it explicit Top and Right values.

If that does not work, maybe try the transform settings on the design tab and position it to the top/right.

Hope this helps!

Is there also a way to display the form in the top-right corner, right underneath the header?

I tried it using display: fixed and with top and right properties, but couldn’t make it work 🙂

Best (and happy new year!),

Lucas

I have the same problem. Is it possible to prevent horizontal & vertical scroll when fullscreen menu is open ? Thank you in advance 🙂

The Outfit Trend that has Largely Attracted People
Loungewear is designed to be comfortable without sacrificing style; hence lighter textiles are most frequently utilised. This makes them ideal for working from home, casual meetups, coffee runs, grocery shopping, or staying in on days when you want to focus on taking care of yourself.
From a loose dress to a cotton tank top with baggy pants, you may discover loungewear items in a variety of designs to precisely complement your personality. The goal is to feel comfortable and at ease wherever you are without losing your sense of fashion and style.
Today’s fashion is exhibiting an increasing level of creativity. In other words, technology should be utilised as a tool for comfort rather than binding us to the set standards of consumption and beauty; hence loungewear acts as a means of expressing our uniqueness without sacrificing comfort.

Just wondering why you guys never follow up on your blogposts ad or video tutorials.
When you don’t want to just turn of the option to reply.

This is becoming an embarrassment and not just on your own site but also on Youtube and the Facebook groups!

Not sure about Astra or what child theme you are using.

It works with Divi – we do it and tested

Amazing – thank you for your purchase. This helps us to give and help others! Without you, we cannot do this.

Hi Gavin

Please create new logins on Jira Portal – it is not linked to our logins on WordPress site here

I want to submit a ticket but when I use my logins it’s not working. I use the same mail address and login than my account.
Can you help me please.

Thanks for help

Quisiera saber como puedo instalar un pack

Gracias

Hi. The checkout style is from our premade checkout styles (Shopify) – check here: https://help.diviengine.com/article/654-premade-checkout-styles

Hi Rashel

I ran into the same problem 🙁 – and I have solved it 🙂

If you set an CSS ID to your menu modul (advance tab) eg “menu-cta” then you can add that ID to your css code like this:

#menu-cta .menu-cta-button a {

background-color: #008491; /* Change button background color here */
color: #fff !important; /* Change button text color here */
}

And the rest of the css code of course 🙂

Hi Shanne

I ran into the same problem 🙁 – and I have solved it 🙂

If you set an CSS ID to your menu modul (advance tab) eg “menu-cta” then you can add that ID to your css code like this:

#menu-cta .menu-cta-button a {

background-color: #008491; /* Change button background color here */
color: #fff !important; /* Change button text color here */
}

And the rest of the css code of course 🙂

Sorry this snippet does not do this. Maybe using a plugin like https://wordpress.org/plugins/relevanssi/ might work.

Mi estimado Ricardo una disculpa por la demora, voy viendo tu comentario. Muchas gracias, me anima mucho ver que es de gran valor el contenido que creamos para ustedes.

De momento la función de repetidor para crear tablas solo se puede con la versión pro de ACF, sin embargo puedes utilizar el módulo de repeater de divi machine para las demás cosas en las que ocupes usar la función de repetidor, esperemos desarrollar mas opciones viables en un futuro así como el de galería que mencionas para que se vean tan limitados por la versión pro de ACF.

Un fuerte abrazo amigo. Saludos desde México 🙂

Muchas gracias amigo, fue un placer poder apoyarte! Cualquier duda que tengas o pueda surgir, no dudes en contactarnos va? Saludos desde México

Pleasure, awesome to hear 😀

Thanks, added it back 😀

You might want to add that back in. Fortunately watching your video showed me what I was missing and where.

File contains only:
• Divi Mega Menu Business Templates.json
• README_FIRST.txt

Is there a way to make the hamburger menu “sticky” to the top of the page? Currently it scrolls out of view.

I tried setting scrolling to “sticky” in both the section and menu module, but neither have any effect.

Thanks for the heads up! We will test this when we have a second and update if needed.

Well done on the expansion to WP Enhanced.

Will you be updating the existing plugins to ensure that they are compatible with the latest version of WP.
I’m only asking because the Responsive Videos plugin hasn’t been updated since Dec. 2017.

Cheers,
Donal

Hi there, Remi!

If you want to change the hover text color in the menu, all you need to do is edit the global header in the Divi Theme Builder and open the Menu module settings, go to the design tab, then change the menu text hover color to the color you want. No need to write CSS.

Hope this helps!

Tried to set this up but got a json error. No idea what to do.

I wanted to know if it is possible to change the text color when there is a mouse-over? The menu is white, and when I tried to add the specific color in the a hover part of the CSS it did not work …

Thanks again !

I understand, but the import in the Theme Builder gives 5 unassigned models because the categories do not exist. Naming the patterns might also help.

At least indications on the categories to be created and the type of content would be needed to make the demo functional.

FYI, the basic WordPress import/export tools can be used.
Ultimate CSV Importer PRO offers for example powerful CSV import/export tools very easily.

Your demos are really great, but I think most people aren’t going to get it to work easily because of that or otherwise with a lot of effort.

Sorry a lot harder to provide export file with custom posts and categories etc.

You need to add your own posts and categories but should not take too much time and also would need to be what you want right?

Could we have an import file for the data please ?

Sorry to hear this. Please log a support ticket to get help on this

Hi I tried the above function and now it won’t let me upload png or jpg files. I tried to add those in the function but it doesn’t work. Is there a way to get them allow uploads? I can successfully upload svg using a different function and it allows png and jpg uploads but not font files.
Thanks

Hi Lambert,

See here:
https://help.diviengine.com/article/152-how-to-use-a-divi-engine-layout-pack
&
https://help.diviengine.com/article/987-install-edit-a-bodycommerce-layout-pack

Muchas gracias señor. Really appreciate the support!

Hi,

Were you able to get it working?

Sorry to hear this, please submit a ticket here: https://diviengine.com/submit-ticket/

Sorry to hear this. Please contact support about this and we will help: https://diviengine.com/submit-ticket/

I want to know if there is a problem with Divi Engine account access.

My user and password are no longer recognized and I cannot access my license numbers which have been deactivated on wordpress

Thanks for your help

Anyone got a Solution about this?

It might be worth mentioning that method 2 also works for individual lements in a layout used in an archive loop in Divi Machine. I wanted to vertically center titles, regardless of whether they wrapped onto more than 1 line. This is complicated using the single layout of course, but method 2 did the trick.

I had to apply it in the Divi CSS rather than in the element itself, as the Post Title block defaults to H1, and I wanted it as H2, but it works beautifully with a custom class.

Solo como algo adicional, se que ACF es un gran plugin que ayuda a Divimachine a realizar maravilla, pero sería bueno no depender solo de ACF, pq caracteristicas muy importantes nos queda corto, como por ejemplo los “repeatable fields” de ACF, eso solo se consigue con ACF la version pro, solo por ese campo debemos pagar para poder usarlo, creo que estaría dispuesto a pagar un adicional por esa caracteristica y no depender de ACF pues para latinoamerica es caro mantenerlo, o existe algun modo de hacerlo asi como la galería? Si lo existe por favor sería bueno que nos indiques o quizas hay un video ya hecho y no lo he encontrado, o quizas que divimachine sea compatible con JETengine, ACPT IO, o MetaBox que si tienen membresia lifetime.

Bueno Fer, espero sigan desarrollando este gran plugin, exitos y que vengan mas video con cada mejora que hagan. sigan asi muchachos. Saludos

Thanks Ravi. Really appreciate the comment. God bless you too brother!

I read your life journey from South Africa to England. I feel you are a great personality who work hard and look also for the Society. God give you more prosperous & happiness in your life.

God Bless You & Your Family!

with regards
Ravi Kumar,
Kolkata, West Bengal, India

Hi, same problem here.. It does not work with search module, in my case it adds “&et_pb_searchform_submit=et_search_proccess” to URL and it loses its functionality 🙁

Results page URL is: mydomain.com/?s=xsearchtermx&et_pb_searchform_submit=et_search_proccess&post_type=product

Any possible solution?

Try disable “Dynamic CSS” in Divi > Theme Options > Performance

Have you come up with a viable solution?

Pleasure – we hope this helps us deliver better updates and products for everyone 😀

I am also having that problem 🤔 How would you restrict scrolling?

– A well-designed user & backend interface
– A well documented history of updates
– Quality support

Divi Maschine ticks all the boxes!

Yes you can create posts with Divi Form Builder – you can use ACF and Divi Form Builder together. Any issues please email su*****@di********.com with questions. Thanks!

Actually this will not work as it is exactly the same code as when we want it to stick.

This is what worked for me:

@media (max-width: 981px) {
.sticky-section {
position: static;
position: -webkit-static;
}
}

The media query should be max-width, not min-width. And the position value should be static, not sticky (as it is already is sticky on larger screens).

Also, remember to add the sticky-section class to the column, not the module itself.

My team and I were able to create a quite complex site with Divi Machine with the help of incredible support from Divi Engine!

As an agency owner, using a great product is not enough, having excellent support and a great product is every agency owner’s dream!

Divi Engine ticks all the boxes!

Much Appreciated.

You can use a plugin like this: https://wordpress.org/plugins/duplicate-post-page-menu-custom-post-type/

It will allow you to duplicate custom posts.

Agree there are some issues – please contact ET about this 😀

I get a little bit of horizontal overflow when the menu is open. Both on mobile and desktop! How do i fix that. https://vitickevit.lsu.se/antisemitism/ thats the link to where the menu is live.

Thanks 🙂
/Jocke

oh ok. If you want me to check, please show it so I can check your website

Hi, there… thank you for the update.

Still no results. I’m gonna hide the search bar meanwhile.

I have updated the article – please check

It seems you are using the theme builder and the search module has the hidden fields to search posts. Our tutorial above was used before the theme builder so was only for the default header.

I will check this and see if we can update for the theme builder too

But this time is not showing any product on a new site I’m building for a new client. I checked all the setups between both pages and look the same. Any help?

This is the site: https://www.opticentroxpress.com/

Hi. Sorry about this.

Where are you getting stuck? Please can you email su*****@di********.com and we can help you further

That is an incredibly kind comment. Know that your purchase will be helping these kids directly!

Thanks!

Sorry Andreas, now is updated, you can download it if you want 🙂

Best regards
Andreas

I am a total newb at this and need your help with stopping the video when I close the lightbox. Should I add the video in as a Video Module or Code Module and then include the ID? And for the JQuery part how is this written out. Hope you can answer my question when you have a moment.

Then I found Divi Machine. Wow what a great experience with this plugin. Lots to this but they have a bunch of video tutorials and cover basically everything. Yes takes a little time but once you get it your website development comes along fast.

Great support team. 2 different timeshare fast response and was a great back and forth.

I trust their stuff and highly recommend them .

Thanks Team

You have to delve into the workings of Divi Engine, but then you can make things that otherwise would never be possible. Look at my website and see it yourself: http://www.tvserieskijken.nl.

Also the support is good! Peter and david helped me very good.

Grazie! Non possiamo farlo senza di te

Thanks so much for posting your answer, I think it will help so many other users 😀

Have a great day!

Me again 🙂
Fixed !!!!

Here is the code pushed in functions.php
(page_name removed because not required in my case)

It looks like code is not accepted in posts here, so here is the illustration screenshot: https://snipboard.io/92hZ08.jpg

–

isset($_GET[‘gclid’]) ? $_GET[‘gclid’] : “”;
has been taken from my gclid injection script

–

Don’t forget to set page_url as a non required field in the Divi contact form setting (in order to allow the mail to be sent if there NO gclid in the url).

–

Hope it will helps 😉

My url looks like : https://mydomain.com/contact/?gclid=12345

Can the script be changed to include the full URL including the gclid parameter ?

Thanks

Have a look at the readme in the background-masks folder

Divi>Includes>Builder>Feature>Background-Masks

The question then is….how do you maintain your custom masks on updates (maybe a duplicate/backup folder outside Divi, each time you upload and a restore option when you want to pul them back in)

I agree about the custom upload option. not sure we can do much about it if honest, but will take a look

Send me a link to the website so I can see please?

Thank you very much to the Divi Engine team for getting me setup!

It works now 😉 But another question would be how can i change the color of a blurb icon when active?

Amazing – thanks so much for this! Glad you sorted it

Actually just figured it out. Gave the class popup-content to the row instead of the column.

Custom post types, taxonomies and custom fields are powerful capabilities. Divi Machine solves the problem of providing modules that exceed the equivalent modules from Divi while supporting built-in and custom types, taxonomies, and fields.

I can’t recommend Divi Machine highly enough.

Thanks

The way this plugin expands what Divi offers is just amazing and not to mention a time saver. I recommend this Divi Machine to any Divi user.

The support that I have received from the team has also been very timely and they have been very easy to work with and have helped me find solutions to minor issues.

https://intercom.help/elegantthemes/en/articles/5454324-how-to-fix-cloudflare-s-rocket-loader-conflict-with-jquery

explains the problem with the Cloudflare rocket builder

you might wish to add it to your list

What ever I put in the URL filed it will not be accepted. My site is https://basiclust.se/.
And it worked properly all the way till where I need to put my mail and my site URL.

Can you please tell me how this URL can be right and correct? https://basiclust.se/

Kind
Zayn

Joe thank you so much.

It was the “Defer jQuery” that was giving me so much trouble.

– Thank you very much Kriss for the support.

You would need to alter the code to target or get the CSS class and then only open this – but this would require more thought and coding.

Maybe the solution for you if you do not know JS code – is to duplicate the click function for each pop up and change the css class for each

Hiya, I’m really trying to figure this out to make sure multiple popups work on the same page but I can only get it so all of the popups are triggered at the same time.

Can you do a similar one with the search icon? I’d love to have just the search magnifying glass in my header, and have it open up onto a full screen with the search part field …

Sorry it was down – enabled it back – https://bodycommerce-restaurant.diviengine.com/

.md-breakpoint {
columns: 300px 2;
}

I’m am simply trying to get 4-column rows to break into 2-column rows earlier in DIVI.

Any insights would be amazing! Huge fan of the Divi Engine Mega Menu and Mobile Menu module by the way 🙂

Really happy to hear this – thank you!

Do you know if it is possible to target the divi audio player button with this code?

I have tried but been unsuccessful so far.

Many thanks

That is a different ball game. Not so easy, sorry. If using BodyCommerce and our mini cart option – you can make this happen this way

Pleasure – have a great day!

Cheers,
Nathan

Is there a way to have multiple overlays?
I have 6 buttons and each one has a different content that needs to be shown.

Thank you so much!

Hello,

nice code.

but i need to say that now all other buttons all over my homepage are not working anymore. doesnt matter they are linking to other pages or just “add to cart” buttons for example.

Do you have any help for me? 🙂

– Change this for section if you use section.

$(‘.popup-close’).on(‘click’, function(){
$(this).closest(“.et_pb_row”).remove();

$(window).resize();
$(‘#page-container’).resize();

});

Pleasure, glad to help 😀

I have to add a static text module below my slider modules, but I cannot put it in a new row or section due to it being a slider within a slider. Any css I can add that make it ignore the columns-class or something like it?

I try to keep my edits in css anyway, but now it’s even difficult just to try and apply classes?

Great plugin guys honestly. I highly recommend the lifetime membership to anyone that is reading this. All their plugins make you a more efficient Divi User/Designer/Developer. Hats off to everyone at Divi Engine

Merci à toute l’équipe pour tout ce que vous faites.
Continuez à nous faire rêver 😉

Bonne vacances et surtout bonnes fêtes de fin d’année.

David

Hi,
Thanks for your answer 🙂
Here is what I have when I inspect the button: https://share.vidyard.com/watch/Bn2kgSERGEPjxoggAXUmWN?

Thanks for your help!

I checked and it works for me – can you right click and inspect – is there a JS error?

I have a problem though…
It popup is showing on a “normal” Chrome window, but it doesn’t show on an Incognito window.
See here: https://share.vidyard.com/watch/U4X2P3KhqnFSCG6a1gar3M?

How can I solve this?
Thanks

I only have one problem: I did this on two different sites. One site works perfectly.
The other does not. It immediately gives me several errors when I try to place an order.

Billing Surname is required
Billing Name is required
Billing Address is required
etc, for all the required fields.

Any idea how to fix this?

Very good – thank you for letting us know!

All the best,
Neil.

All thanks go to you and our other awesome customers. We cannot do this without you 😀 Thank you!

-I have create a section with some modules like text, image and two buttons

-I like to have the section shown as auto popup as soon site is visited (covering the hole display)

-One button should close section so that the page beneath can be seen now

-One button should redirect to a some other url

I would appreciate a lot for some help,

best regards,
Amir

yes 2 cart icon same here, even after i checked Shortcode in menu?, still no differnt.
also when i added the code in the builder i have the same result.

Thanks

If I use this shortcode in the secondary menu I get two cart icons.
What can I do wrong?

This would require more custom code – sorry.

There are plugins like relevanssi that could possibly help

Same here!

Amigo!! Muchas gracias por tu comentario, un gusto poder coincidir y me alegro que tu experiencia con el soporte haya sido grata! Cuenta siempre con nuestra ayuda y dale con todo que seguro te convertirás en un gran diseñador web ! Un fuerte abrazo y bendiciones 🙂

Scratch that snippet – it hid the header/footer on the live page too (doh). I’m sure there is a combo that works, but I’m on deadline and I’ll just adjust the CSS as needed to edit via the Theme Builder.

If someone else figures it out, please post here!

.page-template-default .et-l.et-l–header, .page-template-default .et-l.et-l–footer {
display: none !important;
}

We had an issue that looked for all the world that it was being caused by Divi Machine. Jeff jumped right in and not only figured out that it wasn’t Divi Machine causing the problem, but that it was an issue with duplicated ACF field names across more than one CPT.

Fantastic support, when it would have been easy for him just to say “It isn’t us” and walk away, but he didn’t. I can’t recommend Divi Engine highly enough

The only solution is to delete everything in /wp-content/et-cache/ and refresh page. Then the changes will be reflected. I have been looking for the automatic clearing of cache as well

body {
margin-top: -28px;
padding-bottom: 28px;
}
body.admin-bar #wphead {
padding-top: 0;
}
body.admin-bar #footer {
padding-bottom: 28px;
}
#wpadminbar {
top: auto !important;
bottom: 0;
}
#wpadminbar .quicklinks .menupop ul {
bottom: 32px;
}
#wpadminbar{
top:auto;
bottom: 0;
}
#wpadminbar .menupop .ab-sub-wrapper{
bottom: 25px;
}
@media all and (max-width: 600px){
#wpadminbar{
position: fixed;
}
}
@media screen and (max-width: 575px){
html.js-focus-visible {
margin-top: 111px !important;
}
}
@media screen and (min-width: 576px) and (max-width: 1024px){
html.js-focus-visible {
margin-top: 158px !important;
}
}
';
}
// Action to add CSS on WP admin
add_action( 'admin_head', 'divi_engine_move_admin_bar_bottom' );
// action to add CSS to frontend
add_action( 'wp_head', 'divi_engine_move_admin_bar_bottom' );

Regarding DiviEngine, this company delivers what it promises:
Tools/plugins of great value and need and best support service. More than this, you get the feeling that you are part of this family, which actually really is so. I purchased:
– Divi BodyCommerce (with Ajax),
– Divi Mega Menu and
– Divi Mobile and always received all the support I needed.

I am so glad that I have chosen this company and the products above, thank you DiviEngine!

Thank you for this!! What do you need to change to make it bigger? I’m a total Noob 🙂

The plugin makes development very quick and the support is amazing, go on this way!

https://martonservice1.hekko24.pl/test29/test2/

-> choose ” Hej, powiesz coś więcej ? “

Perfect 😀

Thanks … exactly the script I needed!

Same issue here. I did what you suggested, but it did not worked. Anything else?

No, this will work with default Divi + Woo

This template works with our plugin so you will need to have a licensed version of Divi Machine I am afraid. Hope this helps 😀

Should work with a code snippet plugin too..

When you do this and inspect the page, can you see the code in the footer of your site?

Ricardo.

Have you downloaded the latest child theme we have linked above?

What is wrong, the version number is not changing?

Well done 😀 Have a great week

I had a problem with the scroll bar not showing for very long pieces of text, and I put

overflow:auto;

into the

.popup-overlay.show class

This seems to have sorted the problem.

Not sure, should work – can you send a link to your site so I can see?

You could but not related to this tutorial – sorry. If you are using our plugin BodyCommerce you can make it sort by this, so when they search it will be like this

Sure enough, your tip on re-saving Permalinks did the trick.

I would NEVER have thought of that.

THANK YOU!

Not quite sure what you are asking – as its all done in the Divi Builder you can add what you want in there 😀

Love this code.

Good Job

Actually it’s not working anymore for me. Lou hijacked my comment 😉 So how can I fix the problem now?

I have followed you’re video 1/1 but i can’t get it to work!

I get this Error : “Refused to apply style ‘https/www.aarhusaabnerop.dk/wp-content-themes-Divi-Child-Theme/style.css?ver=5.8.1’ because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.

The file path is correct!

Have you seen this error before?

Figured it out. If you’re on the newest Divi version, they have a new tab under Divi > Theme Options > Performance. At the bottom is a toggle for “Defer jQuery And jQuery Migrate” — make sure that’s turned off. I’ve noticed a lot of strange front-end functionality issues with third party plugins/JS so we’ve turned this option off on all Divi builds and it’s worked in most cases to solve the issue.

Same issue here. It was working a few weeks ago but no longer works. Everything is vertically stacked on the left-hand side of the page. we were originally using v1.6.0 via the “Icecream Divi Slider.”

Same issue. Did anyone got a solution for this.?

Perfect – thanks!

Thanks Divi Engine, it works with another class.
And i use another hook “wp_footer” for the custom css.

I had this code on several sites and it was working brilliantly, however since the new update last week it’s no longer changing the ver=# number on either the ‘divi-style-css’ or the ‘child-theme-css’.

They both appear to be always loading ver=1.0.0

any thoughts why this might be?

Hi. We dont change the order of the cached-inline-styles, this is from Divi

Why do you want to change this, because of CSS hierarchy?

Try adding another class to make it a higher priority

I am unable to post the link to Stackoverflow here because of SPAM, but details are listed under the following question:
“Let the child CSS file load last in the DIVI Theme WordPress”

Kind of hard to do this as there is not a way to know when it is loaded – it should not take too long to load the content?

Good news – thanks for letting us know 😀

I see

Please check now, we have fixed the code to remove the extra file

Actually it works, I just forgot to save the functions.php file.

The page_name works but I’m not getting the page_url when receiving the emails. My custom fields have the same name as the code provided. any ideas?

As of version 4.10.X, stylesheet uses id = “divi-style”. the above code inserts a duplicate child-theme file and the filemtime function does not work

Can you explain more what you mean about it not working? The child theme should work just fine

Thank you for everyone who used this feature

we have the same problem in the slick slider that implemented on the site ive been working on.

Well actually tried to go through with the implementation, but I can’t seem to get it to transform into a slider.

The blurbs keep on being vertically stacked. I use the exact naming of the child theme folder, so that should be ok. In inspect mode I can see this error: Uncaught TypeError: $(…).slick is not a function
at HTMLDocument.eval (eval at ((my website url)/:2), :4:21)
at e (jquery.min.js?ver=3.6.0:2)
at t (jquery.min.js?ver=3.6.0:2)

Any idea what is wrong?

With Divi, there is the theme builder, and I was trying to customize brand pages using it. I could only get as far as modifying the title and description of the brand page – for example with an audio/microphone store we’re building.

I couldn’t find a way to edit and configure only products associated with the brand to show within the brand page.

We have a range of microphone brands such as AKG, Sure, Blue Microphones etc all with the default boring brand pages and I was hoping to customize the layout but not having much luck.

This tutorial was nearly what I was after but I am at the next step now of modifying the brand page using Divi.

Any suggestions or a point in the right direction would be amazing.

Thank you!

Hi,

I have a similar problem to yours with the Divi contact form module with the divi theme. Were you able to resolve this?

I get this weird error Uncaught TypeError: jsForm.submit is not a function

and the GA event also fires regardless of form submission.

Great thank you!

This is an issue with touch on mobile – try change to be touchend instead of thouchstart.

Sorry cant debug this too much as need to spend time on plugin dev 😀

Yeah thanks a lot for that trick!
But also with the new code it just works on desktop – but on mobile the pop up disappears instantly (the same issue like Funkman773)…

Any suggestions?

Sorry about this – did you get all the other layouts and just not the shop template?

I have download the coffee theme, but i do not received the shop layout in the libery.

Hi there! Thank you so much for your reply 😁

Unfortunately, this code will not work with BodyCommerce without some modification, but we are considering adding it as a feature in a future update.

Stay tuned!

Can you try change the code from

$(document).on(‘click’, ‘.popup’, function(event){

to be

$(document).on(‘touchstart click’, ‘.popup’, function(event){

Does it work?

Pleasure – glad you could find a solution to the problem 😀 Have a great week

please see this doc: https://help.diviengine.com/article/275-step-9-bottom-navigation-style

I would also like to know how I can add the cart to one of the tabs in the bottom bar.

Great Guys- Shoutout to Kris & Peter

Any suggestions to me?

So the page where the popup appears is a private page that only the registered users can see it.

Hi Jual,

Not sure what you mean, are you asking where you add the CSS code?

If you are a Divi user, and you are considering Toolset, Pods, or CPT UI with Advanced Custom Fields for your next project, you need to take a look at Divi Machine first.

No stupid question

You can use FTP or file manager on your server.

or you can install a file manager plugin on your website to update (but NOTE – delete after)

Hope this helps

Thank you for the comment, glad it helped 😀

Can you try disabling static css file generation in Divi > Theme Options > Custom CSS?

Good to hear 😀

Hi Laura

Thanks for the kind comment and really happy it helped you!

Have a great week.

Adding display:none to the .popup-overlay CSS easily fixed this, for anyone who encounters the same problem.

This is so nice and simple. Your instructions are easy to follow. The fade is lovely.

The X doesn’t work for me so I got rid of it. And I did need to read other people’s comments to see where I needed to put the CSS and JS because putting them in the page CSS section and Code block didn’t work. But aside from these small things, this is a perfect solution and I’m so grateful you shared it with is. Thank you!

Try clear cache or disable any other plugins to see if this solves it.

Great to hear – thanks for the comment

Great, thanks so much for commenting – glad it was helpful 😀

Thanks – which layout are you referring to?

I’m very novice in wordpress, and this was beyond helpful.

Nice layout, but I do not see that the package contains the landing page layout?

Try clear cache or disable any other plugins to see if this solves it.

Good to hear you figured it out.. It probably is so different to Elementor but Divi is amazing – stick with it 😀

Never mind, I figured it out. I was putting all the stuff in a row instead of a new section. I’m relatively new to divi and I pretty much hate it compared to the ease of Elementor. Argh. Your tutorial is good. Thanks!

Yes it still works – I actually did this on a customers site the other day.

Send me a link to your site so I can see?

It’s just what I need, especially if it can cause the search box to search SKU values.

Yes you can use the Divi Builder to create the pop up – this is in the tutorial 😀

Is there any other solution for the Visual Builder CSS? I use the popup on every page (global footer) and the customer wants to edit the pages himself and the workaround is too complicated for him.

Hello Connie!

Robey from the Divi Engine team here.

WordPress is notoriously fussy when it comes to fonts, especially TTF files.

Sometimes for cases like this, you need to add an additional filter to the functions.php file below the code block where we enable the mime types.

Please go ahead and add the code below to your functions.php and let me know if it works 🙂


function divi_engine_font_correct_filetypes( $data, $file, $filename, $mimes, $real_mime ) {

return $data;
}
add_filter( 'wp_check_filetype_and_ext', 'divi_engine_font_correct_filetypes', 10, 5 );

You don’t need to but it is better to have this. You could link direct to the script on cdnjs = https://cdnjs.com/libraries/slick-carousel

Let me know if this makes sense

I used the mime types ‘font/otf’ and ‘font/ttf’

no chance

Hi,

Got the answer via email:

Please add this CSS to Divi > Theme Options > Custom CSS

#page-container .bc_minicart_section#float-cart {
left: auto !important;
}

Can you send a link to the site so I can see?

For some reason the cart placement is on the left and not the right as per the css provided by this great tutorial. I have tried to force it with the section’s position option under the advanced tab, but then the floating cart disappears.

I have tried to add a left position of 95vw, to push it left, in the builder shows that it is then on the right hand side of the screen, but once I go on the live site then it still is on the left hand side.

Please help!

Pleasure 😀 Keep it safe

on line:

error_log("Variation Product", 0);

Nobody else had that?

http://staging-keukalakesideinn.kinsta.cloud/accomodations/single-queen-bed/

Thanks in advance,
Dave

Nice! So glad it helped you

I found very useful the custom scripts selection for minification

They also responded to facebook questions on the weekend, then checked in with me later to make sure I saw the response.

5/5 for a great product and support.

Divi Engine is everything I was looking for to create custom blog cards and a filtering system. Short learning curve and highly customizable. I love it.

I had one small issue that was resolved quickly by the crack support team. If you need to take Divi to the next level, this is your plugin!

.et_builder_inner_content {
position: relative;
z-index: auto;
}

if pop-up overlay doesn’t go over the header or footer.

Hola Luis! Muchas gracias por tu comentario, me alegro que hayas adquirido la membresía, ahora que tienes acceso a todos los plugins podrás tener una mayor facilidad para crear sitios increíbles. Y en cuanto a las plantillas, es un poco complicado explicarlo por aquí pero en esta semana (probablemente mañana) suba el tutorial explicando cómo importarlas para que las puedas utilizar, vale. Estate al pendiente en nuestro canal de youtube o activa la campanita para que te llegue la notificación de cuando suba el tutorial 😉 Saludos desde México.

I’m so happy and highly recommend ! All my future client’s store will be done with your plugins I can guarantee it. Thank you DiviEngine !

Sorry we do not have a tutorial for this – but it would be similar method of hiding the short description on the page and then on load, to automatically add this text

Lo único que necesito que envíe la descripción corta del producto en vez de la URL.

Saben como puedo hacerlo?

Gracias

Is it CSS code that you add that causes this?

Where are you adding your CSS?

Frederik, I too had this problem. Changing the z-index of the main-footer didn’t help as then the footer overlay on top of the popup when I scrolled to the bottom.

What I did in css was add the following to .popup-overlay css

z-index: -10000; /* moves the section behind all the rest so it is not shown */
display: none;

Yes should work – send a link to the page so I can see, might be able to find out

To recap I’ve added two fields (Input Field), made them display:none, added the code to my functions.php file in child theme, and added the fields to my email, e.g. %%page_name%%

You can change this in Divi > Theme Options 😀

Kris was extremely helpful and responsive when our Mega Menu started having issues on the site. We were able to have the problem resolved in no time. Thank you!

Pleasure – thanks for the comment!

Hola Selene! Para usar las plantillas es necesario adquirir el plugin de Bodycommerce, Divi Engine como tal no es un producto, solo es el nombre de la empresa, y contamos con varios plugins y nuestra membresía que incluye todos nuestros productos. Pero sí, solo necesitas BodyCommerce para utilizar las plantillas. Cualquier duda coméntanos de nuevo y estaremos felices de ayudarte 🙂

Una consulta para utilizar esta plantilla debo adquirir divi engine y por separado el complemento Divi BodyCommerce? O con solo con el complemento BodyCommerce ya podré utilizarla?…..

los leo, muchas gracias!! 🙂

Please download the Child THeme on this post so you can see how to set it up, it should help you.

Pleasure. You could change the CSS to make them bigger 😀

Anything else I need to do to transition to using this dynamic child theme on my current site?

Thanks

Perfect thanks!

haha makes me laugh this 😀 Will reach out directly and maybe we can meet!

have a great day!

What a surprise! Also started off life in South Africa, also wandered a bit through life before finding the right place to be, Also a WordPress specialist AND also based in Wales! And then the verse at the bottom of the page … well we have that in common too!

We are a new members and hope to watch you grow and develop your business. And who knows we may cross paths – we’ve followed you on Twitter and who knows, we may in cross paths in the real world!

Nice one – appreciate it!

var timeout;

jQuery(document).ready(function ($) { // On jQeury load
$(document).on(“click”, ‘.sub, .add’, function () { // When changing the custom “+” or “-”

if ( timeout !== undefined ) {
clearTimeout( timeout );
}

timeout = setTimeout(function() {

$(“[name=’update_cart’]”).trigger(“click”);
}, 5000 ); // 1 second delay, half a second (500) seems comfortable too// Update the cart
});
});

Thank you!

Thank you!

No, you can use our plugin Divi BodyCommerce to help you if you want to do this

Thanks, brother – appreciate the support 😀

I’d like to know this as well. Simply adding “show” to the popup class doesn’t work as the event is triggered by either a touch or click. I’ve tried various codes but none of them work.

Yes you could but would require more coding – you would need to check if it is a specific page ID – check here: https://stackoverflow.com/questions/16353441/wordpress-how-to-insert-code-to-header-for-a-specific-page-only

What attribute?

What do you mean including ID’s?