functions.php enqueue is breaking site

Resolved

(@bonsrec)

I’m simply trying to create my own custom wordpress theme, and enqueue some css and javascript to my functions.php file. Everytime i do, I try to view the website and it breaks my website completely. I’m so confused as to what i’m doing wrong. My functions.php is extremely simple and it’s something in this php that is disabling the whole site, but i can’t see what’s wrong? Can anybody shed some light as to what i’m doing wrong?

All i want to do is load in my css and javascript for my wordpress theme. This is so annoying.

<?php 
/**
 * bons functions and definitions
 *
 * @link https://bonsonline.com
 *
 * @package WordPress
 * @subpackage bons
 * @since 1.0.0
 */
 
function devwp_scripts(){
	/* references your stylesheet */

wp_enqueue_style( 'devwp-bootstrap' , get_template_directory_uri() . '/bootstrap.css') );

wp_enqueue_style( 'devwp-linerstyle' , get_template_directory_uri() . '/linerstyle.css') );

wp_enqueue_style( 'devwp-fontawesome' , get_template_directory_uri() . '/font-awesome.min.css') );

wp_enqueue_style( 'devwp-owlcarousel' , get_template_directory_uri() . '/owl.carousel.min.css') );

wp_enqueue_style( 'devwp-simplelightbox' , get_template_directory_uri() . '/owl.simpleLightboxcss') );

wp_enqueue_style( 'devwp-niceselect' , get_template_directory_uri() . '/owl.nice-select.css') );

wp_enqueue_style( 'devwp-animate' , get_template_directory_uri() . '/owl.animate.css') );

wp_enqueue_style( 'devwp-flaticon' , get_template_directory_uri() . '/flaticon.css') );

wp_enqueue_style( 'devwp-style' , get_stylesheet_uri() );

wp_enqueue_style( 'devwp-responsive' , get_template_directory_uri() . '/responsive.css') );
   
   /* references your script */

wp_enqueue_script( 'devwp-jquery' , get_template_directory_uri() . '/jquery-3.2.1.min.js' , array( 'jquery' ), 1, true);

wp_enqueue_script( 'devwp-popper' , get_template_directory_uri() . '/popper.js' , array(), 1, true);

wp_enqueue_script( 'devwp-bootstrapmin' , get_template_directory_uri() . '/bootstrap.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-stellar' , get_template_directory_uri() . '/stellar.js' , array(), 1, true);

wp_enqueue_script( 'devwp-simplelightboxmin' , get_template_directory_uri() . '/simpleLIghtbox.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-niceselectmin' , get_template_directory_uri() . '/jquery.nice-select.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-imagesloaded' , get_template_directory_uri() . '/imagesloaded.pkgd.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-istotope' , get_template_directory_uri() . '/isotope-min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-owlcarouselmin' , get_template_directory_uri() . '/owl.carousel.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-ajaxchimpmin' , get_template_directory_uri() . '/ajaxchimp.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-jquerywaypointsmin' , get_template_directory_uri() . '/jquery.waypoints.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-jquerycounterupmin' , get_template_directory_uri() . '/jquery.counterup.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-mailscript' , get_template_directory_uri() . '/mail-script.js' , array(), 1, true);

wp_enqueue_script( 'devwp-mapsmin' , get_template_directory_uri() . '/maps.min.js' , array(), 1, true);

wp_enqueue_script( 'devwp-theme' , get_template_directory_uri() . '/theme.js' , array(), 1, true);

}

   add_action('wp_enqueue_scripts','devwp_scripts');
   
   }

   ?>

This topic was modified 6 years, 3 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic
This topic was modified 6 years, 3 months ago by Jan Dembowski. Reason: Moved back to Developing with WordPress as this is a development problem

The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)

Thread Starter bonsrec
(@bonsrec)

6 years, 3 months ago

The email i receive with the error on is just as weird, it’s saying i have an excess ) somewhere, Which I don’t. Argh, this wordpress php is awful unless you’re using a pre built theme!

Error Details
=============
An error of type E_PARSE was caused in line 15 of the file /home/dh_mw68yv/bonsonline.com/wp-content/themes/bons/functions.php. Error message: syntax error, unexpected ‘)’

Moderator Steven Stern (sterndata)
(@sterndata)

Volunteer Forum Moderator

6 years, 3 months ago

Count your parens! You have an extra close parenthesis on many lines.

For example,

wp_enqueue_style( 'devwp-bootstrap' , get_template_directory_uri() . '/bootstrap.css') );

should be

wp_enqueue_style( 'devwp-bootstrap' , get_template_directory_uri() . '/bootstrap.css') ;

Joy
(@joyously)

6 years, 3 months ago

Also an extra closing brace at the end. The add_action call should be outside of the function.
Also, you are enqueuing a newer version of jQuery than WordPress has, but listing the WP jquery as a dependency. That won’t work. Using a different version of jquery than WP’s version will cause problems with plugins and with WP (in admin).
Thread Starter bonsrec
(@bonsrec)

