Drupal 7 - how to add unique class name to each page? - drupal

I'm second day into Drupal and pretty confused... I need to add an unique class name to the body tag to identify each page as there are many unique styling (to repeating elements) on each page across the site.
I've found a couple of code snippets online but they haven't worked. For example I've added this into the template.php file, but it doesn't work:
function testtheme_preprocess_html(&$vars) { // my theme is called "testtheme"
$path = drupal_get_path_alias($_GET['q']);
$aliases = explode('/', $path);
foreach($aliases as $alias) {
$vars['classes_array'][] = drupal_clean_css_identifier($alias);
}
}
It's suppose to add a class to the body tag but nothing is showing up for me. Am I missing something or can someone provide another solution?

The answer of Rainfall is true but :
There are already unique class by page in drupal in body element page-NAMEPAGE

Sorry if I didn't understand you right, but you can add code to the body tag in your html.tpl.php file to make it look this way:
<body class="<?php print $classes; ?>" <?php print $attributes;?>>
And that's all. After that your body tag will automatic have css classes according to the page . Also you'll have info about node type, info about if user logged in, node id.
Let me know if it works or if I made some mistake.
Thanks and good luck!

You can modify https://www.drupal.org/project/node_class module:
1) comment function node_class_preprocess_node in node_class.module
2) insert
$node_classes = node_class($node);
if (!empty($node_classes)) $node_classes .= ' ';
$content_column_class = str_replace(' class="','', $content_column_class);
$content_column_class = ' class="'. $node_classes . $content_column_class;
in page.tpl.php
before
<section<?php print $content_column_class; ?> id="content_col">

Related

Body class trace for Joomla template like WordPress

How can I trace all the relevant tags of a page in the form of classes to the <body> tag? I'm referring to how Wordpress puts the following in a page's body class attribute:
home page page-id-12766 page-template page-template-page-home-php cufon2-disabled safari theme-*
This could be extremely helpful in Joomla template development.
Thanks in advance.
I don't know whether there is any out of the box solutions exists for this. As the main structure of the site is mainly based on the Menu structure, the below snippet may be useful. This is used in the templates/mytemplate/index.php file.
<?php
$menu = &JSite::getMenu();
$active = $menu->getActive();
$pageclass= '' ;
//$currentpage = ''; //In case if wanted to get the alias of the current page in a later stage.
if( count($active->tree) > 0 ) {
foreach ($active->tree as $key => $value) {
$pageclass .= 'level-'.$key . ' pageid-'.$value. ' page-'.$menu->getItem($value)->alias ;
//$currentpage = $menu->getItem($value)->alias;
}
}
?>
<body class="<?php echo $pageclass; ?>">
This will output something like:
<body class="level-0 pageid-101 page-home">
You may improve this using various values available in the $active variable.
Here's some information on the Body Class Function
How Wordpress determines which classes to apply using it is found in post-template.php
The relevant function you're looking for is get_body_class within this template. It essentially runs a series of checks to determine if the current page meets the criteria for given classes. It also relies heavily on Wordpress specific function calls that helps make that determination.

Drupal - Add custom html in li to menu ul?

Is there any way to write some html (as you might in a block), and have that html appear as a menu item?
My situation is that I want some text that is not a link to say 'Follow us on:', and then I want 2 images which are both links to twitter and facebook.
Menu html cant do this as it requires any html you write to be part of a link, and to be the same link for that menu entry.
http://drupal.org/project/menu_html
I really want the html I add to be within the menu list.
Thanks
UPDATE
Code doesn't work well in the comments so im adding it here. This link seemed to be the closest to what you were suggesting:
http://api.drupal.org/api/drupal/includes--menu.inc/function/theme_menu_item/6
So I added this to my template.php:
function localhost_petitpim_menu_item($link, $has_children, $menu = '', $in_active_trail = FALSE, $extra_class = NULL) {
$class = ($menu ? 'expanded' : ($has_children ? 'collapsed' : 'leaf'));
if (!empty($extra_class)) {
$class .= ' ' . $extra_class;
}
if ($in_active_trail) {
$class .= 'active-trail myactive';
}
return '<li class="' . $class . '">' . $link . $menu . "</li>\n";
}
All ive done is add a class of 'myactive' so I can see if its working. My theme name is 'localhost_petitpim'. Ive refreshed the cache. My theme is set to 'Rebuild theme registry on every page.' I cant see the new class being applied. Have I done something wrong?
Thanks
You can simply hard-code text and linked images in your tpl.php file(s).
Just put html block with desired code in tpl.php after menu. Make new wraper around menu & block if current html structure of your theme is not supporting this solution. Block should be floated right or displayed inline depending on HTML+CSS of your theme.
Hope this helps.
Not a nice solution, but it works.
Add two dummy menu entrys to your menu.
Override the theme_menu_link method by implementing phptemplate_menu_link in your template.php file.
Inside the phptemplate_menu_link filter for your dummy entry and replace them with what ever html code you like.

Content elements for wordpress

