I have to "i18n" an existing drupal installation and add a second language.
I have an image on the homepage that is defined as a 'background-image' in a CSS file.
The image contains text, thus I need to show different images depending if the URL is:
http://example.com/en/
or
http://example.com/es/
How can I show a different image on the homepage depending on the user language (url based)?
I am pretty new to Drupal, so please don't assume I know anything!!!
update: I was hoping that I could define a particular image as "EN" and add an "ES" alternative, have one URL to the image (that can be used in templates or css etc), but depending on the user language, Drupal would serve up the language specific version. This would be ideal.
update2: Or maybe another approach is possible - to create a new 'content type' that simply contains an image so that: http://example.com/node/23 returns the pure image binary (image/jpeg) - then this node could be internationalized/translated like other nodes. I'm really struggling to find the 'Drupal' way to i18n images...
update3: Does Drupal store the user language in the session? If so, I could just write my own script, read the session language and serve a language specific image right? and completely avoid Drupal (eg: http://example.com/i18n-image.php?img=logo - ugly, but you get the idea), if so, how does Drupal store the session user language?
You can use the internationalization module: http://drupal.org/project/i18n
and use the function "i18n_get_lang()" to get the current language.
Name your files depending on the language:
image_LANGUAGE.jpg
image_fr.jpg
image_es.jpg
To embed the images:
<img src="<?php echo base_path().path_to_theme().'/images/'; ?>image_<?php echo i18n_get_lang(); ?>.jpg" />
EDIT:
To implement something similar for the CSS files:
You can create various CSS files depending on the language:
styles.css
styles_fr.css
styles_es.css
Into the main file (styles.css) you can put all CSS that is not related to a specific language.
Into the other files you can put the CSS related to a specific language.
styles_fr.css:
div.item1 { background: url('../images/item1_fr.jpg'); }
styles_es.css:
div.item1 { background: url('../images/item1_es.jpg'); }
And then you create a preprocess function for the page in your template.php file that will include the specific CSS style sheet based on the current language:
function YOURTHEME_preprocess_page(&$vars, $hook){
drupal_add_css(path_to_theme().'/css/styles.css');
drupal_add_css(path_to_theme().'/css/styles_'.i18n_get_lang().'.css');
}
Or you can directly use drupal_add_css() into a template file.
I would go with hook_preprocess_page. For example, it can be a good idea to switch style sheets based on the language:
function foobar_hook_preprocess_page(&$variables, $hook) {
global $language;
if($language != 'en') {
$sheets = array();
foreach($variables['css']['all']['theme'] as $stylesheet => $value) {
if (strstr($stylesheet, path_to_theme())) {
$stylesheet = str_replace('.css', '-'. $language->language .'.css', $stylesheet);
}
$sheets[$stylesheet] = $value;
}
$vars['css']['all']['theme'] = $sheets;
$vars['styles'] = drupal_get_css($vars['css']);
}
}
For further explanations, see this blogpost: http://becircle.com/language_based_stylesheet_switching_your_theme
Just to extend your answers for Drupal 7: There's a global variable $languagethat provides a standard class containing many information about the current language, including $language->language with the language short code.
It's defined in modules/locale/locale.admin.inc.
So call
<?php
global $language;
print 'images/'.$language->language.'/image.png';
?>
in your theme and catch all the "$language->language is undefined" errors.
Related
I’m developing a custom module, but need that only in the page where I use this module add some CSS and JavaScript files, I know how to do this from template.php using a condition to specific node, but I need do it more generic, that the condition can stay in .module file, or some similar solution.
I have a little code in my .module file:
function mymodule_init() {
$url = request_uri();
$path = drupal_get_path('module', 'module_name');
if ($url == 'xxxx') {
drupal_add_js($path . '/js/animations.js');
}
}
This work very well, but I’m limiting, because I need know the URL where the module will used.
Rather than checking for the URL, you should add your drupal_add_js when you initialize the code your module will be using on a given page.
For example, if you are adding a block, you could add it to hook_block_view. If you're adding a theme template, you could do it in hook_preprocess for that theme template.
I'm just starting out with drupal and need some custom html for an intricate menu system. My plan is to override the html-generating functions in template.php.
My theme name is "Drupal subtheme" and the navbar I would like to target has the machine name "menu-usm-navbar-small". What should I name the functions that overrides the default html-printouts?
I think I have tried every possible combination of these. Some examples of what I've tried:
function drupal_subtheme_menu_link($variables) {
return "foo";
}
function drupal_subtheme__menu_usm_navbar_small($variables) {
return "foo";
}
If you want to place custom HTML inside, why do you need to do it trough Drupal's functions?
Let's say, that you want to insert your code into page.tpl.php (most likely) - just open that file, edit it, add your code there.
Since you are overriding some theme - copy that file from original theme, and then edit it (don't forget to clear the cache).
For each node preview, I want to have little flag icons at the top representing the available translations. I have seen the language switcher code, but it outputs all the languages all the time. That is annoying because people will click their language and then find that the page is only available in English anyway (I have a site with many articles in a great variety of languages). I have seen this done though. I'm relatively new to Drupal programming. Can anyone give me a pointer?
Thanks!
Figured it out by myself, and noting it here because I know I'm not the only one with this issue.
The template I'm working off is called scaccarium, so I went to /themes/scaccarium/template.php and added the following function:
function scaccarium_preprocess_node(&$vars) {
$node = $vars['node'];
$translationlinks = array();
// Move translation links into separate variable
foreach ($node->links as $key => $value) {
if ($value['attributes']['class'] == 'translation-link') {
$translationlinks[$key] = $value;
// unset($vars['node']->links[$key]);
}
}
$vars['translationlinks'] = theme('links', $translationlinks, array('class' => 'links translationlinks inline'));
}
If your template is called something else, you should obviously go to a different folder and also change the first word of the function name. And if your theme comes with an existing _preprocess_node function, carefully modify it.
Then, I went to my template's node.tpl.php and I added
<?php if ($translationlinks) {
print $translationlinks;
} ?>
next to the title.
Then I had to clear the Drupal cache (even though caching was disabled!) in Performance > Caching in order to get this to work.
Done!
...
To add language links at the top of full nodes, I had to add another "print $translationlinks" at a different place in node.tpl.php as well, as the h3 title thing was just for node previews. Then, to remove the redundant language links at the bottom of full nodes, I tried that unset line that you see commented out in template.php - I found that it had no effect even though another website had recommended it. So what I ended up doing was using CSS for this, adding the following to my template's CSS file:
.node-links .translation-link {
display: none;
}
I hope that my experience will help someone else with the same problem.
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 :)
this is a question how to override themable items in Drupal 6.
According to the book "Pro Drupal Development", we can override themable items in two ways:
overriding via Theme functions
overriding via Template files
So for example, in order to reformat the breadcrumb, I can:
via function theme_breadcrumb($breadcrumb)
via breadcrumb.tpl.php
But on my local testing server, the second approach (i.e. via template file) is not working! I see no breadcrumbs at all, while the first approach works fine.
Any idea how could this happen? any special settings I need to configure my Drupal?
thanks!
My custom theme "greyscale":
sites\all\themes\custom\greyscale:
- breadcrumb.tpl.php
- greyscale.info
- node.tpl.php
- page.tpl.php
- style.css
- template.php
relevant file contents:
* template.php:
function phptemplate_preprocess_breadcrumb(&$variables) {
$variables['breadcrumb_delimiter'] = '#';
}
breadcrumb.tpl.php:
Theme functions are setup to either use a template or a function to generate the markup, it will never use both as that's pointless.
For a theme function to use a template, it must be defined when you define it in hook_theme.
A template + preprocess function and a theme function really does the same thing: produce markup. It depends on the situation which method is best to use, that's why we have two. The good thing about templates, is that it allows themers to change the markup, without know much about PHP or Drupal.
Cache
Drupal caches all templates and theme functions defined in your theme, when you create new ones, you need to clear the cache, this can be done by:
Use drush
Clearing cache in admin/settings/performance
Use devel to clear it on each page load. Usable during development, biut will kill performance.
Switching theme back and forth will work too, but it really not the desired way to do it.
I personally always find it easier to alter breadcrumbs through template.php using hook_breadcrumb()
function mytheme_breadcrumb($breadcrumb) {
$sep = ' > ';
if (count($breadcrumb) > 0) {
return implode($breadcrumb, $sep) . $sep;
}
else {
return t("Home");
}
}
Any particular reason why you wish to use a .tpl.php file?