Hover and Shadows Effects doesn't Works


Topic: Hover and Shadows Effects doesn't Works

Michael Schulz pro premium asked 4 years ago

Hello, I need your help again. I have, among other things, a problem with the "shadow-2-strong" and "hover-shadow" functions. I tried to integrate this on a web site. But the function is not there. There is no hover effect and no shadow effect. I have integrated everything into a Word Press theme as far as you recommend it on your site. All links in function.php should work. In any case, there is no error message with Morzilla. In which files are these "shadow-2-strong" and "hover-shadow". and how can I check whether it is being accessed? I am using your html code form this side:https://mdbootstrap.com/docs/standard/content-styles/hover-effects/


Grzegorz Bujański staff answered 4 years ago

The easiest way is to import the mdb.min.css file. If you want to use scss files, you need _variables.scss, _images.scss, and _shadows.scss for that.


Michael Schulz pro premium commented 4 years ago

Hello Grzegorz,

I copied the file mdb.min.css into my theme folder, as well as the SCSS folder. That shouldn't be a problem, should it? How can I correctly integrate the individually required SCSS files such as _variables.scss, _images.scss, and _shadows.scss? Thanks in advance for the reply.


Grzegorz Bujański staff answered 4 years ago

If I understand correctly are you trying to add and css and scss styles? You have to pick one. Importing scss and css is an unnecessary duplication of styles.

You mention you named the file MDB-Free_4.19.2, so you are using MDB jQ 4.19.2 or MDB5 3.0.0 as you provided when creating this topic? This is important. Above you have pasted the link to MDB5 3.0.0 documentation. If you are using MDB jQ 4.19.2 and try to use code from documentation from MDB5 3.0.0 it may not work.

Without access to your application code, it's hard to say what might not work. Maybe the <? Php get_footer (); ?> is missing in your index.php


Michael Schulz pro premium commented 4 years ago

Hello Grzegorz,

I was not aware that this example is not compatible with the MDB-Free_4.19.2. How do I know on your side which example codes work with MDB-Free_4.19.2? I followed the instructions https://mdbootstrap.com/education/wordpress/theme-3/ and tried to create a new theme because I couldn't integrate the code into an existing theme. Do I have to replace all files with the files from MDB-Free_4.19.2 for an existing theme? And also insert the code from your side in the function.php? If I understand correctly, I can use either CSS content or SCSS content. How do I know which components or examples use CSS or SCSS? And how do I integrate the SCSS accordingly?

How can I actually include a screen shot in the comment?


Grzegorz Bujański staff commented 4 years ago

On the right side you have a toggler to switch between technologies (MDB versions): MDB5, MDB jQ, MDB Angular, MDB React and MDB Vue. If you want to use jQ MDB, you have to select jQ MDB with this toggler.

You don't need to modify the existing theme. You can create a new one. If you are a WP beginner I recommend starting with css. To use scss you need bundler to compile it to css. Unfortunately we do not have a tutorial/instruction to explain how to do this.


Michael Schulz pro premium answered 4 years ago

Good morning Grzegorz, Thanks for your quick reply. The MdB.min.css file has already been imported and linked via the function.php file. The scss folder is installed on my web space, but I don't know if it's connected. I found the files _variables.scss, _images.scss, and _shadow.scss. I have installed MDB-Free_4.19.2. Package. So good so good. I made the recommended function.php entries. Is there a reference to the SCSS documents needed there? It seems that my browser cannot access the necessary files. Do you need a special entry in the function.php file? Many thanks in advace Michael


Michael Schulz pro premium answered 4 years ago

Hello Grzegorz, now I've come a step further and have been able to insert some code on the page. While examining the code with Firefox I noticed that there was an error message that said: GEThttps: //zeolithwasser.ch/inc/assets/css/bootstrap.min.css? Ver = 5.6 [HTTP / 2 404 Not Found 155ms] I checked the path in Function.php, changed it too, but the message doesn't go away. What could be the problem? The page in question is https://zeolithwasser.ch/rezepte/ https://zeolithwasser.ch/ Pflanzengalerie/ Thank you again for taking the time. If I appear here, I will also buy the Pro version. It's just not worth it if I can't make progress with the integration of the files.


Grzegorz Bujański staff commented 4 years ago

It's hard to say anything without access to the application code. It seems that such a file simply does not exist.


Michael Schulz pro premium commented 4 years ago

The file is available, it is stored in the CSS folder. Only it is not found. I put the files in the Function.php folder, as described in your tutorial. I work with a WP theme from Wordpress and have made the link in function.php there. What surprised me a little is the abbreviation ver = 5.6 after the error message. The code in my function.php is: wp_enqueue_style( 'Bootstrap_css', get_template_directory_uri() . '/inc/assets/css/bootstrap.min.css', array()); . Im using a Child-Theme, but when I copy your code: function theme_enqueue_scripts().... in this function.php it dosen't work. Can I attach a screen shot so that you can see where the problem is or what do you need to be able to help me further?


Krzysztof Wilk staff commented 4 years ago

Hi!

If you are doing everything like it is shown in this tutorial https://mdbootstrap.com/education/wordpress/theme-3/ your import should look like this:wp_enqueue_style( 'Bootstrap_css', get_template_directory_uri() . '/css/bootstrap.min.css' );.

As Grzegorz said above - it is hard to manage this problem without access to the application code and the problem is with a path to this file. You can check in the tutorial I mentioned above. Dawid got a similar error when he tried to import a file that doesn't exist

If you checked your path and you are 100% sure that it is correct - maybe get_directory_uri provides you somewhere else? There is no such function as console.log() in the PHP, but I think you can try to use var_dump to check where it provides you :)

And yes - I think screenshots will be very helpful to help, so feel free to attach them below :)

Best regards


Michael Schulz pro premium commented 4 years ago

Hi Krzysztof, I found the problem. It was due to the missing entry get_template_directory_uri (). with the existing theme that I changed. Another note, under the link https://mdbootstrap.com/education/wordpress/theme-3/ I find the following code: '/js/jquery-3.3.1.min.js', array (),' 3.3. 1 ', true); In the files that I downloaded there is only the jquery.min.js file. When I open it, it is version 3.5.1. Are you sure that the code still matches the files? Thank you very much.


Grzegorz Bujański staff commented 4 years ago

The tutorial was created when we used jQuery 3.3.1. The latest versions of MDB use jQuery 3.5.1. It should be enough to change the code to: /js/jquery.min.js', array (),' 3.5. 1 ', true);


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: 3.0.0
  • Device: MacBook
  • Browser: Safari
  • OS: IOS
  • Provided sample code: No
  • Provided link: Yes