I'm looking for a plugin (or better yet, not a plugin) for wordpress that lets me generate standard content elements, or includes for posts and pages.
For example, my_content_1 could be:
buy it now for $23!!
Which could then be included in posts and pages using some kind of syntax (or whatever) like:
Welcome to my site, blah blah blah.. check out this product - %my_content_1%
Not looking for anything fancy, anything that does this sort of thing would be awesome.
The point of this being much like a regular php include I could have the same information updated in one place and applied over many pages/posts.
I found something that is pretty much what I'm looking for:
http://wordpress.org/extend/plugins/reusables/
However, other suggestions would be good as I'm not too confident in the quality of the code for that plugin.
Not sure about a plugin, but how about simply creating something yourself? If you created a PHP page and set up variables such as
$content->title = "This is a title"
$content->smallText = "Insert some short paragraph here"
And then just include it in your header? You could store it in your theme directory and then call it like so
<?php $themeFolder = get_bloginfo("template_url"); ?>
<?php include($themeFolder."/content.php") ?>
Would that be suitable?
How about creating a few files and link them in using shortcode?
ie: open your themes/functions.php file add this..
<?php
function wp_my_shortcodes($atts)
{
extract(shortcode_atts(array(
'type' => '', //author, rss, adverts
), $atts));
switch($type) {
case 'author' : $display = wp_display_author_info(); break;
case 'rssview' : $display = wp_display_rss_info(); break;
case 'adverts' : $display = wp_display_adverts(); break;
default : $display = wp_display_author_info(); break;
}
return $display ;
}
add_shortcode('mycontent', wp_my_shortcodes);
function wp_display_author_info()
{
include(TEMPLATEPATH.'/my_author_info.php');
}
function wp_display_rss_info()
{
include(TEMPLATEPATH.'/my_rss_info.php');
}
function wp_display_adverts()
{
include(TEMPLATEPATH.'/my_adverts.php');
}
?>
using shortcodes inside your posts you can then bring in which ever piece of content that you want.. in the example above I've created 3 pages in the template root folder called
my_author_info.php, my_rss_info.php, my_adverts.php all of which speak for themself..
my_author_info.php
this page could use the the_author_meta() to populate a div box with included author info,
my_rss_info.php
include your subscription box to let users subscribe to your blog
my_adverts.php
include 4x 125x125 adverts?
so in the post i could use
[mycontent type='author']
[mycontent type='rssview']
[mycontent type='adverts']
if no argument is added to the shortcode then the default view is shown, in this case..
[mycontent]
would return the authorview as default...
this would then include that file in the content...
just remember to create the included files :)
I found something that is pretty much what I'm looking for:
http://wordpress.org/extend/plugins/reusables/

Wordpress : Add a custom field directly above the title input field (w/o modifiying core files)?

Does anyone know of a way to add an input field (or any type of html for the matter) directly above (or below) the title input field on the post edit page ?
I'm looking of a way to do this without modifying core files (I'm doing this as part of a plug-in which creates a custom post-type).
I'm not aware of any available wp hooks in that area of the edit-form-advanced.php file which could help out. I really hope some has come up with a genius workaround !
Since version 3.5 wordpress introduced new hooks for the add/edit post screen called edit_form_after_title and edit_form_after_editor. So now i think we can easily add new html element after wordpress input title and input content.
just use filter like this on your functions.php
add_action( 'edit_form_after_title', 'my_new_elem_after_title' );
function my_new_elem_after_title() {
echo '<h2>Your new element after title</h2>';
}
add_action( 'edit_form_after_editor', 'my_new_elem_after_editor' );
function my_new_elem_after_editor() {
echo '<h2>Your new element after content</h2>';
}
You're on the right track; pursue the add_action('admin_head') point of entry. What you want can specifically be done with a bit of JavaScript + jQuery (which is built into WP). To display the input field above the title input field, do something like this:
add_action('admin_head', 'my_admin_head_in_posts');
function my_admin_head_in_posts() {
?>
jQuery('#post').before(
'<div id="id_my_field" class="updated below-h2">' +
'<input type="text" name="my_field" value="lol" />' +
'</div>'
);
<?php
}
And you should be seeing something like this:

Drupal theme preprocess function - primary links

I recently wrote a theme function to add a class to my primary links that works great. I then wrote some css classes to style these links with custom background images. Worked out great. Now comes the problem, the link text for the primary links still is displayed. Normally this isn't a problem as I would just wrap the in a with a custom "hide" class. For example:
<span class="hide">Link Text</span>
So my question is how can I loop through the primary links and wrap the text w/ a <span> like my example? Here's my theme function that I used to add my classes.
function zkc_preprocess_page(&$vars, $hook) {
// Make a shortcut for the primary links variables
$primary_links = $vars['primary_links'];
// Loop thru the menu, adding a new class for CSS selectors
$i = 1;
foreach ($primary_links as $link => $attributes){
// Append the new class to existing classes for each menu item
$class = $attributes['attributes']['class'] . " item-$i";
// Add revised classes back to the primary links temp variable
$primary_links[$link]['$attributes']['class'] = $class;
$i++;
} // end the foreach loop
// reset the variable to contain the new markup
$vars['primary_links'] = $primary_links;
}
Is jQuery an option?
Try something like this:
$(document).ready(function(){
$('#primary li a')
.wrapInner('<span class="hide">' + '</span>');
});
EDIT:
Or if you want to go Drupal, put this guy in your foreach loop:
$link['title'] = '<span class="hide">' . check_plain($link['title']) . '</span>';
If all you want is to hide the link text, why don't you just use something like text-indent: -9999px;?
The correct methods for altering the output of the menu links can be done at the theming layer. You were on the right path with the preprocessing hook use, but there is a little more to it.
Refer to this for more information:
http://drupal.org/node/352924#comment-1189890
http://api.drupal.org/api/function/theme_links/6
Typo?
$primary_links[$link]['$attributes']['class'] = $class;
Should read;
$primary_links[$link]['attributes']['class'] = $class;

Resources