EDIT: My question applies to Drupal 6 & 7, though my code example is Drupal 6. People have provided answers are useful for both versions of Drupal.
I'm currently working in Drupal creating a mobile theme for a Drupal 6 website and trying to remove all unnecessary core and module JavaScript and css through the preprocess_page function in my template.php file. The css files are successfully removed, but I can't seem to get the JavaScript to be removed. Here's what I've got. In this example, everything is successfully removed except for the the ajax scripts.
Any idea what I'm doing wrong?
<?php
function mytheme_preprocess_page(&$vars) {
//////// remove unneccesary drupal head files for mobile version
// CSS
$css = drupal_add_css();
// core
unset($css['all']['module']['modules/user/user.css']);
unset($css['all']['module']['modules/node/node.css']);
unset($css['all']['module']['modules/system/defaults.css']);
unset($css['all']['module']['modules/system/system.css']);
unset($css['all']['module']['modules/system/system-menus.css']);
// contributed -- automatically generate the path—— just easier this way
$rm[] = drupal_get_path('module','filefield').'/filefield.css';
$rm[] = drupal_get_path('module','flickr').'/flickr.css';
$rm[] = drupal_get_path('module','logintoboggan').'/logintoboggan.css';
$rm[] = drupal_get_path('module','logintoboggan').'/logintoboggan.css';
$rm[] = drupal_get_path('module','fieldgroup').'/fieldgroup.css';
$rm[] = drupal_get_path('module','views').'/css/views.css';
$rm[] = drupal_get_path('module','content').'/theme/content-module.css';
// remove the contribs from the array
foreach ($rm as $key => $value) {
unset($css['all']['module'][$value]);
}
// JAVASCRIPT
$scripts = drupal_add_js();
unset($scripts['module']['sites/all/modules/ajax/ajax.js']);
unset($scripts['module']['sites/all/modules/ajax/jquery/jquery.a_form.packed.js']);
// recreate the tempalate variables
$vars['styles'] = drupal_get_css($css);
$vars['scripts'] = drupal_get_js('header', $scripts);
}
?>
ETA: Here is the way the scripts print out in the header:
<script type="text/javascript" src="/sites/all/modules/ajax/jquery/jquery.a_form.packed.js?P"></script>
<script type="text/javascript" src="/sites/all/modules/ajax/ajax.js?P"></script>
I found a potentially better solution for this sort of problem. I tried Kerri's approach since Matt V says it worked for him, but I really didn't want to edit template.php if I could avoid it and regardless it wasn't working in my environment. My problem was that a couple JS files throw errors on one particular page. All I did was write a very simple new module that only runs on the desired page. So- I created a basic .info file and below is the .module code. Worked like a charm for me. Just replace "mysite_mymodule" with whatever you name your module and replace "my-page-alias" with whatever page alias you're trying to effect.
<?php
/**
* Implements hook_js_alter().
*/
function mysite_mymodule_js_alter(&$javascript) {
$alias = drupal_get_path_alias($_GET['q']);
if ($alias == "my-page-alias") {
/**
* documentation about what I did and why I did it...
*/
unset($javascript['sites/all/modules/dhtml_menu/dhtml_menu.js']);
unset($javascript['sites/all/modules/apachesolr_autocomplete/apachesolr_autocomplete.js']);
}
}
You can directly use the drupal header in drupal 7.
you can clean the other module javascript you don't need
function module_preprocess_page(&$vars) {
// clean unnecesary script from the page
if (arg(0) != 'admin' || !(arg(1) == 'add' && arg(2) == 'edit') || arg(0) != 'panels' || arg(0) != 'ctools') {
$javascript = &drupal_static('drupal_add_js', array());
unset($javascript['misc/jquery.js']);
unset($javascript['misc/jquery.once.js']);
drupal_static('drupal_add_js', $javascript);
}
}
The Ajax module uses hook_preprocess_page to add its scripts. The Ajax module may be executing its hook implementation after your module. If that's the case, you could adjust the weight of your module, to fire after Ajax. You could check first to make sure, by outputting the contents of $scripts (using something like the Devel module's dpm() function), just before you do the unsetting.
UPDATE: Since you're making the changes in a template preprocess function, my initial hypothesis about it being an issue of module weights wouldn't apply. I added your template function on a test site and it removed those two scripts, for me. I had to adjust the path because my ajax module was under /sites/all/modules/contrib. That's just where I happen to keep my contrib modules, but you might double check that you're using the right path.
Another thing that threw me off for a few minutes was that I accidentally added the code to the wrong theme; so, that's another thing to check. Also, check that Javascript caching is disabled on the Performance page.
You have to do it the other way around. Unsetting files of other contrib modules explicitly couples your module to every other module that outputs js to the header. You won't be able to maintain that for too long before it breaks. What happens when more js files get added by contrib modules?
You're best to create a mask of paths you want to output and unset everything except those.
Drupal 7 has some hooks that will let you do that but I can't remember them. If you're on D6 you're kinda stuck.
I did write a dirty workaround for Drupal 6 for this same problem with css files. Here is the whole module (it was only 3 functions). I'm sure you can adapt it to js files too.
Create your mask (expose it to the variables table)
function destroy_mask_styles() {
return variable_get('destroy_mask_styles', array('all/modules/mymodule', 'themes/mytheme'));
}
Then here comes the dodgey part. This function looks for the paths of the css files in the header and unsets them if they don't match.
function destroy_styles($var_styles) {
//this is a bit dodgey. But it's probably the easiest way to implement
$masks = destroy_mask_styles();
$styles = array();
foreach(explode("\n", $var_styles) as $style) {
foreach($masks as $mask) {
if(strpos($style, $mask) > 0) {
$styles[] = $style;
}
}
}
return implode("\n", $styles);
}
Then in preprocess_page, (this might be considered where the dodgyness happens)
function destroy_preprocess_page(&$variables) {
//destroy some css and scripts we don't want
$styles = destroy_styles($variables['styles']);
$variables['styles'] = empty($styles) ? $variables['styles'] : $styles;
}
If you want to include everything from one module (for example), just alter the paths that get matched to include the path to the module's root folder. Don't worry about file names.
Remember that this is not the ideal way to do this. There might be a better way in D6 but there are no hooks here so probably not.
Good luck!
Related
I would like my custom Drupal 8 module to force a different template for pages that match a certain URL. Here is my module structure:
/sass_edit
/css
/js
/template
builder_template.html.twig // this is the template file
sass_edit.module
...
sass_edit.*.yml // various yml files
These are the contents of builder_template.html.twig:
<h1>test</h1>
Here are the relevant lines of code in my .module file:
function sass_edit_theme_suggestions_alter(array &$suggestions, array $variables, $hook) {
$current_path = \Drupal::service('path.current')->getPath();
if(\Drupal::currentUser()->isAuthenticated() && strpos($current_path, "/builder/") >= 0) {
$suggestions[] = 'builder_template';
}
// kint($suggestions);
// die();
}
When I visit a page whose URL contains /builder/, the code runs and adds the string builder_template to the $suggestions array. However, when the page is rendered, the new template is ignored. I have tried flushing caches, with no results.
I'm not sure how to proceed. All the documentation I've found refers to adding theme suggestions from a custom theme, not a custom module.
Any idea what I'm doing wrong? Thank you so much for any help!
Maybe you have a typo in the code you pasted but the folder where you have your templates overrides should be templates and not template as you wrote. Don't forget to flush caches after changing the name of the directory ;)
Right now I'm trying to switch the template that Wordpress uses depending on the device that is viewing the site.
The exact issue here is that the ONLY thing that seems to be switching are the scripts and stylesheets. The actual templates them selves (index, header, footer) stay the same.
Here is the function I'm using to do this:
<?
function fxn_change_theme($device) {
$header = $_SERVER['HTTP_X_UA_DEVICE'];
if ($header === 'mobile') {
$theme = 'jankness-mobile';
} elseif ($header === 'tablet') {
$theme = 'jankness-tablet';
} else {
$theme = 'jankness-desktop';
}
return $theme;
}
add_filter('template', 'fxn_change_theme');
add_filter('option_template', 'fxn_change_theme');
add_filter('option_stylesheet', 'fxn_change_theme');
?>
Also, the only filter that's doing anything seems to be 'template', the option filters don't do much. I've tried looking up what they do and it's not clear to me at the moment.
What might be the issue here?
Basically, since the code I was using was sitting in functions.php it was not able to manipulate the theme content earlier enough in the Wordpress core process. So the solution was to move the code into a very simple plugin exactly as it is, and hook in to the theme_setup point using the same code I used here.
[For Drupal 6] Let's say I've created a content type called "my_content_type". I can override the default template for that entire content-type by creating "page-node-my_content_type.tpl.php". But, what would be the best way to then further customize a single node of that content type (e.g., node 5555)?
I tried the following, but none worked:
page-node-5555.tpl.php
page-node-my_content_theme-5555.tpl.php
node-5555.tpl.php
None of these work. They all continue to use my original content-type template.
Drupal's page templates work on a suggestion system. Based on the current URL, an array of possible template files is created. It loops through the array (in reverse order) looking for template files that exists. The first one it finds, it will use.
drupal's theme system provides a hook for you to modify the template suggestions.. open up your template.php and find
function phptemplate_preprocess_page(&$vars) {
the $vars variable is what contains the suggestions, specifically $vars['template_files']
By default the only page suggestions that are available are
page.tpl.php
page-node.tpl.php
page-node-[node_id].tpl.php
As far as im aware, page-node-[node_type].tpl.php does not work by default, so its likely you have already modified the preprocess_page template to added in this functionality.
However if you want to add more specific templates you could do something like this...
function phptemplate_preprocess_page(&$variables) {
if ($variables['node']->type != "") {
$variables['template_files'][] = "page-node-" . $variables['node']->type;
$variables['template_files'][] = "page-node-" . $variables['node']->type . "-" . $variables['node']->nid;
}
}
this will allow the following hierarchy of template suggestions
page.tpl.php
page-node.tpl.php
page-node-[node_id].tpl.php
page-node-[node_type].tpl.php
page-node-[node_type]-[node_id].tpl.php
In Drupal 7 just copy the page.tpl.php template and rename it as
page--node--[node:id].tpl.php
Clear cache and start tweaking..
function phptemplate_preprocess_page(&$variables) {
if ($variables['node']->type != "") {
$variables['template_files'][] = "page-node-" . $variables['node']->type;
$variables['template_files'][] = "page-node-" . $variables['node']->type . "-" . $variables['node']->nid;
}
}
This code should not work because hook_preprocess_page() does not get passed any node information. hook_preprocess_node() does. So you can easily create a custom node.tpl, but you cannot easily create a custom page.tpl for a specific node. Not that I've been able to figure out anyway :)
Later...
In default Drupal, page-node-NID.tpl.php will work with no special coding. On a site of mine, it wasn't working, however, and I used the following code to make it work:
/**
* Implementation of hook_preprocess_page().
*/
function MYMODULE_preprocess_page(&$variables) {
// Allow per-node theming of page.tpl
if (arg(0) == 'node' && is_numeric(arg(1))) {
$variables['template_files'][] = "page-node-" . arg(1);
}
}
I am currently using drupal 6 for a site I'm working on. I have a MYTHEME_preprocess_page() function that adds a few variables to the page.tpl.php template from the taxonomy and from a cck field. It was working correctly for a bit, and then the $vars['node'] is empty, but only for 2 content types. The 'node' variable is available to the preprocess_page function in other content types.
I thought it was a problem with using the following code, but when I remove all of this, the 'node' variable is still empty.
function mytheme_preprocess_node(&$vars, $hook) {
$function = 'mytheme_preprocess_node'.'_'. $vars['node']->type;
if (function_exists($function)) {
$function(&$vars);
}
}
Does anyone know of any gotchas or bugs that might be removing the 'node' variable? I can't seem to figure out where I'm going wrong. I'm at a loss.
Here is my complete mytheme_preprocess_page() function.
function mytheme_preprocess_page(&$vars, $hook) {
if ($hook == 'node' || $hook == 'page') {
if (is_object($vars['node'])) {
// grab the header image if it exists to make it avaialble to the content header
$vars['header_image'] = _mytheme_get_header_image($vars);
// get the taxonomy term to put in the content header
if (count($vars['node']->taxonomy) > 0) {
$vars['tax_term'] = "<div class=\"terms\">" . _mytheme_get_first_taxonomy_term($vars['node']->taxonomy) . "</div>";
}
// add the teacher's credentials to the content header
if ($vars['node']->field_credentials[0]['view'] != '') {
$vars['teacher_credentials'] = '<span class="teacher-creds">' . $vars['node']->field_credentials[0]['view'] . '</span>';
}
}
}
}
After going through and disabling modules one-by-one, I determined that the problem is related to the module, node_breadcrumb. A similar issue was filed here: http://drupal.org/node/616100#comment-2199374
In the 3rd comment, you'll see a link to another issue with a resolution
For others that run into this, I had the same issue as a result of using the jQuery UI module. Disabling and re-enabling fixed it, and I could not track down the specific issue, but it appeared to be related to $static variables in some path check functions.
To others that stumble their way into here, I suggest you pull some of the more obvious modules right out of the module folder on your dev setup, see if things change, and then put them back in there until you figure it out.
Another option is to search for instances of _preprocess_page(, $variables['node'] and $vars['node'] to see if some contributed code is unwittingly unsetting a node when it shouldn't be.
What is the best method for including a CSS or Javascript file for a specific node in Drupal 6.
I want to create a page on my site that has a little javascript application running, so the CSS and javascript is specific to that page and would not want to be included in other page loads at all.
I'd advise against using hook_nodeapi for that. Adding CSS and Javascript is related to layout so hook_nodeapi is not the place for it: use themeing. This way, you can override those files when you're going to develop a new theme. Doing that with the nodeapi approach would be a bit harder (you'd have to search the js/css list for the files, remove them and replace them with your own).
Anyway: what you need to do is add a node preprocess function that adds those files for you. You can do this either in a module or in a custom theme. For a module this would be:
function mymodule_preprocess_node(&$variables) {
$node = $variables['node'];
if (!empty($node) && $node->nid == $the_specific_node_id) {
drupal_add_js(drupal_get_path('module', 'mymodule') . "/file.js", "module");
drupal_add_css(drupal_get_path('module', 'mymodule') . "/file.css", "module");
}
}
or for a theme:
function mytheme_preprocess_node(&$variables) {
$node = $variables['node'];
if (!empty($node) && $node->nid == $the_specific_node_id) {
drupal_add_js(path_to_theme() . "/file.js", "theme");
drupal_add_css(path_to_theme(). "/file.css", "theme");
}
}
Don't forget to clear the cache, first.
These functions are called before the node is themed. Specifing the js/css there allows for a cascaded approach: you can have the generic/basic stuff in the module and provide enhanced or specific functionality in the theme.
I use the preprocess functions but this has some issues. $variables['styles'] is usually set before the node preprocess function is called. In other words drupal_get_css is already called which makes you calling drupal_add_css useless. The same goes for drupal_add_js. I work around this by resetting the $variables['styles'] value.
function mytheme_preprocess_node(&$variables) {
$node = $variables['node'];
if (!empty($node) && $node->nid == $the_specific_node_id) {
drupal_add_js(path_to_theme() . "/file.js", "theme");
drupal_add_css(path_to_theme(). "/file.css", "theme");
$variables['styles'] = drupal_get_css();
$variables['script'] = drupal_get_js();
}
}
This seems to work for most cases.
P.S. There's hardly any ever need to create a module to solve a theming problem.
Cheers.
This seems like a good solution:
http://drupal.org/project/js_injector
and
http://drupal.org/project/css_injector
It works when you want to insert inline code into something other than technically a node so there's no node id and no PHP input option available. Like I used it to inject small jQuery tweaks into a couple of admin pages. It works by path rather than node id.
The best solution I've come up with so far is to enable the PHP input mode, and then call drupal_add_css and drupal_add_js as appropriate in a PHP block in the start of the body of your node.
This should do the trick - a quickie module that uses the hook_nodeapi to insert the JS/CSS when the node is viewed.
function mymodule_nodeapi(&$node, $op, $a3 = NULL, $a4 = NULL) {
// the node ID of the node you want to modify
$node_to_modify = 6;
// do it!
if($op == 'view' && $node->nid == $node_to_modify) {
drupal_add_js(drupal_get_path('module', 'mymodule') . '/mymodule.js');
drupal_add_css(drupal_get_path('module', 'mymodule') . '/mymodule.css');
}
}
This avoids security issues with enabling the PHP input filter, and doesn't require a separate node template file which could become outdated if you updated the main node template and forgot about your custom one.
You can have a custom template for that node (node-needsjs.tpl.php) which calls the javascript. That's a little cleaner than using PHP right in the node body, and makes changes to content easier in the future.
EDIT: I don't think I was very clear above. You want to name the template file node-(nodeid).tpl.php. So if it was Node 1, call the file node-1.tpl.php