This is my first attempt at coding a custom wordpress theme and I'm almost there. There are a few bugs as there are with anything, but I've tried a few different options at fixing them but with no success.
The link is www.studiosimplicit.com/wp.
My first issue is with nivo slider on the events page (Www.studiosimplicit.com/wp/events). Initially I was having an issue with the plugin itself, where the images were being stacked on top of each other. To correct this I manually put in code to call in the nivo .js files, and that seemed to fix that issue. But now the loading image is there but the images don't load.
I've checked the URL of the images and that's not the issue. I also enabled the "post-thumbnails" feature (as suggested on the nivoslider website as a common fix to my issue) but that doesn't appear to have fixed it. It's worth nothing that when I switch to a default theme, the slider works fine. It's when I activate my custom theme that it breaks.
My second issue is with a plugin that is supposed to set a full screen background image, automatically resized to fit browser width. Again, the plugin works when I switch to a default theme but it breaks when I switch to my custom theme.
Please help!
just include
before head and after that it will sure work.
By the sounds of it, your custom theme is missing the common hooks that allow plugins to alter/output their code.
To take a simple example, every theme should have a call to wp_head() somewhere in the
<head>
section of the output page. This allows a plugin to "hook" into your<head>
, and for example, output code to load its Javascript.Here's a real-life example. The WordPress Twentyeleven theme has this in its
header.php
file (traditionally the part of a theme that outputs the<head>
section of any page):The WP Nivo Slider uses this code when it calls
wp_enqueue_script
, for example, in itswp-nivo-slider.php
file. Behind the scenes,wp_enqueue_script
uses thewp_head()
hook in the Twentyeleven theme to output the requested Javascript include in the<head>
section (via a slightly circuitous route that ends up inwp_print_head_scripts
by default.)So, basically, if a plugin works with a provided theme, but doesn't work with your custom theme, your task is to find the hooks that are missing from your theme that the plugin is trying to use.
If you check the WordPress Theme Development documentation you'll find a list of hooks that themes should include under the section "Plugin API hooks". These are, specifically:
wp_head
wp_footer
wp_meta
comment_form
The important ones for most plugins will be
wp_head
andwp_footer
. This is where most Javascript gets included, either in the head or the footer section (just before the closing<body>
tag.)Most plugins like Javascript sliders, image galleries, etc., will simply add a new script or two in the
<head>
or footer section of the website, and perhaps include CSS files to style their content, again in the<head>
section, so those two are generally the only hooks they need.So, my initial advice would be to make sure your custom theme includes a call to
wp_head()
at the end of its<head>
section (copy the code from that working theme you've got) and also a call towp_footer()
, just before the closing</body>
tag. The chances are good that that'll get most Javascript-based plugins working.Just for the record: I had a similar problem and I had to replace the line
with this one:
But I also had to include wp_head and wp_foot as explained by Matt.