6 years, 3 months ago
Hi thanks for getting back to me,

Could you just explain how I’m listing the WP Jquery as a dependency? What piece of code is doing that specifically?

I’m new to all these WP hooks and calls and wordpress in general. I’m a vanilla front end developer but having real issues with wordpress when working OUTSIDE a custom theme. Seems great if you have no idea how to code! Awful if you wanna get really customizable with it..

This line
wp_enqueue_script( 'devwp-jquery' , get_template_directory_uri() . '/jquery-3.2.1.min.js' , array( 'jquery' ), 1, true);

I’m simply calling jquery later? Where is wordpress pulling the default? Checked functions and themes :S giving me a headache lol.
- This reply was modified 6 years, 3 months ago by bonsrec.
Thread Starter bonsrec
(@bonsrec)

6 years, 3 months ago
Nope, still not working. I’ve reverted back to installing a completely blank theme. Got my header and footer .php all set up etc, created a brand new functions file, i’m trying to ENQUEUE ONE STYLE – Bootstrap.
```
<?php 

function load_stylesheets()
{

wp_register_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.css', array(), false, 'all');
wp_enqueue_style('boostrap');

}
add_action('wp_enqueue_scripts', 'load_stylesheets');
```
What am i doing wrong? It’s not pulling from anywhere and i’m following this tutorial on youtube @ https://www.youtube.com/watch?v=pFMgAWkrk8o&list=LLidYAyGVrM7DuqOhhI9JQRQ&index=3&t=0s

[profanity removed]
- This reply was modified 6 years, 3 months ago by Steven Stern (sterndata).
Thread Starter bonsrec
(@bonsrec)

6 years, 3 months ago
Please help me, i’ve been banging my head against a wall for nearly a week now and i’m ready to give up.

I’d rather just load it in via <script> and <style> tags and be done with this [ expletive deleted ] functions method of calling.
- This reply was modified 6 years, 3 months ago by Jan Dembowski.
Joy
(@joyously)

6 years, 3 months ago

Could you just explain how I’m listing the WP Jquery as a dependency? What piece of code is doing that specifically?

WordPress registers a bunch of scripts that are part of the WordPress core. But they are not enqueued unless needed.
wp_enqueue_script( 'devwp-jquery' , get_template_directory_uri() . '/jquery-3.2.1.min.js' , array( 'jquery' ), 1, true);
See the array( 'jquery' ) part? That is the dependency parameter.
https://developer.ww.wp.xz.cn/reference/functions/wp_enqueue_script/
lots of other good info at the Code Reference

What am i doing wrong?

You’ve only given a few lines of code out of the whole theme. There’s no way to know from that what you are doing wrong.
It’s easier to learn how to write a theme if you start with one that is already written. Read the code of the Twenty* themes. You don’t have to do it the same way, but you can. Also there is the Theme Developer Handbook.

Moderator Steven Stern (sterndata)
(@sterndata)

Volunteer Forum Moderator

6 years, 3 months ago

@bonsrec if you continue with profanity in your postings, we’ll need to review all your posts before they can be published. Please remember that though you’re frustrated, you’re ranting in public.
Dani Llewellyn
(@diddledani)

6 years, 3 months ago
`wp_register_style(‘bootstrap’, get_template_directory_uri() . ‘/css/bootstrap.css’, array(), false, ‘all’);
wp_enqueue_style(‘boostrap’);`

If that was a copy and paste then you are missing a t in the wp_enqueue_style line. It should be:
```
wp_enqueue_style('bootstrap');
```
i.e. bootstrap not boostrap.
Thread Starter bonsrec
(@bonsrec)

6 years, 3 months ago
Thanks for getting back to me @joyously , unfortunately that is exactly what I am doing. I am copying the wp hooks and calls from a twentytwenty installed theme, trying to learn how they’ve done it through trial and error.

The annoying thing is I’ve fixed it now and it was from doing something nobody here has mentioned.

Everybody is talking about using the get_template_directory_uri() which never works for me,

however get_bloginfo('template_directory') worked fine. So no idea still how it’s sorted.

Extremely frustrating!

@diddledan, apologies that was a typo, fixed and the error continued.

@sterndata apologies for the profanity and frustration but no mod has helped me on this forum, including yourself!
- This reply was modified 6 years, 3 months ago by bonsrec.
Joy
(@joyously)

6 years, 3 months ago

Everybody is talking about using the get_template_directory_uri() which never works for me,

however get_bloginfo(‘template_directory’) worked fine. So no idea still how it’s sorted.

I don’t see how the get_template_directory_uri function would not work, unless your theme is not in the right place and doesn’t have the correct headers in style.css.
I’ve never seen a theme in the WP repository use get_bloginfo instead.