Bootstrap Dropdown Menu doesn't work on wordpress - php

I made an html template and want to convert this into WordPress. They are all working good, only the Bootstrap dropdown is not working.
Bootstrap says to use this CDNS. But I use (jquery-3.2.1) and (bootstrap.min.js) directly and I use proper.js (cdn). Normally it works perfectly, but when I enqueue this on Function.php like this:
wp_enqueue_script( 'bootstrap', 'http://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js', array('jquery'), 1.12.0, true);
WordPress shows an Error and my dropdown doesn't work.

I followed the following tutorial to use Bootstrap in Wordpress Admin Panel
https://rushfrisby.com/using-bootstrap-in-wordpress-admin-panel/
I hope this can help you, for me was good.

Related

Dash icons Not Showing properly in Menu Using Wordpress

The Mega Menu plugin works well except when activated it affects But some WordPress Dash icons not showing properly.
I have already installed cache plugins like Autoptimize and WP Rocket as well.
After clear cache from admin side but don't work till now. Also not giving any error in the Browser console.
URL: https://www.socomtactical.net
Max Mega Menu Plugin: https://wordpress.org/plugins/megamenu/
Note: I can't use Elemetor on my Website.
Screenshot:
Please let me know what is actually issue?
Thank you.
If you want to add Dashicons on WordPress frontend, you will need to enqueue them using PHP code in your theme functions.php file:
/* Add Dashicons in WordPress Front-end */
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}
Sample :
<i class="dashicons dashicons-admin-comments"></i>
Chose icon

multiple classes in the same css in Wordpress

Good morning. I've two document CCS, one contain Material Design Lite CSS and other is been created by me for customize WP-login.
I'd ask if it's possible write some classes written in Material Design Lite CSS in one class created in my customize WP-login CSS?
Cause for customize WP-login I can't modify his HTML, so I can modify this file by creating another CSS and overwriting class of original WP-login CSS.
Add the following code to functions.php to have WordPress load your new stylesheet.
function custom_login_stylesheet() {
wp_enqueue_style( 'custom-login', get_stylesheet_directory_uri() . '/login/login-styles.css' );
}
add_action( 'login_enqueue_scripts', 'custom_login_stylesheet' );
Now any CSS you add to this stylesheet will be loaded for the login page. This enables you to change any part of the design to your liking.
You can refer this alos: https://torquemag.io/2016/08/customize-wordpress-login-page/
Hope this works for you.

Setting Wordpress front page as Algolia search

I've recently setup a new Wordpress install to act as a survey database. The purpose of the site is to collect survey data and allow the admin's to filter and search submitted survey data.
I've installed and configured the Algolia search WP plugin. Everything is working properly. If I navigate to 'mydomain.com/?s=' I see the search form and it's returning results.
My question is how can I set the Algolia search page as my Wordpress index/front page? Or, how can I import this form to a page that I can designate as my WP static front page?
Further info: I have a child theme installed and can create custom page templates/template-parts
The reason is this code here...
if ( is_search() && $settings->should_override_search_with_instantsearch() ) {
return $this->load_instantsearch_template();
}
from this file
https://github.com/algolia/algoliasearch-wordpress/blob/1a51d3e2e8be12bfcbccd1ef2a722911a99376e7/includes/class-algolia-template-loader.php
Essentially it isn't being loaded at present where you want.
Putting this code in your functions.php will fix it.
add_action( 'wp_enqueue_scripts', function () {
// Enqueue the instantsearch.js default styles.
wp_enqueue_style( 'algolia-instantsearch' );
// Ensure jQuery is loaded.
wp_enqueue_script( 'jquery' );
// Enqueue the instantsearch.js library.
wp_enqueue_script( 'algolia-instantsearch' );
// WordPress utility useful for using underscore templating.
wp_enqueue_script( 'wp-util' );
// Allow users to easily enqueue custom styles and scripts.
do_action( 'algolia_instantsearch_scripts' );
} );
Then just add the instantsearch.php code or include the file to the index page/page you want to load it on.
(I just replaced the index.php code with the code from instantsearch.php and it worked just fine)
Hope that helps.

Including a Jquery file for form validation in a child theme

I've created a child theme and am running my site on that so that I can customise a form that I'm including on certain pages using the plugin 'contact-form-7". In my child folder I've placed a style.css, functions.php and js/custom_script.js. the style sheet is being imported fine but I can't seem to get my validation jquery file working on that form. This is the code I've been using:
add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
wp_register_script( 'custom_script', get_stylesheet_directory_uri() . '/js/custom_script.js' ,array( 'jquery'));
wp_enqueue_script( 'custom_script' );
}
console isn't logging any errors but I can't seem to find it in the web tools side bar UNLESS I remove "js/" when the custom_script is called, in which case a GET error pops up.
I'm guessing I'm incorrectly importing the file and honestly I can't quite get my head around these hooks and importing files just yet- only been using wordpress a short time.
Any help much appreciated.
I believe that you haven't included the JQuery file? You have to download it first https://jquery.com/download/, and then register it as you did with "custom_script", you just have to put it before the "custom_script" in functions.php, inside "custom_script.js" you could also do:
$(document).ready(function(){
});
Go to your console and if you see:
Uncaught ReferenceError: $ is not defined
It's because you haven't included the JQuery file as needed.
Hope this helps!
Leo.

Wordpress CSS Frontpage not working properly

So I have xampp and currently trying to learn some Wordpress development. I've made a simple bootstrap page into Wordpress, but which ever page I put as my front page does not load any CSS, whilst the other pages work fine.
If I change the front page to a page that previously worked fine, it also loses the CSS.
https://i.gyazo.com/bcb75b7a7fa64cd99cb43bd1c3067324.png
https://i.gyazo.com/7184fec113c09755961088fa69191528.png
What am I doing wrong here? I am running everything locally on 127.0.0.1
Thanks in advance for helping me !
The proper way to add css in your files using WordPress to use the function wp_enqueue_style it will not override the css declaration but enqueue it
In your functions.php
function your_scripts() {
wp_enqueue_style( 'filjoseph-style', get_stylesheet_uri());
}
add_action( 'wp_enqueue_scripts', 'your_scripts' );
and putting this <?php wp_head(); ?>in your header.php before </head> in your head section, wordpress will ensure the style.css loaded properly.

Categories