I'm fiddling with a WordPress theme. I'm aware I can use wp_enqueue_script in my header.php to load WordPress's supplied jQuery library.
I was just going to use wp_enqueue_script in my header, but it seems inefficient when I only want to use it on a particular Page (just on one single page with a particular page_id.)
Given that, what's the best way of including jQuery only on one particular Page?
Presumably I can't do page_id detection in header.php, because that won't be in The Loop, right? But I'm guessing I'm missing some fairly obvious method -- I'm fairly new to theme development...
Thanks!
Yes you can, is_page doesn't need to be called in The Loop, since it doesn't change when The Loop runs. So is_page(42) will only return TRUE if you're on the page with id 42. It also works with the page title or name (slug), which might be more future-proof if you ever replace delete this page and replace it with a new one with the same slug.
here is an article about dynamic body ids
http://perishablepress.com/press/2009/05/26/dynamic-body-class-id-php-wordpress/
after you get your page name you can add a conditional statement in your template index.php that says something like this in your page header or before the closing body tag:
// $page_name would be the page name you extracted with a function from the post
if($page_name === 'about'){
echo '<script type="text/javascript" src="jquery.js"></script>'
}
Related
Bit is a basic question here but can someone confirm that this statement be confirmed: WordPress Pages (certain templates created within) can pull different CSS and JS?
Or - does WordPress only permit universal CSS + JS to be pulled across the entire site?
Thanks for clearing this up.
Depends on what plugin and themes you use. The WordPress/PHP functions wp_enqueue_style() and wp_enqueue_script() can be used literally by everyone (core, themes, plugins, you) to request WordPress to load styles or JavaSctript. You can combine this with WordPress functions to check whether the current page is something you want to filter for (post type, post, front-page, category archive, template, etc.). Here is an example to load a custom style if on front page :
if (is_front_page()) {
wp_enqueue_style('custom-frontpage', 'my/path/to/frontpage.css');
}
You will have to hook this piece of code to the wp_enqueue_script action so that WordPress executes it at the appropriate time. Here is an example using an anonymous function:
add_action('wp_enqueue_scripts', function() {
if (is_front_page())
wp_enqueue_style('custom-frontpage', 'my/path/to/frontpage.css');
});
You can also register your code as a "normal" function and pass the functions name to add_action() instead.
Edit: Enabling and disabling plugins is a bit more difficult, since you can never know how they implement their features without examining the source code. Here are my thoughts on this:
The plugin likely uses the above method (wp_enqueue_styles, wp_enqueue_scripts) to register it's styles and scripts. The plugin, since it assumes to be needed on all pages and posts, does this on every page without the conditional checking described earlier.
You could do one of the following to stop the plugin from doing this:
Identify the place where the plugin loads the styles and scripts and add the if-statement to only do so if the post-ID matches your desired post-ID. This method is bad since your changes are lost every time the plugin is updated.
Write a "counter plugin" (you could just add it to your theme or find a plugin that allowes you to add PHP to your page) that "dequeues" the style and script added by the plugin with inversed conditional tag
The counter-plugin approach would look as follows:
function custom_unregister_plugin() {
if (not the desired blog post) {
wp_dequeue_style('my-plugin-stylesheet-handle');
wp_dequeue_script('my-plugin-script-handle');
}
}
Make sure this function is executed after the enqueuing-code of your plugin by giving it a low priority in the same hook (999 is just an example, test it yourself):
add_action('wp_enqueue_scripts', 'custom_unregister_plugin', 999);
With wp_enqueue_style() you can add stylesheet (https://developer.wordpress.org/reference/functions/wp_enqueue_style/)
You can use it after detecting which template is used
function enqueue_custom_stylesheet() {
if(get_page_template() == 'contact.php')
wp_enqueue_style( 'contact-style', get_template_directory_uri().'/contact.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_stylesheet' );
You can use wp_enqueue_style for your CSS, wp_enqueue_script for your JS, wp_localize_script to pass variables from PHP to JS.
You can call these with hooks like:
funtion enqueue_my_stuff()
{
// your enqueue function calls
}
add_action('wp_enqueue_scripts','enqueue_my_stuff'); //front end
add_action('admin_enqueue_scripts','enqueue_my_stuff'); //admin panel
add_action('login_enqueue_scripts','enqueue_my_stuff'); //login screen
Here's my issue. My company needs a vendor database added to our wordpress website. None of the existing plugins will even come close to what we need, and we already have a mysql database with all of our information, so we need to create a plugin or something to do what we need.
These urls need to be direct-accessible and have SEF urls. So, for example:
mysite.com/vendors/
mysite.com/vendors/pipe-manufacturers/
mysite.com/vendor/bobs-pipes/
And, the custom content needs to appear inside the wordpress template.
There are really 2 options:
1) Find a way to write our application outside of wordpress, but find a way to bootstrap wordpress to show the header, footer, and sidebar.
2) Run the app from inside wordpress.
So I went for option #2. I created a new template file named "vendor.php", and began working. I added this code to my functions.php of my theme:
add_filter( 'template_include', 'xyz_template_check' );
function xyz_template_check() {
global $template;
$rqst = $_SERVER['REQUEST_URI'];
$ra = split("/", $rqst);
if ($ra[1] == "vendors") {
$template_file = get_stylesheet_directory() . '/vendors.php';
return $template_file;
}
return $template;
}
So what the above code does, if it sees the word "vendors" as the first part of the url after the site name, it sends you to vendor.php. This works PERFECTLY....
except...
Wordpress believes that the page is not found. It returns a 404 header, and NOT FOUND into the page title and breadcrumb.
Adding a PAGE called "Vendor Database" with the permalink "/vendors/" fixes the main page. But there will be literally hundreds of vendors and different categories. I cant be creating a custom page for each one. This needs to be dynamic.
So, how do I make wordpress give a 200, and supply an acceptable page title, breadcrumb, etc.
Don't even get me started on the danged wp_title filter. This did NOT work as documented. Although, it just occurred to me that this might be an issue with Wordpress SEO (the wp_title filter issue).
Anyone got an idea on this?
Ok got this. The solution was to use the rewrite api, as mentioned above, to look for the pattern /vendors/, letting it know that it was a valid URL. Coupled with my existing template override, this is what I needed.
I've just discovered that if you want to alter a specific page (or group of pages) all you need is to add templates file to the core templates. For instance, I need to theme my /helloword page using a page--helloworld.tpl.php and node--helloworld.tpl.php template files.
Now all I get is a blank screen so I tried to write a preprocess function that adds support for custom theme files like:
<?php
/**
* Adding or modifying variables before page render.
*/
function phptemplate_preprocess_page(&$vars) {
// Page change based on node->type
// Add a new page-TYPE template to the list of templates used
if (isset($vars['node'])) {
// Add template naming suggestion. It should alway use doublehyphens in Drupal7.
$vars['template_files'][] = 'page--'. str_replace('_', '-', $vars['node']->type);
}
}
?>
I see no syntax error but I still get a blank screen. Still no luck
Is someone able to figure out what's wrong in the code/routine?
Drupal7 + Omega Sub-Theme
Kind Regards
I think there's a tiny bit of confusion here: a template file named node--type.tpl.php will automatically be called for any node which has the type type...you don't need to add the template suggestions in yourself.
There is one caveat to this, you have to copy the original node.tpl.php to your theme folder and clear your caches otherwise Drupal won't pick it up.
Also you don't want to use the phptemplate_ prefix...rather you want your function to be called MYTHEMENAME_preprocess_page.
Your code to add the page template based on the node type looks spot on, see if you still have the problem after you change your function name and clear the caches.
Hope that helps :)
I am working in worpress front page.
I want to add a plugin to the page at a specific location manually but adding the code to the page myself.
I basically want to include a plugin in a certain page on a certain location. So I'm create a div...
<div id="plugin-holder">
**Plugin-will-appear-here-with-this-code**
</div>
Don't anyone know how this is done please?
Thanks
If you're wanting a plugin to appear somewhere, you'll be looking for "shortcode" functionality.
This is actually surprisingly easy to code, check out the examples in the Codex under Shortcode API - ie:
function bartag_func( $atts ) {
// ... do more things here ...
return "text to replace shortcode";
}
add_shortcode( 'bartag', 'bartag_func' );
Once you've called these functions you can use [bartag] in code and it will run your function and replace the shortcode with the generated text your function returns.
If you're adding shortcode functionality to your site, it generally makes most sense to code a really simple plugin and put it in that. The reason why this works best is that, over time, it's really easy to forget and upgrade a theme by mistake (or even change to a new theme) and thus break your site by losing your custom code in your former functions.php. Surprisingly, this is pretty easy to achieve and only requires some specially formatted comments at the top of your plugin file and a little common sense in coding - there are many tutorials and "how to"s around!
Here's a useful shortcode tutorial: http://www.reallyeffective.co.uk/archives/2009/06/22/how-to-code-your-own-wordpress-shortcode-plugin-tutorial-part-1/
You should add the relevant plugin code to functions.php.
I suspect you'll want to use some conditional tags, like is_home() to pinpoint your location. But maybe not, depending on what you are trying to do,
Also, if you're trying to to insert from a pre-existing plug-in, make sure you remove the register_activation_hook or activate_pluginname action.
If your plugin supports a sidebar widget you can simply "widgitize" the div tag that you wish to insert the plugin into.. Google the term and you are gonna find many resources.
I want to display custom html code when a post is rendered (so not when is inserted into the database).
I currently do this with add_filter('the_content', 'my_custom_method'). The only problem is that I want this do be displayed only inside the post (when is viewed in its own page), not when all posts are rendered .
I banged my head against the wall, but couldn't find any method to tell me if i'm currently inside an individual post or not (this has to work for every url rewriting possible, so i can't rely on url)
Is there such a method? I believe it should be, but i can't find it. Thanks.
the function for checking if the post is in its own page is is_single()
add_filter('the_content', 'my_custom_method');
function my_custom_method(){
if(is_single()){
//code for your custom html code
}
}
the function is_single() checks if the page being rendered is a single page or not.
The easiest way to do this would be to modify your templates. Wordpress template sets should have a file named single.php (inside wp-content/themes/<theme name>). This is the page that gets rendered when you are viewing the page for a single post.
You could edit this file and insert whatever you needed to for the posts there.